From efcf450e8e7e375ef4ffe9f421ec0d34c5378180 Mon Sep 17 00:00:00 2001 From: Fixiaobai <fixiaobai@163.com> Date: 星期四, 07 九月 2023 14:02:32 +0800 Subject: [PATCH] Merge branch 'master' of http://192.168.218.113:9001/r/lims-before --- src/views/laboratory/organizational/index.vue | 221 ++++++++++++++++++++++++++++++++++++++++++++++--------- 1 files changed, 185 insertions(+), 36 deletions(-) diff --git a/src/views/laboratory/organizational/index.vue b/src/views/laboratory/organizational/index.vue index b25fa6a..b8e8d8a 100644 --- a/src/views/laboratory/organizational/index.vue +++ b/src/views/laboratory/organizational/index.vue @@ -12,6 +12,7 @@ :filter-node-method="filterNode" ref="tree" @node-click="handleNodeClick" + :expand-on-click-node="false" > </el-tree> </div> @@ -22,10 +23,16 @@ <el-button type="primary" size="small" - icon="el-icon-circle-plus-outline" + icon="el-icon-plus" + @click="dialogVisible = true" >鏂板</el-button > - <el-button size="small" icon="el-icon-delete-solid">鍒犻櫎</el-button> + <el-button + size="small" + icon="el-icon-delete-solid" + @click="listDeleteClick" + >鍒犻櫎</el-button + > </div> </div> <div class="table-main-div"> @@ -39,27 +46,83 @@ @selection-change="handleSelectionChange" > <el-table-column type="selection" width="55"> </el-table-column> - <el-table-column label="鏃ユ湡" width="120"> - <template slot-scope="scope">{{ scope.row.date }}</template> - </el-table-column> - <el-table-column prop="name" label="濮撳悕" width="120"> - </el-table-column> - <el-table-column prop="address" label="鍦板潃" show-overflow-tooltip> + <el-table-column + label="搴忓彿" + type="index" + width="70" + ></el-table-column> + <el-table-column prop="department" label="閮ㄩ棬"> </el-table-column> + <el-table-column label="鎿嶄綔"> + <template scope="scope"> + <el-button type="text" size="mini" @click="updateClick(scope)" + >缂栬緫</el-button + > + <el-button type="text" size="mini" @click="deleteClick(scope)" + >鍒犻櫎</el-button + > + </template> </el-table-column> </el-table> </div> </div> + <el-dialog + :title="isUpdate ? '鏇存柊閮ㄩ棬鍚嶇О' : '鏂板閮ㄩ棬'" + :visible.sync="dialogVisible" + width="30%" + > + <el-form + :model="formData" + :rules="rules" + ref="ruleForm" + class="elFormClass" + > + <el-form-item label="涓婄骇閮ㄩ棬锛�" prop="name" style="padding-left: 10px"> + <el-input + v-model="treeNodeData.department" + :disabled="true" + style="width: 81.3%" + > + </el-input> + </el-form-item> + <el-form-item + label="閮ㄩ棬鍚嶇О锛�" + prop="department" + style="padding-top: 20px" + > + <el-input + placeholder="璇疯緭鍏ラ儴闂ㄥ悕绉�" + v-model="formData.department" + style="width: 80%" + > + </el-input> + </el-form-item> + </el-form> + <span slot="footer" class="dialog-footer"> + <el-button @click="dialogVisible = false">鍙� 娑�</el-button> + <el-button type="primary" @click="saveForm">{{ + isUpdate ? "鏇� 鏂�" : "鏂� 澧�" + }}</el-button> + </span> + </el-dialog> </div> </template> <script> -import { getOrganizationalApi } from "@/api/laboratory/organizational"; +import { + getOrganizationalApi, + getTableInitializationApi, + organizationalAddApi, + organizationalUpdateApi, + organizationalDeleteApi, +} from "@/api/laboratory/organizational"; export default { name: "Organizational", data() { return { filterText: "", + dialogVisible: false, msg: "", + isUpdate: false, data: [], // tree鏍戦粯璁ゅ�奸厤缃� defaultProps: { @@ -67,28 +130,24 @@ label: "department", id: "id", }, - tableData: [ - { - date: "2016-05-02", - name: "鐜嬪皬铏�", - address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�", - }, - { - date: "2016-05-04", - name: "鐜嬪皬铏�", - address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1517 寮�", - }, - { - date: "2016-05-01", - name: "鐜嬪皬铏�", - address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1519 寮�", - }, - { - date: "2016-05-03", - name: "鐜嬪皬铏�", - address: "涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1516 寮�", - }, - ], + formData: { + fatherId: "", + department: "", + }, + // 鏂板鎸夐挳閲岄潰绂佹杈撳叆妗嗘暟鎹� + disabledInputShow: "", + // 淇濆瓨鐐瑰嚮鑺傜偣鏁版嵁 + treeNodeData: {}, + // 澶氶�夊垹闄� + listDelete: [], + // 琛ㄦ牸鏁版嵁 + tableData: [], + rules: { + department: [ + { required: true, message: "璇疯緭鍏ユ椿鍔ㄥ悕绉�", trigger: "blur" }, + { min: 1, max: 25, message: "闀垮害鍦� 1 鍒� 5 涓瓧绗�", trigger: "blur" }, + ], + }, }; }, methods: { @@ -101,6 +160,13 @@ treeInitialization() { getOrganizationalApi().then((res) => { this.data = res.data; + // 鍒濆鍖栭粯璁sg鎻愮ず璺緞涓虹涓�鑺傜偣鍚嶇О + this.msg = res.data[0].department; + // 鍒濆鍖栬皟鐢ㄨ〃鏍兼帴鍙� + this.tableInitialization(res.data[0].id); + // 鍒濆鍖栦繚瀛樼涓�鑺傜偣鏁版嵁 + this.treeNodeData.department = res.data[0].department; + this.treeNodeData.id = res.data[0].id; }); }, // 鑾峰彇鏍戣矾寰� @@ -115,10 +181,14 @@ // 鐐瑰嚮鏍戣妭鐐� handleNodeClick(data, node, element) { this.getParentData(node.parent, node.data.department); - console.log(`output->this.msg`, this.msg); - console.log(`output->data`, data); - console.log(`output->node`, node); - console.log(`output->element`, element); + // 鐢变簬鐐瑰嚮绗竴鑺傜偣鏃犳硶瑙﹀彂getParentData閲岄潰鐨勫垽鏂紝鍙兘棰濆鍒ゆ柇 + if (node.data.id === 0) { + this.msg = node.data.department; + } + // 鐐瑰嚮鑺傜偣鏁版嵁瀛樺偍涓嬫潵 + this.treeNodeData = node.data; + // 鐐瑰嚮瑙﹀彂璇ュ嚱鏁帮紝鏇存柊琛ㄦ牸鏁版嵁 + this.tableInitialization(node.data.id); }, // 鏀瑰彉澶氶�夋鐘舵�� toggleSelection(rows) { @@ -132,7 +202,71 @@ }, // 鐐瑰嚮澶氶�夋浠ュ悗鐨勬搷浣� handleSelectionChange(val) { - this.multipleSelection = val; + this.listDelete = [] + val.forEach((v) => { + this.listDelete.push(v.id); + }); + }, + // 鍒濆鍖栬〃鏍兼暟鎹� + tableInitialization(departmentId) { + getTableInitializationApi(departmentId).then((res) => { + this.tableData = res.data; + }); + }, + // 鏇存柊涓庢柊澧炶〃鍗� + saveForm() { + this.formData.fatherId = this.treeNodeData.id; + this.$refs.ruleForm.validate((valid) => { + if (valid) { + if (!this.isUpdate) { + organizationalAddApi(this.formData).then((res) => { + this.$message({ + message: res.message, + type: "success", + }); + this.treeInitialization(); + this.dialogVisible = false; + }); + } else { + organizationalUpdateApi(this.formData).then((res) => { + this.$message({ + message: res.message, + type: "success", + }); + this.treeInitialization(); + this.dialogVisible = false; + }); + } + } + }); + }, + // 鐐瑰嚮缂栬緫瑙﹀彂 + updateClick(scope) { + this.dialogVisible = true; + this.isUpdate = true; + this.formData.id = scope.row.id; + this.formData.fatherId = this.treeNodeData.id; + this.formData.department = scope.row.department; + }, + // 琛ㄦ牸涓殑鍒犻櫎鎸夐挳 + deleteClick(scope) { + organizationalDeleteApi(scope.row.id).then((res) => { + this.$message({ + message: res.message, + type: "success", + }); + this.treeInitialization(); + }); + }, + // 澶撮儴澶氶�夊垹闄� + listDeleteClick() { + organizationalDeleteApi(this.listDelete).then((res) => { + this.$message({ + message: res.message, + type: "success", + }); + this.treeInitialization(); + }); }, }, mounted() { @@ -141,6 +275,18 @@ watch: { filterText(val) { this.$refs.tree.filter(val); + }, + dialogVisible: { + handler(newVal, oldVal) { + if (newVal == false) { + this.isUpdate = false; + this.formData = { + fatherId: "", + department: "", + }; + this.$refs.ruleForm.resetFields(); + } + }, }, }, }; @@ -187,4 +333,7 @@ font-weight: 500; color: #999999; } +.elFormClass .el-form-item__error { + padding-left: 90px; +} </style> -- Gitblit v1.9.3