|
@@ -16,7 +16,7 @@
|
|
|
"
|
|
|
>
|
|
|
<span>纬度标签</span>
|
|
|
- <el-tooltip content="添加纬度" placement="bottom-start">
|
|
|
+ <!-- <el-tooltip content="添加纬度" placement="bottom-start">
|
|
|
<i
|
|
|
@click="
|
|
|
formLabelAlign.Xdata.push({ lable: '', data: [], id: '' })
|
|
@@ -24,7 +24,7 @@
|
|
|
class="el-icon-circle-plus-outline"
|
|
|
style="font-size: 20px"
|
|
|
></i>
|
|
|
- </el-tooltip>
|
|
|
+ </el-tooltip> -->
|
|
|
</div>
|
|
|
<template v-for="(item, ind) in formLabelAlign.Xdata">
|
|
|
<el-select
|
|
@@ -65,21 +65,40 @@
|
|
|
</el-tooltip>
|
|
|
</div>
|
|
|
<template v-for="(item, ind) in formLabelAlign.Ydata">
|
|
|
- <el-select
|
|
|
- style="margin: 5px 0"
|
|
|
- :key="ind + 'select' + 'zhibiao'"
|
|
|
- v-model="formLabelAlign.Ydata[ind].id"
|
|
|
- placeholder="请先进行数据配置"
|
|
|
- :disabled="disabled"
|
|
|
- @change="handleYdata"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="item in selectData"
|
|
|
- :label="item.label"
|
|
|
- :value="item.id"
|
|
|
- :key="item.id"
|
|
|
- ></el-option>
|
|
|
- </el-select>
|
|
|
+ <div class="attributeItemData">
|
|
|
+ <el-select
|
|
|
+ style="margin: 5px 0"
|
|
|
+ :key="ind + 'select' + 'zhibiao'"
|
|
|
+ v-model="formLabelAlign.Ydata[ind].id"
|
|
|
+ placeholder="请先进行数据配置"
|
|
|
+ :disabled="disabled"
|
|
|
+ @change="handleYdata"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in selectData"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.id"
|
|
|
+ :key="item.id"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ <el-tooltip
|
|
|
+ :content="
|
|
|
+ ind === 0 ? '该指标不可删除,最少存在一组指标' : '删除该指标'
|
|
|
+ "
|
|
|
+ placement="bottom-start"
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ type="text"
|
|
|
+ :disabled="ind === 0"
|
|
|
+ @click="removeYdata(ind)"
|
|
|
+ >
|
|
|
+ <i
|
|
|
+ class="el-icon-delete"
|
|
|
+ style="font-size: 16px; color: red; padding: 0 0 0 10px"
|
|
|
+ ></i
|
|
|
+ ></el-button>
|
|
|
+ </el-tooltip>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="标题名称">
|
|
@@ -98,12 +117,95 @@
|
|
|
<el-input v-model="formLabelAlign.Ylable"></el-input>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
+ <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-item
|
|
|
+ v-for="(itemFilter, filterInd) in formLabelAlign.Ydata"
|
|
|
+ :title="itemFilter.label || `数据筛选`"
|
|
|
+ :name="itemFilter.id"
|
|
|
+ :key="itemFilter.id"
|
|
|
+ >
|
|
|
+ <el-form
|
|
|
+ label-position="top"
|
|
|
+ :model="formFilterAlign[filterInd]"
|
|
|
+ size="mini"
|
|
|
+ ref="form"
|
|
|
+ >
|
|
|
+ <el-form-item label="数据筛选">
|
|
|
+ <el-select
|
|
|
+ v-model="formFilterAlign[filterInd].filter"
|
|
|
+ placeholder="请选择数据"
|
|
|
+ multiple
|
|
|
+ collapse-tags
|
|
|
+ >
|
|
|
+ <el-option label="全部" value="all"></el-option>
|
|
|
+ <el-option
|
|
|
+ v-for="(item, index) in itemFilter.data"
|
|
|
+ :label="
|
|
|
+ item[itemFilter.label] ? `${item[itemFilter.label]} ` : `0`
|
|
|
+ "
|
|
|
+ :value="item[itemFilter.label] + '' + index"
|
|
|
+ :key="item[itemFilter.label] + '' + index"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="条件过滤">
|
|
|
+ <el-select placeholder="请选择过滤条件" v-model="value">
|
|
|
+ <el-option label="全部" value="all"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="显示值满足一下条件">
|
|
|
+ <el-select
|
|
|
+ v-model="formFilterAlign[filterInd].filterType1"
|
|
|
+ placeholder="请选择"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in options"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ <el-input
|
|
|
+ v-model="formLabelAlign[filterInd].number1"
|
|
|
+ type="number"
|
|
|
+ ></el-input>
|
|
|
+ <el-radio v-model="formLabelAlign[filterInd].radio" label="1"
|
|
|
+ >或</el-radio
|
|
|
+ >
|
|
|
+ <el-radio v-model="formLabelAlign[filterInd].radio" label="2"
|
|
|
+ >且</el-radio
|
|
|
+ >
|
|
|
+ <el-select
|
|
|
+ v-model="formFilterAlign[filterInd].filterType2"
|
|
|
+ placeholder="请选择"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in options"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ <el-input
|
|
|
+ v-model="formLabelAlign[filterInd].number2"
|
|
|
+ type="number"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-collapse-item>
|
|
|
+ </el-collapse> -->
|
|
|
</div>
|
|
|
</template>
|
|
|
-
|
|
|
<script>
|
|
|
import { mapState, mapMutations } from "vuex";
|
|
|
import { getFormattedLabels, getFormattedSeries } from "./configFn";
|
|
|
+import { all } from "axios";
|
|
|
export default {
|
|
|
name: "title",
|
|
|
props: {
|
|
@@ -120,6 +222,22 @@ export default {
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
+ value: "all",
|
|
|
+ formFilterAlign: [],
|
|
|
+ options: [
|
|
|
+ {
|
|
|
+ value: "1",
|
|
|
+ label: "小于",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: "2",
|
|
|
+ label: "大于",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: "3",
|
|
|
+ label: "等于",
|
|
|
+ },
|
|
|
+ ],
|
|
|
formLabelAlign: {
|
|
|
Xdata: [
|
|
|
{
|
|
@@ -202,7 +320,10 @@ export default {
|
|
|
},
|
|
|
|
|
|
changeData() {
|
|
|
- this.$refs.form.resetFields();
|
|
|
+ if (this.$refs.form) {
|
|
|
+ this.$refs.form.resetFields();
|
|
|
+ }
|
|
|
+
|
|
|
if (this.curEdit && this.curEdit.option) {
|
|
|
console.log(this.curEdit, "title-changeData-this.curEdit");
|
|
|
this.formLabelAlign = {
|
|
@@ -235,6 +356,7 @@ export default {
|
|
|
console.log("curEdit.option 不存在", this.curEdit);
|
|
|
}
|
|
|
},
|
|
|
+ //全部数据渲染
|
|
|
changeChart() {
|
|
|
if (!this.curEdit || !this.curEdit.option) return; // 确保 curEdit 和 option 存在
|
|
|
const item = JSON.parse(JSON.stringify(this.curEdit));
|
|
@@ -294,10 +416,12 @@ export default {
|
|
|
|
|
|
this.updateChart(item); // 更新图表
|
|
|
},
|
|
|
+ removeYdata(index) {
|
|
|
+ this.formLabelAlign.Ydata.splice(index, 1); // 删除当前项
|
|
|
+ },
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
|
-
|
|
|
<style scoped lang="scss">
|
|
|
::v-deep .el-form-item {
|
|
|
width: 100% !important;
|
|
@@ -305,5 +429,13 @@ export default {
|
|
|
.el-form-item__label {
|
|
|
width: 100% !important;
|
|
|
}
|
|
|
+ .attributeItemData {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+}
|
|
|
+.el-divider--horizontal {
|
|
|
+ height: 2px;
|
|
|
}
|
|
|
</style>
|