From db1c3c5b3670639fd1dfc5de0fe75ce6f02f732e Mon Sep 17 00:00:00 2001 From: wang1 <844966816@qq.com> Date: 星期三, 31 五月 2023 14:40:07 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/master' --- Source/UBCS-WEB/src/components/Crud/Crud.vue | 205 +++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 205 insertions(+), 0 deletions(-) diff --git a/Source/UBCS-WEB/src/components/Crud/Crud.vue b/Source/UBCS-WEB/src/components/Crud/Crud.vue new file mode 100644 index 0000000..aeccd29 --- /dev/null +++ b/Source/UBCS-WEB/src/components/Crud/Crud.vue @@ -0,0 +1,205 @@ +<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> + </div> + </template> + </avue-crud> + </basic-container> +</template> + +<script> +import {MasterTable, TableData} from "@/api/GetItem"; + +export default { + name: "Crud.vue", + data() { + return { + editingRow:null, + editShow: "", + editAttr:"", + loading: false, + data: [], + option: { + //榛樿楂樺害, + align: 'center', + menuAlign: 'center', + addBtn: false, + editBtn: false, + selection: true, + selectionFixed: false, + index: true, + column: [] + }, + List: [], + columnType: { + text: "input", + combox: "select", + truefalse: "switch", + number: "number", + datetime: "datetime", + }, + page: { + total: 0, + currentPage: 1, + pageSize: 10, + pageSizes: [10, 30, 50, 100, 200], + }, + tableData:[], + tableHeadData:[], + items:{} + } + }, + computed:{ + editable(){ + this.tableData.forEach(item=>{ + this.items=item + }) + return this.editShow === this.editingRow[this.items.prop]; + } + }, + created() { + this.CrudHeaderRend(); + this.CrudRend() + }, + activated() { + this.doLayout() + }, + methods: { + // 鐩戝惉鍗曞厓鏍肩偣鍑讳簨浠跺苟瀛樺偍姝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) + }, + // 灏嗘鍦ㄧ紪杈戠殑琛岀殑鐘舵�佸彉涓� null 锛屽嵆閫�鍑虹紪杈戠姸鎬� + saveRow() { + this.editingRow = null; + }, + doLayout() { + this.$nextTick(() => { + this.$refs.crud.doLayout(); + }); + }, + //琛ㄦ牸澶存覆鏌� + CrudHeaderRend() { + MasterTable({ + codeClassifyOid: "D9CF223F-317D-71EB-BD11-433A94CAD9F3", + functionId: 5, + _: 1685067339479 + }).then(res => { + this.List = res.data.tableDefineVO.cols[0]; + this.List.forEach(item => { + let columnItem = { + label: item.title, + prop: item.field, + type: this.columnType[item.type], + sortable: item.sort, + width: item.minWidth + }; + this.option.column.push(columnItem); + this.option.column=this.tableHeadData; + }) + }) + }, + //琛ㄦ牸鏁版嵁 + CrudRend() { + TableData({ + templateOid: "A12826E4-2B66-6D56-DE30-92BB1D7F607F", + codeClassifyOid: "D9CF223F-317D-71EB-BD11-433A94CAD9F3", + page: this.page.currentPage, + limit: this.page.pageSize, + _: 1685089123575 + }).then(res => { + this.page.total = res.data.total; + this.data = res.data.data; + this.tableData=res.data.data; + }) + }, + // 鎺掑簭 + sortChange(val) { + this.loading = true; + let order = "" + if (val.order == "ascending") { + order = "asc"; + } else { + order = "desc"; + } + TableData({ + templateOid: "A12826E4-2B66-6D56-DE30-92BB1D7F607F", + codeClassifyOid: "D9CF223F-317D-71EB-BD11-433A94CAD9F3", + order: order, + sort: val.prop, + page: this.page.currentPage, + limit: this.page.pageSize, + }).then(res => { + setTimeout(() => { + this.data = res.data.data; + this.loading = false; + }, 100); + }) + }, + //鍒嗛〉鍒锋柊 + async onLoad(val) { + console.log(val) + await TableData({ + templateOid: "A12826E4-2B66-6D56-DE30-92BB1D7F607F", + codeClassifyOid: "D9CF223F-317D-71EB-BD11-433A94CAD9F3", + page: val.currentPage, + limit: val.pageSize, + _: 1685089123575 + }).then(res => { + this.data = res.data.data; + }) + }, + //澶氶�� + selectionChange(row) { + console.log(row) + } + } +} +</script> + +<style scoped> + +</style> -- Gitblit v1.9.3