From d762fc609a101b1a82576a54f835834f4e9cd9b9 Mon Sep 17 00:00:00 2001 From: zouyu <2723363702@qq.com> Date: 星期四, 07 九月 2023 10:54:39 +0800 Subject: [PATCH] modified: src/layout/components/Sidebar/SidebarItem.vue modified: src/router/index.js modified: src/views/CNAS/nonConformanceManage/index.vue modified: src/views/CNAS/reviewAnnualPlan/index.vue modified: src/views/CNAS/satisfactionSurveys/index.vue modified: src/views/basicData/index.vue modified: src/views/experiment/inspectionApplication/index.vue modified: src/views/inspectionManagement/commissionInspection/index.vue modified: src/views/inspectionManagement/reportForInspection/index.vue modified: src/views/laboratory/organizational/index.vue modified: src/views/login/index.vue --- src/views/laboratory/organizational/index.vue | 332 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 330 insertions(+), 2 deletions(-) diff --git a/src/views/laboratory/organizational/index.vue b/src/views/laboratory/organizational/index.vue index 1a29501..b8e8d8a 100644 --- a/src/views/laboratory/organizational/index.vue +++ b/src/views/laboratory/organizational/index.vue @@ -1,11 +1,339 @@ <template> - <div>131</div> + <div class="main-div"> + <div class="side_div"> + <el-input placeholder="杈撳叆鍏抽敭瀛楄繘琛岃繃婊�" v-model="filterText"> + </el-input> + <el-tree + class="filter-tree" + :data="data" + node-key="id" + :props="defaultProps" + default-expand-all + :filter-node-method="filterNode" + ref="tree" + @node-click="handleNodeClick" + :expand-on-click-node="false" + > + </el-tree> + </div> + <div class="table_div"> + <div class="table_top_div"> + <span class="top_span" v-if="msg !== ''">{{ msg }}</span> + <div style="text-align: right; float: right"> + <el-button + type="primary" + size="small" + icon="el-icon-plus" + @click="dialogVisible = true" + >鏂板</el-button + > + <el-button + size="small" + icon="el-icon-delete-solid" + @click="listDeleteClick" + >鍒犻櫎</el-button + > + </div> + </div> + <div class="table-main-div"> + <el-table + ref="multipleTable" + :data="tableData" + border + height="100%" + tooltip-effect="dark" + style="width: 100%" + @selection-change="handleSelectionChange" + > + <el-table-column type="selection" width="55"> </el-table-column> + <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, + getTableInitializationApi, + organizationalAddApi, + organizationalUpdateApi, + organizationalDeleteApi, +} from "@/api/laboratory/organizational"; export default { name: "Organizational", + data() { + return { + filterText: "", + dialogVisible: false, + msg: "", + isUpdate: false, + data: [], + // tree鏍戦粯璁ゅ�奸厤缃� + defaultProps: { + children: "children", + label: "department", + id: "id", + }, + formData: { + fatherId: "", + department: "", + }, + // 鏂板鎸夐挳閲岄潰绂佹杈撳叆妗嗘暟鎹� + disabledInputShow: "", + // 淇濆瓨鐐瑰嚮鑺傜偣鏁版嵁 + treeNodeData: {}, + // 澶氶�夊垹闄� + listDelete: [], + // 琛ㄦ牸鏁版嵁 + tableData: [], + rules: { + department: [ + { required: true, message: "璇疯緭鍏ユ椿鍔ㄥ悕绉�", trigger: "blur" }, + { min: 1, max: 25, message: "闀垮害鍦� 1 鍒� 5 涓瓧绗�", trigger: "blur" }, + ], + }, + }; + }, + methods: { + // 鏍戜笂鏂规悳绱㈡杩囨护鍣� + filterNode(value, data) { + if (!value) return true; + return data.department.indexOf(value) !== -1; + }, + // 鍒濆鍖栬幏鍙栨爲鏁版嵁 + 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; + }); + }, + // 鑾峰彇鏍戣矾寰� + getParentData(node, department) { + if (node !== null) { + if (node.data.department !== undefined) { + this.msg = node.data.department + " > " + department; + } + this.getParentData(node.parent, this.msg); + } + }, + // 鐐瑰嚮鏍戣妭鐐� + handleNodeClick(data, node, element) { + this.getParentData(node.parent, node.data.department); + // 鐢变簬鐐瑰嚮绗竴鑺傜偣鏃犳硶瑙﹀彂getParentData閲岄潰鐨勫垽鏂紝鍙兘棰濆鍒ゆ柇 + if (node.data.id === 0) { + this.msg = node.data.department; + } + // 鐐瑰嚮鑺傜偣鏁版嵁瀛樺偍涓嬫潵 + this.treeNodeData = node.data; + // 鐐瑰嚮瑙﹀彂璇ュ嚱鏁帮紝鏇存柊琛ㄦ牸鏁版嵁 + this.tableInitialization(node.data.id); + }, + // 鏀瑰彉澶氶�夋鐘舵�� + toggleSelection(rows) { + if (rows) { + rows.forEach((row) => { + this.$refs.multipleTable.toggleRowSelection(row); + }); + } else { + this.$refs.multipleTable.clearSelection(); + } + }, + // 鐐瑰嚮澶氶�夋浠ュ悗鐨勬搷浣� + handleSelectionChange(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() { + this.treeInitialization(); + }, + 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(); + } + }, + }, + }, }; </script> -<style></style> +<style lang="scss"> +.main-div { + width: 99.2% !important; + height: 94vh !important; + margin: 5px 5px 5px 5px; +} +.side_div { + float: left; + width: 300px; + height: 95%; + margin-bottom: 5px; + background-color: #ffffff; + padding: 15px; +} +.table_div { + margin-left: 6px; + float: left; + width: calc(100% - 306px); + height: 95%; + background-color: #ffffff; +} +.filter-tree { + margin-top: 6px; +} +.table_top_div { + height: 80px; + width: 100%; + padding-top: 23px; + padding-right: 50px; +} +.table-main-div { + width: 100%; + height: 90.3%; + padding: 10px; +} +.top_span { + margin-left: 12px; + font-size: 16px; + font-weight: 500; + color: #999999; +} +.elFormClass .el-form-item__error { + padding-left: 90px; +} +</style> -- Gitblit v1.9.3