|
|
@@ -29,6 +29,16 @@
|
|
|
</div>
|
|
|
|
|
|
<div class="ai_btn_box" v-if="!pan(item.aiContent).length && !item.loading">
|
|
|
+ <!-- <div class="popoverBox" v-if="item.uid.length>0">
|
|
|
+ <div class="showBox" v-if="showPopoverUid===item.uid" v-click-outside="handleBlur">
|
|
|
+ <span @click="generateChart(item,0)">柱状图</span>
|
|
|
+ <span @click="generateChart(item,1)">折线图</span>
|
|
|
+ <span @click="generateChart(item,2)">圆饼图</span>
|
|
|
+ </div>
|
|
|
+ <div class="btnBox" @click.stop="showPopoverUid===item.uid?showPopoverUid = null:showPopoverUid = item.uid">
|
|
|
+ <img src="https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/default%2F%E5%9B%BE%E8%A1%A81735027853698.png">
|
|
|
+ </div>
|
|
|
+ </div> -->
|
|
|
<img src="../../../../assets/icon/course/pasete.png" @click="onCopy(item.aiContent)" />
|
|
|
<!-- <img src="../../../../assets/icon/test/test_bianji.png" v-if="index >= 2" @click="edit(index)" /> -->
|
|
|
</div>
|
|
|
@@ -152,7 +162,7 @@
|
|
|
</div>
|
|
|
<el-button type="primary" @click="confirmSelection">确认</el-button>
|
|
|
</div>
|
|
|
-
|
|
|
+
|
|
|
|
|
|
</el-dialog>
|
|
|
</div>
|
|
|
@@ -338,7 +348,24 @@ let converter = OpenCC.Converter({
|
|
|
from: "cn",
|
|
|
to: "hk"
|
|
|
});
|
|
|
-
|
|
|
+const clickOutside = {
|
|
|
+ bind(el, binding) {
|
|
|
+ // 在元素上绑定一个点击事件监听器
|
|
|
+ el.clickOutsideEvent = function(event) {
|
|
|
+ // 检查点击事件是否发生在元素的内部
|
|
|
+ if (!(el === event.target || el.contains(event.target))) {
|
|
|
+ // 如果点击事件发生在元素的外部，则触发指令绑定的方法,将点击的event数据传过去
|
|
|
+ binding.value(event);
|
|
|
+ }
|
|
|
+ };
|
|
|
+ // 在文档上添加点击事件监听器
|
|
|
+ document.addEventListener("click", el.clickOutsideEvent);
|
|
|
+ },
|
|
|
+ unbind(el) {
|
|
|
+ // 在元素上解除点击事件监听器
|
|
|
+ document.removeEventListener("click", el.clickOutsideEvent);
|
|
|
+ }
|
|
|
+};
|
|
|
export default {
|
|
|
props: {
|
|
|
courseId: {
|
|
|
@@ -350,6 +377,9 @@ export default {
|
|
|
}
|
|
|
|
|
|
},
|
|
|
+ directives: {
|
|
|
+ "click-outside": clickOutside // 注册自定义指令
|
|
|
+ },
|
|
|
data() {
|
|
|
return {
|
|
|
stype: 1,
|
|
|
@@ -488,7 +518,8 @@ export default {
|
|
|
getWangLoading: false,
|
|
|
wangData: [],
|
|
|
canUseWangData: true,
|
|
|
- hasGeneratedGuess: false
|
|
|
+ hasGeneratedGuess: false,
|
|
|
+ showPopoverUid:null,
|
|
|
};
|
|
|
},
|
|
|
watch: {
|
|
|
@@ -1770,6 +1801,54 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
+ async generateChart(item,type=0){//0：柱状图 1：折线图 2：圆饼图
|
|
|
+ let _tableData = await this.getContentTable(item.aiContent);
|
|
|
+ this.showPopoverUid = null;
|
|
|
+
|
|
|
+ if(_tableData && _tableData.length>0){
|
|
|
+ console.log(_tableData,type)
|
|
|
+ }else{
|
|
|
+ return this.$message.error('未提取到表格内容')
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getContentTable(_content) {
|
|
|
+ return new Promise(resolve => {
|
|
|
+ // let _content = this.data.jsonData.content;
|
|
|
+ // const md = new markdownIt(); md.render(_content);
|
|
|
+ let _contentHtml = _content;
|
|
|
+
|
|
|
+ let _contentTableList = [];
|
|
|
+ const rowRegex = /<tr[^>]*>([\s\S]*?)<\/tr>/g; // 匹配表格行，[\s\S] 匹配所有字符
|
|
|
+ const cellRegex = /<(th|td)[^>]*>([\s\S]*?)<\/\1>/g; // 匹配单元格，[\s\S] 匹配所有字符
|
|
|
+
|
|
|
+ let rowMatch;
|
|
|
+ while ((rowMatch = rowRegex.exec(_contentHtml)) !== null) {
|
|
|
+ const rowContent = rowMatch[1]; // 每一行的内容
|
|
|
+ const rowData = [];
|
|
|
+ let cellMatch;
|
|
|
+
|
|
|
+ // 匹配每个单元格 (th 或 td)
|
|
|
+ while ((cellMatch = cellRegex.exec(rowContent)) !== null) {
|
|
|
+ let _text = cellMatch[2].trim();
|
|
|
+ _text = _text.replace(/&[a-zA-Z]+;/g, "");
|
|
|
+ _text = _text.replace(/<\/?[^>]+(>|$)/g, "");
|
|
|
+ rowData.push(_text); // 将每个单元格的内容添加到当前行的数组中
|
|
|
+ }
|
|
|
+
|
|
|
+ // 如果该行有数据，推送到 _contentTableList 中
|
|
|
+ if (rowData.length) {
|
|
|
+ _contentTableList.push(rowData);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 输出提取的表格数据
|
|
|
+
|
|
|
+ resolve(_contentTableList);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ handleBlur(){
|
|
|
+ this.showPopoverUid = null;
|
|
|
+ }
|
|
|
},
|
|
|
computed: {
|
|
|
localFormList() {
|
|
|
@@ -1890,7 +1969,7 @@ export default {
|
|
|
// this.selectTestType();
|
|
|
// 添加初始消息
|
|
|
this.array.push({
|
|
|
- uid: uuidv4(), // 生成唯一 ID
|
|
|
+ uid: "", // 生成唯一 ID
|
|
|
aiContent: "选择需要分析的数据，我将为您分析：", // 初始消息内容
|
|
|
content: "", // 用户内容为空
|
|
|
loading: false // 不加载
|
|
|
@@ -2339,7 +2418,7 @@ export default {
|
|
|
box-sizing: border-box;
|
|
|
/* min-height: calc(20vh - 10px); */
|
|
|
/* height: calc(100%); */
|
|
|
- overflow: auto;
|
|
|
+ /* overflow: auto; */
|
|
|
margin-bottom: 10px;
|
|
|
}
|
|
|
|
|
|
@@ -2826,11 +2905,14 @@ export default {
|
|
|
.ai_btn_box {
|
|
|
min-width: fit-content;
|
|
|
margin-top: auto;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
}
|
|
|
|
|
|
.ai_btn_box>img {
|
|
|
cursor: pointer;
|
|
|
width: 15px;
|
|
|
+ margin-bottom: 10px;
|
|
|
}
|
|
|
|
|
|
.iconfont {
|
|
|
@@ -2841,4 +2923,53 @@ export default {
|
|
|
-moz-osx-font-smoothing: grayscale;
|
|
|
color: blue
|
|
|
}
|
|
|
+
|
|
|
+.popoverBox{
|
|
|
+ width: auto;
|
|
|
+ height: auto;
|
|
|
+ position: relative;
|
|
|
+ margin-bottom: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.btnBox{
|
|
|
+ width: 15px;
|
|
|
+ height: 15px;
|
|
|
+}
|
|
|
+
|
|
|
+.btnBox>img{
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.showBox{
|
|
|
+ width: 60px;
|
|
|
+ height: auto;
|
|
|
+ padding: 10px;
|
|
|
+ position: absolute;
|
|
|
+ left: calc(100% + 10px);
|
|
|
+ top: 0px;
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 5px;
|
|
|
+ box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+.showBox>span{
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ padding: 5px 0;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ cursor: pointer;
|
|
|
+ border-radius: 4px;
|
|
|
+ background-color: #fff;
|
|
|
+ transition: .3s;
|
|
|
+ font-size: 16px;
|
|
|
+}
|
|
|
+
|
|
|
+.showBox>span:hover{
|
|
|
+ background-color: #e2e2e2;
|
|
|
+}
|
|
|
</style>
|
