From b387f71a88ba507e207f0a42c69b62975888e980 Mon Sep 17 00:00:00 2001 From: 田源 <lastanimals@163.com> Date: 星期四, 19 十月 2023 18:15:21 +0800 Subject: [PATCH] 编码规则-最大流水联调 --- Source/UBCS-WEB/src/views/wel/Statistic.vue | 265 ++++++++++++++++++++++++++++++++-------------------- 1 files changed, 163 insertions(+), 102 deletions(-) diff --git a/Source/UBCS-WEB/src/views/wel/Statistic.vue b/Source/UBCS-WEB/src/views/wel/Statistic.vue index dbac618..741d0bd 100644 --- a/Source/UBCS-WEB/src/views/wel/Statistic.vue +++ b/Source/UBCS-WEB/src/views/wel/Statistic.vue @@ -1,121 +1,166 @@ <template> - <div> - <div style="display: flex; justify-content: flex-end;margin-bottom: 10px"> - <el-button icon="el-icon-more" type="primary" plain size="small" @click="MoreHandler">鏇村</el-button> + <div v-loading="this.loading" class="App"> + <div style="display: flex; justify-content: flex-end;margin-bottom: 10px"> + <el-button plain size="small" type="primary" @click="MoreHandler">鑷畾涔�</el-button> </div> - <avue-data-box :option="option" :animation="true"> - <template> - <el-switch></el-switch> - </template> - </avue-data-box> - <el-dialog title="涓绘暟鎹厤缃�" :visible.sync="dialogTableVisible" append-to-body class="avue-dialog avue-dialog--top" top="0"> - <avue-crud ref="crud" - v-model="Crud.form" - :data="Crud.data" - @selection-change="selectionChange" - :option="Crud.option"> - </avue-crud> + <avue-data-box ref="dataBox" :animation="true" :option="option"></avue-data-box> + + <el-dialog :visible.sync="dialogTableVisible" append-to-body class="avue-dialog avue-dialog--top" title="涓绘暟鎹厤缃�" + top='-40px'> + <el-table + ref="TableBox" + :data="Crud.data" + border + style="width: 100%" + @selection-change="selectionChange" + @row-click="TableRoute"> + <el-table-column + type="selection" + width="55"> + </el-table-column> + <el-table-column + align="center" + label="涓绘暟鎹悕绉�" + prop="menuName" + > + <template slot-scope="scope"> + <el-link type="primary" @click="TableRoute(scope.row)">{{ scope.row.menuName }}</el-link> + </template> + </el-table-column> + <el-table-column + align="center" + label="寰呭姙鏁版嵁" + prop="mdmCount" + > + </el-table-column> + <el-table-column + align="center" + label="icon鍥炬爣" + prop="icon"> + <template slot-scope="scope"> + <i :class="scope.row.icon" style="font-size: 20px"></i> + </template> + </el-table-column> + <el-table-column + :show-overflow-tooltip='true' + label="璺敱鍦板潃" + prop="menuRoute"> + </el-table-column> + <el-table-column + align="center" + label="code" + prop="code"> + </el-table-column> + </el-table> <div slot="footer" class="dialog-footer"> - <el-button type="primary" plain @click="SaveHandler">淇濆瓨</el-button> + <el-button plain type="primary" @click="SaveHandler">淇濆瓨</el-button> </div> </el-dialog> </div> </template> <script> -import {validatenull} from "@/util/validate"; -import {getList,save} from "@/api/system/statistic"; -import {flowRoute} from "@/util/flow"; +import {getList, save} from "@/api/system/statistic"; export default { -name: "Statistic", - data(){ - return { - Crud:{ - form:'', - data:[], - option:{ - calcHeight: 80, - tip: false, - searchShow: false, - addBtn:false, - columnBtn:false, - header:false, - menu:false, - border: true, - index: true, - selection: true, - column:[ - { - label: "涓绘暟鎹悕绉�", - prop: "menuName", - }, - { - label: "寰呭姙鏁版嵁", - prop: "mdmCount", - }, - { - label: "icon鍥炬爣", - prop: "icon", - overHidden:true, - }, - { - label: "璺敱鍦板潃", - prop: "menuRoute", - overHidden:true, - }, - { - label: "code", - prop: "code", - overHidden:true, - }, - ] - } - }, - userId:'', - hexColor:'', - newData:[], - SelectRow:[], - countByServer:true, - dialogTableVisible:false, - // listMyTask:[] - option: { - span:6, - data: [] - }, - } + name: "Statistic", + data() { + return { + loading: true, + Crud: { + form: '', + data: [], + }, + userId: '', + hexColor: '', + newData: [], + SelectRow: [], + countByServer: true, + dialogTableVisible: false, + // listMyTask:[] + option: { + span: 6, + data: [] + }, + } }, created() { - this.MasterGetList() + this.MasterGetList(); }, - computed(){ + mounted() { + this.FontInfo() + }, + computed() { }, methods: { - selectionChange(row){ - // console.log(row) - this.SelectRow=row; + FontInfo() { + this.$nextTick(() => { + const dataFatherBox = this.$refs.dataBox.$el; + console.log(dataFatherBox); + this.$nextTick(() => { + setTimeout(() => { + //瀛椾綋 + const info = dataFatherBox.querySelectorAll('.item-info .info'); + //杈规 + const items = dataFatherBox.querySelectorAll('.item'); + // console.log('info', info); + info.forEach((info) => { + info.style.fontSize = '16px'; + }); + items.forEach((item) => { + item.style.border = '1px solid rgb(200, 200, 200, 1)'; + }); + this.loading = false; + }, 1000); // 寤惰繜1绉掓煡鎵緄nfo鍏冪礌 + }); + }); }, - SaveHandler(){ - if(this.SelectRow.length <= 0){ + selectionChange(row) { + // console.log(row) + this.SelectRow = row; + }, + SaveHandler() { + if (this.SelectRow.length <= 0) { this.$message.warning('璇烽�夋嫨涓�鏉℃暟鎹紒') return } - let mdmNameList=[]; - mdmNameList=this.SelectRow.map(item=>{return item.code}) - console.log(mdmNameList) - save(this.userId,mdmNameList).then(res=>{ + let mdmNameList = []; + mdmNameList = this.SelectRow.map(item => { + return item.code + }) + console.log(mdmNameList) + save(this.userId, mdmNameList).then(res => { console.log(res) - if(res.data.code === 200){ + if (res.data.code === 200) { this.$message.success('淇濆瓨鎴愬姛锛�') - this.option.data=[]; + //娓呴櫎宸叉湁鏁扮粍涓璸ush鏁版嵁 + this.newData = []; + this.option.data = [] this.MasterGetList() - this.dialogTableVisible=false; + this.dialogTableVisible = false; + //瀛椾綋鍜岃竟妗嗛噸鏂板姞杞� + this.loading = true; + this.FontInfo() } }) }, - MoreHandler(){ - this.dialogTableVisible=true + MoreHandler() { + this.dialogTableVisible = true; + let checkedrow = [] + this.newData.forEach(item => { + this.option.data.forEach(v => { + if (item.code === v.code) { + checkedrow.push(item) + } + }) + }) + // console.log(checkedrow) + this.$nextTick(() => { + checkedrow.forEach(row => { + this.$refs.TableBox.toggleRowSelection(row, true) // 鍥炴樉 + }) + }) }, // 闅忔満鑹� randomColor() { @@ -128,35 +173,51 @@ }, MasterGetList() { this.userId = localStorage.getItem('userId'); - getList({ userId: this.userId }).then(res => { - res.data.data.filter(item => { + getList({userId: this.userId}).then(res => { + res.data.data.filter((item, index) => { + this.newData.push(item); + this.Crud.data = this.newData; if (item.isDefault === 1) { - this.hexColor = this.randomColor(); + const colors = ['rgb(49, 180, 141)', 'rgb(56, 161, 242)', 'rgb(117, 56, 199)', 'rgb(242, 104, 31)', + 'rgb(19, 150, 111)', 'rgb(26, 131, 212)', 'rgb(87, 26, 169)', 'rgb(212, 83, 1)']; + const color = colors[index % colors.length]; this.option.data.push({ click: (item) => { - this.$router.push({ path: item.uiUrl }); + this.$router.push({path: item.uiUrl}); }, title: item.menuName, count: parseInt(item.mdmCount), icon: item.icon, code: item.code, isDefault: item.isDefault, - color:this.hexColor, + color: color, uiUrl: item.menuRoute, + id: 'custom-title' }); - } else if (item.isDefault === 0) { - this.newData.push(item); - this.Crud.data=this.newData; } }); - // console.log(this.option.data); - // console.log(this.newData); }); - } + }, + TableRoute(row) { + this.$router.push({path: row.menuRoute}); + }, } } </script> <style scoped> +* { + list-style: none; +} +.MasterBox { + display: flex; + width: 100%; + padding: 0; +} + +div { + margin: 0; + padding: 0; +} </style> -- Gitblit v1.9.3