From 53f8b0f89dc73e08cad2a4e7a52bbb438617db10 Mon Sep 17 00:00:00 2001 From: 田源 <lastanimals@163.com> Date: 星期一, 05 六月 2023 18:19:33 +0800 Subject: [PATCH] 整合组件 --- Source/UBCS-WEB/package.json | 1 Source/UBCS-WEB/src/components/Tree/classifyTrees.vue | 3 Source/UBCS-WEB/src/components/Crud/Crud.vue | 186 +++++++++++++++++++------- Source/UBCS-WEB/src/views/MasterData/items.vue | 186 +++++++++++++++++++------- Source/UBCS-WEB/vue.config.js | 5 5 files changed, 275 insertions(+), 106 deletions(-) diff --git a/Source/UBCS-WEB/package.json b/Source/UBCS-WEB/package.json index 3133c95..4034a7f 100644 --- a/Source/UBCS-WEB/package.json +++ b/Source/UBCS-WEB/package.json @@ -17,6 +17,7 @@ "classlist-polyfill": "^1.2.0", "crypto-js": "^4.0.0", "element-ui": "^2.15.6", + "instead": "^1.0.3", "js-base64": "^2.5.1", "js-cookie": "^2.2.0", "js-md5": "^0.7.3", diff --git a/Source/UBCS-WEB/src/components/Crud/Crud.vue b/Source/UBCS-WEB/src/components/Crud/Crud.vue index aeccd29..b4b82c2 100644 --- a/Source/UBCS-WEB/src/components/Crud/Crud.vue +++ b/Source/UBCS-WEB/src/components/Crud/Crud.vue @@ -1,60 +1,137 @@ <template> <basic-container> - <avue-crud ref="crud" - v-loading="loading" - :data="data" - :option="option" - :page="page" - @sort-change="sortChange" - @selection-change="selectionChange" - @on-load="onLoad"> - <template slot="menu"> - <el-button type="text">鏂囧瓧鎸夐挳</el-button> - </template> - <template slot="menuLeft"> - <div> - <el-table :data="tableData" style="width: 100%" @cell-click="handleCellClick" @cell-dblclick="dbclick"> - <div v-for="(item,index) in this.tableHeadData" :key="index"> - <el-table-column :label="item.label" :prop="item.prop"> -<!-- 缂栬緫鍜屽睍绀洪�昏緫 --> - <template slot-scope="{ row }"> - <el-input v-if="editingRow === row && editShow== item.prop" v-model="row[item.prop]" @blur="saveRow"></el-input> - <span v-else>{{row[item.prop]}}</span> - </template> - </el-table-column> - </div> - <el-table-column fixed="right" label="鎿嶄綔" width="120"> - <template slot-scope="scope"> - <el-button size="small" type="text" @click.native.prevent="enumDeleteRow(scope.$index, tableData)"> - 绉婚櫎 - </el-button> - </template> - </el-table-column> - </el-table> - <template> - <div style="display: flex;justify-content: right;margin-top: 15px"> - <el-button type="primary" size="small">淇濆瓨</el-button> - <el-button size="small" @click="enumVisible=false">鍙栨秷</el-button> - </div> - </template> +<!-- <avue-crud ref="crud"--> +<!-- v-loading="loading"--> +<!-- :data="data"--> +<!-- :option="option"--> +<!-- :page="page"--> +<!-- @sort-change="sortChange"--> +<!-- @selection-change="selectionChange"--> +<!-- @on-load="onLoad">--> +<!-- <template slot="menu">--> +<!-- <el-button type="text">鏂囧瓧鎸夐挳</el-button>--> +<!-- </template>--> +<!-- <template slot="menuLeft">--> +<!-- </template>--> +<!-- </avue-crud>--> + + <div class="testbox"> + <div style="margin-top: 10px;display: flex;flex-wrap: wrap;width: 100%;"> + <el-button size="small" type="primary" plain @click="addvisible=true">澧炲姞 + <FormTemplateDialog + :visible.sync="addvisible" + :type="add" + :templateOid="this.templateOid" + :codeClassifyOid="this.codeClassifyOid" + :codeRuleOid="this.codeRuleOid" + :disabledProp="disabledProp" + :rowOid="rowOid" + > + </FormTemplateDialog></el-button> + + <el-button size="small" type="primary" plain @click="editvisible=true">缂栬緫 + <FormTemplateDialog + :visible.sync="editvisible" + :type="edit" + :templateOid="this.templateOid" + :codeClassifyOid="this.codeClassifyOid" + :codeRuleOid="this.codeRuleOid" + :disabledProp="disabledProp" + :rowOid="rowOid" + ></FormTemplateDialog></el-button> + + <el-button size="small" type="primary" plain>鎵归噺瀵煎叆鐢宠</el-button> + <el-button size="small" type="primary" plain>鍘嗗彶鏁版嵁瀵煎叆</el-button> + <el-button size="small" type="primary" plain>鎵归噺鐢宠缂栫爜</el-button> + <el-button size="small" type="primary" plain>鎵归噺鍙戝竷</el-button> + <el-button size="small" type="primary" plain>鏌ョ湅娴佺▼鍘嗗彶</el-button> + <el-button size="small" type="primary" plain>鍒犻櫎</el-button> + <el-button size="small" type="primary" plain>鍙戝竷</el-button> + <el-button size="small" type="primary" plain>鏁版嵁鏇存敼</el-button> + <el-button size="small" type="primary" plain>鍥炴敹</el-button> + <el-button size="small" type="primary" plain>瀵煎嚭 + <transfer filter-placeholder="璇疯緭鍏ユ嫾闊冲叏鎷兼垨鑰呮嫾闊崇缉鍐�" ></transfer> + </el-button> + <el-button size="small" type="primary" plain @click="findvisible=true">鏌ヨ + <advancedQuery :visible.sync="findvisible" :options="this.options"></advancedQuery> + </el-button> + <el-button size="small" type="primary" plain>鐩镐技椤规煡璇�</el-button> + <el-button size="small" type="primary" plain style="margin-left: 1px;margin-top:10px">鍒锋柊</el-button> + <el-input placeholder="璇疯緭鍏ュ叧閿瓧鎸夊洖杞︽煡璇�" style="width: 180px;margin-left: 5px;margin-top:10px" size="small"></el-input> + </div> + <el-row style="height: 700px;width: 100%"> + <el-table :data="tableData" style="" @cell-click="handleCellClick" max-height="700" @selection-change="handleSelectionChange" @sort-change="sortChange"> + <el-table-column + type="selection" + fixed + width="55"> + </el-table-column> + <el-table-column + type="index" + fixed + label="搴忓彿" + width="55"> + </el-table-column> + <div v-for="(item,index) in this.tableHeadData" :key="index"> + <el-table-column :label="item.label" :prop="item.prop" :sortable="item.sortable" :width="item.width"> + <!-- 缂栬緫鍜屽睍绀洪�昏緫 --> + <template slot-scope="{ row }"> + <el-input v-if="editingRow === row && editShow== item.prop" v-model="row[item.prop]" @blur="saveRow"></el-input> + <span v-else>{{row[item.prop]}}</span> + <el-switch + v-if="editShow === 'true'" + v-model="row[item.prop]" + active-color="#13ce66" + inactive-color="#ff4949"> + </el-switch> + </template> + </el-table-column> </div> - </template> - </avue-crud> +<!-- <el-table-column fixed="right" label="鎿嶄綔" width="120" >--> +<!-- <template slot-scope="scope" >--> +<!-- <el-button size="small" type="text" @click.native.prevent="enumDeleteRow(scope.$index, tableData)">--> +<!-- 绉婚櫎--> +<!-- </el-button>--> +<!-- </template>--> +<!-- </el-table-column>--> + </el-table> + + </el-row> + </div> + <div class="block" style="display: flex;justify-content: flex-end"> + <el-pagination + @size-change="handleSizeChange" + @current-change="handleCurrentChange" + :current-page="currentPage4" + :page-sizes="page.pageSizes" + :page-size="page.pageSizes" + layout="total, sizes, prev, pager, next, jumper" + :total="page.total"> + </el-pagination> + </div> </basic-container> </template> <script> import {MasterTable, TableData} from "@/api/GetItem"; - export default { name: "Crud.vue", data() { return { + addvisible:false, + editvisible:false, + findvisible:false, + templateOid: "78B8C7C5-A042-0B96-FE6D-65421451782A", + codeClassifyOid: "4524E801-6CC6-92E8-1AC3-2AB9604E8F96", + codeRuleOid: "B95872A6-9CEA-D490-8F1B-9D26548CAF96", + rowOid: '6EF696C3-CD87-0E7C-1EA1-8DE3913A95C9', + disabledProp: ["id"], editingRow:null, editShow: "", editAttr:"", loading: false, data: [], + options:{}, option: { //榛樿楂樺害, align: 'center', @@ -86,12 +163,7 @@ } }, computed:{ - editable(){ - this.tableData.forEach(item=>{ - this.items=item - }) - return this.editShow === this.editingRow[this.items.prop]; - } + }, created() { this.CrudHeaderRend(); @@ -101,13 +173,15 @@ this.doLayout() }, methods: { + handleSizeChange(val){ + console.log(val) + }, // 鐩戝惉鍗曞厓鏍肩偣鍑讳簨浠跺苟瀛樺偍姝e湪缂栬緫鐨勮 handleCellClick(row, column) { this.editingRow = row; this.editShow = column.property; - console.log( this.editingRow['name'], this.editShow) }, - //鏋氫妇娉ㄥ叆鍒犻櫎 + //鍒犻櫎 enumDeleteRow(row) { console.log(row) this.tableData.splice(row, 1) @@ -128,6 +202,7 @@ functionId: 5, _: 1685067339479 }).then(res => { + this.options=res.data.tableDefineVO.seniorQueryColumns this.List = res.data.tableDefineVO.cols[0]; this.List.forEach(item => { let columnItem = { @@ -148,7 +223,7 @@ templateOid: "A12826E4-2B66-6D56-DE30-92BB1D7F607F", codeClassifyOid: "D9CF223F-317D-71EB-BD11-433A94CAD9F3", page: this.page.currentPage, - limit: this.page.pageSize, + limit:9, _: 1685089123575 }).then(res => { this.page.total = res.data.total; @@ -181,7 +256,6 @@ }, //鍒嗛〉鍒锋柊 async onLoad(val) { - console.log(val) await TableData({ templateOid: "A12826E4-2B66-6D56-DE30-92BB1D7F607F", codeClassifyOid: "D9CF223F-317D-71EB-BD11-433A94CAD9F3", @@ -193,13 +267,21 @@ }) }, //澶氶�� - selectionChange(row) { + handleSelectionChange(row) { console.log(row) } } } </script> -<style scoped> +<style lang="scss" scoped> +.testbox { + .el-table--scrollable-x .el-table__body-wrapper { + overflow: auto !important; + } + .el-table__fixed-right-patch { + background-color: #f5f7fa !important; + } +} </style> diff --git a/Source/UBCS-WEB/src/components/Tree/classifyTrees.vue b/Source/UBCS-WEB/src/components/Tree/classifyTrees.vue index f3d1fd1..da70e18 100644 --- a/Source/UBCS-WEB/src/components/Tree/classifyTrees.vue +++ b/Source/UBCS-WEB/src/components/Tree/classifyTrees.vue @@ -412,8 +412,7 @@ } }) //璋冪敤淇敼灞炴�у悕鏂规硶 - this.ModifyProperties(this.Treedata, 'text', 'label'); - this.ModifyProperties(this.CloneTreedata, 'text', 'label'); + this.ModifyProperties(this.CloneTreedata, 'name', 'label'); }).catch(res => { this.$message.error(res) }) diff --git a/Source/UBCS-WEB/src/views/MasterData/items.vue b/Source/UBCS-WEB/src/views/MasterData/items.vue index 94b1072..fb59b6c 100644 --- a/Source/UBCS-WEB/src/views/MasterData/items.vue +++ b/Source/UBCS-WEB/src/views/MasterData/items.vue @@ -2,7 +2,12 @@ <el-container> <el-aside> <basic-container style="height: 85vh; max-height: 155vh; overflow-y: scroll;"> - <avue-tree :option="option" :data="data" v-model="form" style="height: 80.5vh;padding-top: 5px;padding-bottom: 30px"></avue-tree> + <avue-tree ref="tree" v-model="CloneTreeAvueform" v-loading="loading" :data="CloneTreedata" :defaultExpandAll="false" + :option="Treeoption" + style="height: 80.5vh;padding-top: 5px;padding-bottom: 30px" + @node-click=" nodeClick" + @check-change="checkChange" + ></avue-tree> </basic-container> </el-aside> <el-main> @@ -12,61 +17,144 @@ </template> <script> +import {getAtrrList, TreeCheckDel, TreeDel, TreeSave} from "@/api/template/templateAttr"; + export default { name: "items.vue", data(){ return{ - form:{}, - data:[ - { - value:0, - label:'涓�绾ч儴闂�', - children:[ - { - value:1, - label:'涓�绾ч儴闂�1', - },{ - value:2, - label:'涓�绾ч儴闂�2', - } - ] - },{ - value:3, - label:'浜岀骇閮ㄩ棬', - children:[ - { - value:4, - label:'浜岀骇閮ㄩ棬1', - },{ - value:5, - label:'浜岀骇閮ㄩ棬2', - } - ] + CloneTreeAvueform:{}, + loading:false, + CloneTreedata:[], + Treeoption: { + addBtn: false, + editBtn: false, + delBtn: false, + defaultExpandAll: false, + menu: false, + // //杩欎釜鏄閫� + // multiple: true, + }, + nodeClickList: "", + } + }, + created() { + this.getAttr() + }, + methods:{ + getAttr() { + getAtrrList().then(res => { + this.Treedata = res.data; + this.CloneTreedata = res.data; + this.Treedata.forEach((item) => { + for (let i = 0; i < this.Treedata.length; i++) { + this.Treedata[i].value = i; + } + }) + //璋冪敤淇敼灞炴�у悕鏂规硶 + this.ModifyProperties(this.CloneTreedata, 'name', 'label'); + }).catch(res => { + this.$message.error(res) + }) + }, + //瀹氫箟涓�涓慨鏀规暟鎹睘鎬у悕鐨勬柟娉� + ModifyProperties(obj, oldName, newName) { + for (let key in obj) { + if (key === oldName) { + obj[newName] = obj[key]; + delete obj[key]; } - ], - option:{ - title:'鎴戞槸鏍囬', - filterText:"鎼滅储鍏抽敭瀛楄嚜瀹氫箟", - defaultExpandAll:true, - addBtnText:'鏂板鑷畾涔夋枃妗�', - editBtnText:'淇敼鑷畾涔夋枃妗�', - delBtnText:'鍒犻櫎鑷畾涔夋枃妗�', - defaultExpandedKeys:[1], - height:900, - formOption:{ - labelWidth:100, - column:[{ - label:'鑷畾涔夐」', - prop:'label' - }], - }, - props:{ - labelText:'鏍囬', - label:'label', - value:'value', - children:'children' + if (typeof obj[key] === 'object') { + this.ModifyProperties(obj[key], oldName, newName); } } + }, + //鏍戣妭鐐规坊鍔犳寜閽� + TreeAdd() { + this.TreeAddFormVisible = true; + // 鍒ゆ柇褰撳墠鏄惁鏈夌偣鍑诲瓙椤� + if (this.nodeClickList !== "") { + this.TreeFlag = true + } + }, + //鏍戣妭鐐规坊鍔犱簨浠� + TreeAddHandler() { + const data = this.TreeAddform + this.$set(data, "parentCodeClassifyOid", this.nodeClickList.oid) + TreeSave(data).then(() => { + this.$message({ + type: 'success', + message: '娣诲姞鎴愬姛!' + }); + this.getAttr(); + this.TreeAddFormVisible = false + this.TreeAddform = "" + }).catch(res => { + this.$message({ + type: 'warning', + message: res + }); + }) + }, + //鏍戣妭鐐瑰垹闄ゆ寜閽� + TreeDel() { + this.$confirm('鏄惁鍒犻櫎褰撳墠閫夋嫨鐨勫垎绫伙紝灏嗕細鎶婂瓙鍒嗙被涓�骞跺垹闄わ紝濡傛灉瀛樺湪缂栫爜鏁版嵁灏嗕笉鑳借鍒犻櫎锛屾槸鍚︾户缁紵', '鎻愮ず', { + confirmButtonText: '纭畾', + cancelButtonText: '鍙栨秷', + type: 'warning', + customClass: 'my-messagebox', + }).then(() => { + TreeCheckDel(this.nodeClickList).then(res => { + if (res.data.data) { + TreeDel(this.nodeClickList).then(() => { + this.$message({ + type: 'success', + message: '鍒犻櫎鎴愬姛!' + }); + this.getAttr(); + }).catch(res => { + this.$message({ + type: 'warning', + message: res + }); + }) + } else { + this.$confirm('褰撳墠鏁版嵁鍖呭惈鏈変笅绾ф暟鎹紝瑕佸垹闄ょ殑璇濅細鍜屼笅绾ф暟鎹竴璧峰垹闄わ紝浣犵‘璁ょ户缁�?', '鎻愮ず', { + confirmButtonText: '纭畾', + cancelButtonText: '鍙栨秷', + type: 'warning', + customClass: 'my-messageboxs', + }).then(() => { + TreeDel(this.nodeClickList).then(() => { + this.$message({ + type: 'success', + message: '鍒犻櫎鎴愬姛!' + }); + this.getAttr(); + }).catch(res => { + this.$message({ + type: 'warning', + message: res + }); + }) + }).catch(() => { + this.$message({ + type: 'info', + message: '宸插彇娑堝垹闄�' + }); + }); + } + }) + }).catch(() => { + this.$message({ + type: 'info', + message: '宸插彇娑堝垹闄�' + }); + }); + }, + nodeClick(data){ + this.nodeClickList = data + console.log(data) } } } diff --git a/Source/UBCS-WEB/vue.config.js b/Source/UBCS-WEB/vue.config.js index 7543090..fb16916 100644 --- a/Source/UBCS-WEB/vue.config.js +++ b/Source/UBCS-WEB/vue.config.js @@ -26,10 +26,9 @@ proxy: { '/api': { //鏈湴鏈嶅姟鎺ュ彛鍦板潃 - target: 'http://localhost:37000', - // target: 'http://192.168.1.63:37000', + // target: 'http://localhost:37000', //target: 'http://192.168.3.7:37000', - //target: 'http://dev.vci-tech.com:37000', + target: 'http://dev.vci-tech.com:37000', //target: 'http://192.168.1.51:37000/', //杩滅▼婕旂ず鏈嶅姟鍦板潃,鍙敤浜庣洿鎺ュ惎鍔ㄩ」鐩� // target: 'https://saber.bladex.vip/api', -- Gitblit v1.9.3