|
|
@@ -45,7 +45,7 @@
|
|
|
v-for="item in selectData"
|
|
|
:label="item.label"
|
|
|
:value="item.id"
|
|
|
- :key="item.id"
|
|
|
+ :key="item.id + ind"
|
|
|
></el-option>
|
|
|
</el-select>
|
|
|
<el-tooltip
|
|
|
@@ -103,7 +103,7 @@
|
|
|
v-for="item in selectData"
|
|
|
:label="item.label"
|
|
|
:value="item.id"
|
|
|
- :key="item.id"
|
|
|
+ :key="item.id + ind"
|
|
|
></el-option>
|
|
|
</el-select>
|
|
|
<el-tooltip
|
|
|
@@ -129,7 +129,6 @@
|
|
|
</template>
|
|
|
</el-form-item>
|
|
|
</template>
|
|
|
-
|
|
|
<el-form-item v-if="curEdit.type === 'pareto'" label="柱纬度标签">
|
|
|
<div
|
|
|
slot="label"
|
|
|
@@ -164,7 +163,7 @@
|
|
|
v-for="item in selectData"
|
|
|
:label="item.label"
|
|
|
:value="item.id"
|
|
|
- :key="item.id"
|
|
|
+ :key="item.id + ind"
|
|
|
></el-option>
|
|
|
</el-select>
|
|
|
<el-tooltip
|
|
|
@@ -221,7 +220,7 @@
|
|
|
v-for="item in selectData"
|
|
|
:label="item.label"
|
|
|
:value="item.id"
|
|
|
- :key="item.id"
|
|
|
+ :key="item.id + ind"
|
|
|
></el-option>
|
|
|
</el-select>
|
|
|
<el-tooltip
|
|
|
@@ -283,7 +282,7 @@
|
|
|
v-for="item in selectData"
|
|
|
:label="item.label"
|
|
|
:value="item.id"
|
|
|
- :key="item.id"
|
|
|
+ :key="item.id + ind"
|
|
|
></el-option>
|
|
|
</el-select>
|
|
|
<!-- <el-tooltip
|
|
|
@@ -343,7 +342,7 @@
|
|
|
v-for="item in selectData"
|
|
|
:label="item.label"
|
|
|
:value="item.id"
|
|
|
- :key="item.id"
|
|
|
+ :key="item.id + ind"
|
|
|
></el-option>
|
|
|
</el-select>
|
|
|
<el-tooltip
|
|
|
@@ -406,7 +405,7 @@
|
|
|
v-for="item in selectData"
|
|
|
:label="item.label"
|
|
|
:value="item.id"
|
|
|
- :key="item.id"
|
|
|
+ :key="item.id + ind"
|
|
|
></el-option>
|
|
|
</el-select>
|
|
|
<el-tooltip
|
|
|
@@ -463,7 +462,7 @@
|
|
|
v-for="item in selectData"
|
|
|
:label="item.label"
|
|
|
:value="item.id"
|
|
|
- :key="item.id"
|
|
|
+ :key="item.id + ind"
|
|
|
></el-option>
|
|
|
</el-select>
|
|
|
<el-tooltip
|
|
|
@@ -507,12 +506,22 @@
|
|
|
<div style="margin: 20px 0">
|
|
|
<el-divider style="height: 2px"></el-divider>
|
|
|
</div>
|
|
|
- <el-collapse v-if="formLabelAlign.Ydata[0].data.length > 0">
|
|
|
+ <!--
|
|
|
+ <el-collapse v-if="formLabelAlign.Ydata[0].data.length > 0">
|
|
|
+ <el-collapse v-if="filteredYData.length > 0 && filteredYData[0].data.length > 0">
|
|
|
+ -->
|
|
|
+ <!--
|
|
|
+ v-for="(itemFilter, filterInd) in formLabelAlign.Ydata"
|
|
|
+ v-for="(itemFilter, filterInd) in filteredYData"
|
|
|
+ -->
|
|
|
+ <el-collapse
|
|
|
+ v-if="filteredYData.length > 0 && filteredYData[0].data.length > 0"
|
|
|
+ >
|
|
|
<el-collapse-item
|
|
|
- v-for="(itemFilter, filterInd) in formLabelAlign.Ydata"
|
|
|
+ v-for="(itemFilter, filterInd) in filteredYData"
|
|
|
:title="itemFilter.label || `数据筛选`"
|
|
|
:name="itemFilter.id"
|
|
|
- :key="itemFilter.id"
|
|
|
+ :key="itemFilter.id + filterInd"
|
|
|
>
|
|
|
<el-form
|
|
|
label-position="top"
|
|
|
@@ -709,8 +718,21 @@ export default {
|
|
|
currentChartList: "currentChartList",
|
|
|
dataBaseCheckList: "dataBaseCheckList",
|
|
|
}),
|
|
|
+ filteredYData() {
|
|
|
+ const { type } = this.curEdit;
|
|
|
+ const { BarYdata, LineYdata, ScatterYdata, Ydata } = this.formLabelAlign;
|
|
|
+ if (type === "pareto") {
|
|
|
+ console.log([...BarYdata, ...LineYdata], "[...BarYdata, ...LineYdata]");
|
|
|
+ return [...BarYdata, ...LineYdata];
|
|
|
+ } else if (type === "Cp") {
|
|
|
+ return [...LineYdata, ...ScatterYdata];
|
|
|
+ } else if (["bar", "line", "radar", "scatter"].includes(type)) {
|
|
|
+ console.log(Ydata, "Ydata");
|
|
|
+ return Ydata;
|
|
|
+ }
|
|
|
+ return []; // 默认返回空数组
|
|
|
+ },
|
|
|
},
|
|
|
-
|
|
|
watch: {
|
|
|
curEdit() {
|
|
|
this.changeData();
|
|
|
@@ -736,9 +758,6 @@ export default {
|
|
|
deep: true, // 深度监听
|
|
|
},
|
|
|
},
|
|
|
- mounted() {
|
|
|
- // this.changeData();
|
|
|
- },
|
|
|
methods: {
|
|
|
...mapMutations("dragChart", [
|
|
|
"updateChart",
|
|
|
@@ -746,6 +765,7 @@ export default {
|
|
|
"setFormFilterAlignData",
|
|
|
]),
|
|
|
handleMetrics(type) {
|
|
|
+ console.log(type, "tianjia yige");
|
|
|
switch (type) {
|
|
|
case "init":
|
|
|
this.formLabelAlign.Ydata.push({ lable: "", data: [], id: "" });
|
|
|
@@ -875,11 +895,55 @@ export default {
|
|
|
});
|
|
|
return axisData;
|
|
|
},
|
|
|
+ removeYdata(index, type) {
|
|
|
+ const { BarYdata, LineYdata, ScatterYdata, Ydata } = this.formLabelAlign;
|
|
|
+ switch (type) {
|
|
|
+ case "init":
|
|
|
+ this.formLabelAlign.Ydata.splice(index, 1); // 删除当前项
|
|
|
+ break;
|
|
|
+ case "bar":
|
|
|
+ this.formLabelAlign.BarYdata.splice(index, 1); // 删除当前项
|
|
|
|
|
|
+ break;
|
|
|
+ case "line":
|
|
|
+ this.formLabelAlign.LineYdata.splice(index, 1); // 删除当前项
|
|
|
+ if (this.curEdit.type === "Cp") {
|
|
|
+ this.formFilterAlign.splice(index, 1);
|
|
|
+ }
|
|
|
+ //这里需要处理this.formFilterAlign.filter(item)
|
|
|
+ break;
|
|
|
+ case "scatter":
|
|
|
+ if (this.curEdit.type === "Cp") {
|
|
|
+ this.formFilterAlign.splice(
|
|
|
+ this.formLabelAlign.LineYdata.length + index,
|
|
|
+ 1
|
|
|
+ );
|
|
|
+ }
|
|
|
+ this.formLabelAlign.ScatterYdata.splice(index, 1); // 删除当前项
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ removeXdata(index, type) {
|
|
|
+ switch (type) {
|
|
|
+ case "init":
|
|
|
+ this.formLabelAlign.Xdata.splice(index, 1); // 删除当前项
|
|
|
+ break;
|
|
|
+ case "bar":
|
|
|
+ this.formLabelAlign.BarXdata.splice(index, 1); // 删除当前项
|
|
|
+ break;
|
|
|
+ case "line":
|
|
|
+ this.formLabelAlign.LineXdata.splice(index, 1); // 删除当前项
|
|
|
+ break;
|
|
|
+ case "scatter":
|
|
|
+ this.formLabelAlign.ScatterXdata.splice(index, 1); // 删除当前项
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ },
|
|
|
changeData() {
|
|
|
if (this.$refs.form) {
|
|
|
this.$refs.form.resetFields();
|
|
|
}
|
|
|
+ console.log(this.formFilterAlign, "this.formFilterAlign 默认");
|
|
|
// 图表内容回显图表配置赋值
|
|
|
if (this.curEdit && this.curEdit.option) {
|
|
|
// 使用 this.$set 替代直接赋值
|
|
|
@@ -969,26 +1033,79 @@ export default {
|
|
|
],
|
|
|
});
|
|
|
// 查找是否存在数据
|
|
|
- const index = this.curEdit.formFilterAlignData.findIndex(
|
|
|
+ const index = this.currentChartList.findIndex(
|
|
|
(item) => item.id === this.curEdit.id
|
|
|
);
|
|
|
if (index !== -1) {
|
|
|
this.$set(
|
|
|
this,
|
|
|
"formFilterAlign",
|
|
|
- this.curEdit.formFilterAlignData[index]?.data
|
|
|
+ this.curEdit.formFilterAlignData.length > 0
|
|
|
+ ? this.curEdit.formFilterAlignData
|
|
|
+ : this.curEdit.type === "Cp" || this.curEdit.type === "pareto"
|
|
|
+ ? [
|
|
|
+ {
|
|
|
+ filters: [],
|
|
|
+ filterType1: "",
|
|
|
+ number1: null,
|
|
|
+ filterType2: "",
|
|
|
+ number2: null,
|
|
|
+ radio: null,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ filters: [],
|
|
|
+ filterType1: "",
|
|
|
+ number1: null,
|
|
|
+ filterType2: "",
|
|
|
+ number2: null,
|
|
|
+ radio: null,
|
|
|
+ },
|
|
|
+ ]
|
|
|
+ : [
|
|
|
+ {
|
|
|
+ filters: [],
|
|
|
+ filterType1: "",
|
|
|
+ number1: null,
|
|
|
+ filterType2: "",
|
|
|
+ number2: null,
|
|
|
+ radio: null,
|
|
|
+ },
|
|
|
+ ]
|
|
|
);
|
|
|
} else {
|
|
|
- this.$set(this, "formFilterAlign", [
|
|
|
- {
|
|
|
- filters: [],
|
|
|
- filterType1: "",
|
|
|
- number1: null,
|
|
|
- filterType2: "",
|
|
|
- number2: null,
|
|
|
- radio: null,
|
|
|
- },
|
|
|
- ]);
|
|
|
+ this.$set(
|
|
|
+ this,
|
|
|
+ "formFilterAlign",
|
|
|
+ this.curEdit.type === "Cp" || this.curEdit.type === "pareto"
|
|
|
+ ? [
|
|
|
+ {
|
|
|
+ filters: [],
|
|
|
+ filterType1: "",
|
|
|
+ number1: null,
|
|
|
+ filterType2: "",
|
|
|
+ number2: null,
|
|
|
+ radio: null,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ filters: [],
|
|
|
+ filterType1: "",
|
|
|
+ number1: null,
|
|
|
+ filterType2: "",
|
|
|
+ number2: null,
|
|
|
+ radio: null,
|
|
|
+ },
|
|
|
+ ]
|
|
|
+ : [
|
|
|
+ {
|
|
|
+ filters: [],
|
|
|
+ filterType1: "",
|
|
|
+ number1: null,
|
|
|
+ filterType2: "",
|
|
|
+ number2: null,
|
|
|
+ radio: null,
|
|
|
+ },
|
|
|
+ ]
|
|
|
+ );
|
|
|
}
|
|
|
} else {
|
|
|
this.$message.warning("请选择一个图表进行编辑");
|
|
|
@@ -1059,57 +1176,18 @@ export default {
|
|
|
);
|
|
|
}
|
|
|
//设置仓库
|
|
|
- console.log(
|
|
|
- JSON.parse(
|
|
|
- JSON.stringify(this.formFilterAlign.filter((item) => !item.id))
|
|
|
- ),
|
|
|
- "this.formFilterAlign"
|
|
|
- );
|
|
|
-
|
|
|
this.setFormFilterAlignData({
|
|
|
id: this.curEdit.id,
|
|
|
- data: JSON.parse(
|
|
|
- JSON.stringify(this.formFilterAlign.filter((item) => !item.id))
|
|
|
- ),
|
|
|
+ data: JSON.parse(JSON.stringify(this.formFilterAlign)),
|
|
|
});
|
|
|
this.updateChart({
|
|
|
...item,
|
|
|
- Ydata: this.formLabelAlign.Ydata,
|
|
|
- formFilterAlignData: this.formFilterAlign.filter((item) => !item.id),
|
|
|
+ LineYdata: this.formLabelAlign.LineYdata,
|
|
|
+ ScatterYdata: this.formLabelAlign.ScatterYdata,
|
|
|
+ Ydata: this.formLabelAlign.Ydata, //还是给所有的数据保存起来了，并不是过滤后的数据
|
|
|
+ formFilterAlignData: this.formFilterAlign,
|
|
|
}); // 更新图表
|
|
|
},
|
|
|
- removeYdata(index, type) {
|
|
|
- switch (type) {
|
|
|
- case "init":
|
|
|
- this.formLabelAlign.Ydata.splice(index, 1); // 删除当前项
|
|
|
- break;
|
|
|
- case "bar":
|
|
|
- this.formLabelAlign.BarYdata.splice(index, 1); // 删除当前项
|
|
|
- break;
|
|
|
- case "line":
|
|
|
- this.formLabelAlign.LineYdata.splice(index, 1); // 删除当前项
|
|
|
- break;
|
|
|
- case "scatter":
|
|
|
- this.formLabelAlign.ScatterYdata.splice(index, 1); // 删除当前项
|
|
|
- break;
|
|
|
- }
|
|
|
- },
|
|
|
- removeXdata(index, type) {
|
|
|
- switch (type) {
|
|
|
- case "init":
|
|
|
- this.formLabelAlign.Xdata.splice(index, 1); // 删除当前项
|
|
|
- break;
|
|
|
- case "bar":
|
|
|
- this.formLabelAlign.BarXdata.splice(index, 1); // 删除当前项
|
|
|
- break;
|
|
|
- case "line":
|
|
|
- this.formLabelAlign.LineXdata.splice(index, 1); // 删除当前项
|
|
|
- break;
|
|
|
- case "scatter":
|
|
|
- this.formLabelAlign.ScatterXdata.splice(index, 1); // 删除当前项
|
|
|
- break;
|
|
|
- }
|
|
|
- },
|
|
|
},
|
|
|
};
|
|
|
</script>
|
liujiejie
