From da5e23f61994f5e0a0da75e992cc796a841e953b Mon Sep 17 00:00:00 2001 From: riku <risaku@163.com> Date: 星期五, 11 十月 2024 17:46:51 +0800 Subject: [PATCH] 1. 任务调整模块,任务编辑功能(待完成) --- src/views/fysp/task/components/CompMonitorObj.vue | 95 +++++++++++++++++++++++------------------------ 1 files changed, 46 insertions(+), 49 deletions(-) diff --git a/src/views/fysp/task/components/CompMonitorObj.vue b/src/views/fysp/task/components/CompMonitorObj.vue index 804274d..9093a2b 100644 --- a/src/views/fysp/task/components/CompMonitorObj.vue +++ b/src/views/fysp/task/components/CompMonitorObj.vue @@ -1,25 +1,17 @@ <template> - <el-tabs v-model="activeName" type="border-card" @tab-change="tabChange"> - <el-tab-pane - v-for="item in tabDataList" - :key="item.title" - :label="item.title" - :name="item.title" - > - <!-- <div> --> - <el-space wrap> - <ItemMonitorObj v-for="obj in item.children" :key="obj.movid" :item="obj"> - <template #default="{ item }"> - <!-- <slot :item="item"></slot> --> - <el-button v-if="showDelete" size="small" type="danger" @click="deleteMov(item)" - >绉婚櫎</el-button - > - </template> - </ItemMonitorObj> - </el-space> - <!-- </div> --> - </el-tab-pane> - </el-tabs> + <div> + <el-segmented :model-value="tabName" :options="tabs" @change="tabChange" /> + </div> + <el-space wrap> + <ItemMonitorObj v-for="obj in activeData" :key="obj.movid" :item="obj"> + <template #default="{ item }"> + <!-- <slot :item="item"></slot> --> + <el-button v-if="showDelete" size="small" type="danger" @click="deleteMov(item)" + >绉婚櫎</el-button + > + </template> + </ItemMonitorObj> + </el-space> </template> <script> @@ -30,59 +22,64 @@ type: Array, default: () => [] }, + tabName: { + type: String, + default: defaultTabName + }, + showData: Array, // 鏄惁娣诲姞榛樿鐨勫叏閮ㄩ�夐」 allOption: Boolean, showDelete: Boolean }, - emits: ['tabChange'], + emits: ['update:tabName', 'update:showData', 'deleteItem'], data() { return { - activeName: defaultTabName + activeName: defaultTabName, + tabs: [] }; }, computed: { - tabDataList() { - const itemMap = new Map(); - this.data.forEach((t) => { - itemMap.has(t.sceneType) ? itemMap.get(t.sceneType).push(t) : itemMap.set(t.sceneType, [t]); + activeData() { + const list = this.data.filter((v) => { + // return this.activeName == defaultTabName || v.sceneType == this.activeName; + return this.tabName == defaultTabName || v.sceneType == this.tabName; }); - const list = []; - if (this.allOption) { - list.push({ - title: defaultTabName, - children: this.data - }); - } - for (const [key, value] of itemMap) { - list.push({ - title: key, - children: value - }); - } + this.$emit('update:showData', list); return list; } }, watch: { - tabDataList: { + data: { handler(nV, oV) { if (nV != oV && nV.length > 0) { - this.activeName = nV[0].title; - this.tabChange(this.activeName); + this.getTabs(nV); + } + }, + immediate: true + }, + tabs: { + handler(nV, oV) { + if (nV != oV && nV.length > 0) { + // this.activeName = nV[0]; + this.tabChange(nV); } }, immediate: true } }, methods: { + getTabs(dataList) { + const list = []; + dataList.forEach((d) => { + if (list.indexOf(d.sceneType) == -1) list.push(d.sceneType); + }); + this.tabs = list; + }, tabChange(tabName) { - this.$emit('tabChange', tabName); + this.$emit('update:tabName', tabName); }, deleteMov(item) { - const tab = this.tabDataList.find((v) => { - return v.title == this.activeName; - }); - const i = tab.children.indexOf(item); - tab.children.splice(i, 1); + this.$emit('deleteItem', item); } } }; -- Gitblit v1.9.3