From 75f043dfa6660716364e66ee0b3cf99f44255686 Mon Sep 17 00:00:00 2001 From: DYL0109 <dn18191638832@163.com> Date: 星期三, 16 四月 2025 19:20:36 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/develop1.0' into dyl_dev --- zhitan-vue/src/views/system/dept/index.vue | 413 ++++++++++++++++++++++++++++++---------------------------- 1 files changed, 211 insertions(+), 202 deletions(-) diff --git a/zhitan-vue/src/views/system/dept/index.vue b/zhitan-vue/src/views/system/dept/index.vue index d073a26..e24a654 100644 --- a/zhitan-vue/src/views/system/dept/index.vue +++ b/zhitan-vue/src/views/system/dept/index.vue @@ -1,189 +1,190 @@ <template> - <div class="app-container"> + <div class="app-container page"> + <div class="form-card"> <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch"> - <el-form-item label="閮ㄩ棬鍚嶇О" prop="deptName"> - <el-input - v-model="queryParams.deptName" - placeholder="璇疯緭鍏ラ儴闂ㄥ悕绉�" - clearable - style="width: 200px" - @keyup.enter="handleQuery" - /> - </el-form-item> - <el-form-item label="鐘舵��" prop="status"> - <el-select v-model="queryParams.status" placeholder="閮ㄩ棬鐘舵��" clearable style="width: 200px"> - <el-option - v-for="dict in sys_normal_disable" - :key="dict.value" - :label="dict.label" - :value="dict.value" - /> - </el-select> - </el-form-item> - <el-form-item> - <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button> - <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> - </el-form-item> + <el-form-item label="閮ㄩ棬鍚嶇О" prop="deptName"> + <el-input + v-model="queryParams.deptName" + placeholder="璇疯緭鍏ラ儴闂ㄥ悕绉�" + clearable + style="width: 200px" + @keyup.enter="handleQuery" + /> + </el-form-item> + <el-form-item label="鐘舵��" prop="status"> + <el-select v-model="queryParams.status" placeholder="閮ㄩ棬鐘舵��" clearable style="width: 200px"> + <el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" /> + </el-select> + </el-form-item> + <el-form-item> + <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button> + <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button> + </el-form-item> + <el-form-item style="float: right"> + <el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['system:dept:add']" + >鏂板</el-button + > + <el-button type="info" plain icon="Sort" @click="toggleExpandAll">灞曞紑/鎶樺彔</el-button> + </el-form-item> </el-form> + </div> - <el-row :gutter="10" class="mb8"> - <el-col :span="1.5"> - <el-button - type="primary" - plain - icon="Plus" - @click="handleAdd" - v-hasPermi="['system:dept:add']" - >鏂板</el-button> - </el-col> - <el-col :span="1.5"> - <el-button - type="info" - plain - icon="Sort" - @click="toggleExpandAll" - >灞曞紑/鎶樺彔</el-button> - </el-col> - <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar> - </el-row> + <div class="table-bg-style"> + <div class="table-box"> + <el-table + v-if="refreshTable" + v-loading="loading" + :data="deptList" + row-key="deptId" + :default-expand-all="isExpandAll" + :tree-props="{ children: 'children', hasChildren: 'hasChildren' }" + > + <el-table-column prop="deptName" label="閮ㄩ棬鍚嶇О" width="260"></el-table-column> + <el-table-column prop="orderNum" label="鎺掑簭" width="200"></el-table-column> + <el-table-column prop="status" label="鐘舵��" width="100"> + <template #default="scope"> + <dict-tag :options="sys_normal_disable" :value="scope.row.status" /> + </template> + </el-table-column> + <el-table-column label="鍒涘缓鏃堕棿" align="center" prop="createTime" width="200"> + <template #default="scope"> + <span>{{ parseTime(scope.row.createTime) }}</span> + </template> + </el-table-column> + <el-table-column label="鎿嶄綔" align="center" class-name="small-padding fixed-width"> + <template #default="scope"> + <el-button + link + type="primary" + icon="Edit" + @click="handleUpdate(scope.row)" + v-hasPermi="['system:dept:edit']" + >淇敼</el-button + > + <el-button link type="primary" icon="Plus" @click="handleAdd(scope.row)" v-hasPermi="['system:dept:add']" + >鏂板</el-button + > + <el-button + v-if="scope.row.parentId != 0" + link + type="primary" + icon="Delete" + @click="handleDelete(scope.row)" + v-hasPermi="['system:dept:remove']" + >鍒犻櫎</el-button + > + </template> + </el-table-column> + </el-table> + </div> + </div> - <el-table - v-if="refreshTable" - v-loading="loading" - :data="deptList" - row-key="deptId" - :default-expand-all="isExpandAll" - :tree-props="{ children: 'children', hasChildren: 'hasChildren' }" - > - <el-table-column prop="deptName" label="閮ㄩ棬鍚嶇О" width="260"></el-table-column> - <el-table-column prop="orderNum" label="鎺掑簭" width="200"></el-table-column> - <el-table-column prop="status" label="鐘舵��" width="100"> - <template #default="scope"> - <dict-tag :options="sys_normal_disable" :value="scope.row.status" /> - </template> - </el-table-column> - <el-table-column label="鍒涘缓鏃堕棿" align="center" prop="createTime" width="200"> - <template #default="scope"> - <span>{{ parseTime(scope.row.createTime) }}</span> - </template> - </el-table-column> - <el-table-column label="鎿嶄綔" align="center" class-name="small-padding fixed-width"> - <template #default="scope"> - <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:dept:edit']">淇敼</el-button> - <el-button link type="primary" icon="Plus" @click="handleAdd(scope.row)" v-hasPermi="['system:dept:add']">鏂板</el-button> - <el-button v-if="scope.row.parentId != 0" link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:dept:remove']">鍒犻櫎</el-button> - </template> - </el-table-column> - </el-table> - - <!-- 娣诲姞鎴栦慨鏀归儴闂ㄥ璇濇 --> - <el-dialog :title="title" v-model="open" width="600px" append-to-body> - <el-form ref="deptRef" :model="form" :rules="rules" label-width="80px"> - <el-row> - <el-col :span="24" v-if="form.parentId !== 0"> - <el-form-item label="涓婄骇閮ㄩ棬" prop="parentId"> - <el-tree-select - v-model="form.parentId" - :data="deptOptions" - :props="{ value: 'deptId', label: 'deptName', children: 'children' }" - value-key="deptId" - placeholder="閫夋嫨涓婄骇閮ㄩ棬" - check-strictly - /> - </el-form-item> - </el-col> - <el-col :span="12"> - <el-form-item label="閮ㄩ棬鍚嶇О" prop="deptName"> - <el-input v-model="form.deptName" placeholder="璇疯緭鍏ラ儴闂ㄥ悕绉�" /> - </el-form-item> - </el-col> - <el-col :span="12"> - <el-form-item label="鏄剧ず鎺掑簭" prop="orderNum"> - <el-input-number v-model="form.orderNum" controls-position="right" :min="0" /> - </el-form-item> - </el-col> - <el-col :span="12"> - <el-form-item label="璐熻矗浜�" prop="leader"> - <el-input v-model="form.leader" placeholder="璇疯緭鍏ヨ礋璐d汉" maxlength="20" /> - </el-form-item> - </el-col> - <el-col :span="12"> - <el-form-item label="鑱旂郴鐢佃瘽" prop="phone"> - <el-input v-model="form.phone" placeholder="璇疯緭鍏ヨ仈绯荤數璇�" maxlength="11" /> - </el-form-item> - </el-col> - <el-col :span="12"> - <el-form-item label="閭" prop="email"> - <el-input v-model="form.email" placeholder="璇疯緭鍏ラ偖绠�" maxlength="50" /> - </el-form-item> - </el-col> - <el-col :span="12"> - <el-form-item label="閮ㄩ棬鐘舵��"> - <el-radio-group v-model="form.status"> - <el-radio - v-for="dict in sys_normal_disable" - :key="dict.value" - :label="dict.value" - >{{ dict.label }}</el-radio> - </el-radio-group> - </el-form-item> - </el-col> - </el-row> - </el-form> - <template #footer> - <div class="dialog-footer"> - <el-button type="primary" @click="submitForm">纭� 瀹�</el-button> - <el-button @click="cancel">鍙� 娑�</el-button> - </div> - </template> - </el-dialog> - </div> + <!-- 娣诲姞鎴栦慨鏀归儴闂ㄥ璇濇 --> + <el-dialog :title="title" v-model="open" width="600px" append-to-body> + <el-form ref="deptRef" :model="form" :rules="rules" label-width="80px"> + <el-row> + <el-col :span="24" v-if="form.parentId !== 0"> + <el-form-item label="涓婄骇閮ㄩ棬" prop="parentId"> + <el-tree-select + v-model="form.parentId" + :data="deptOptions" + :props="{ value: 'deptId', label: 'deptName', children: 'children' }" + value-key="deptId" + placeholder="閫夋嫨涓婄骇閮ㄩ棬" + check-strictly + /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="閮ㄩ棬鍚嶇О" prop="deptName"> + <el-input v-model="form.deptName" placeholder="璇疯緭鍏ラ儴闂ㄥ悕绉�" /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="鏄剧ず鎺掑簭" prop="orderNum"> + <el-input-number v-model="form.orderNum" controls-position="right" :min="0" /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="璐熻矗浜�" prop="leader"> + <el-input v-model="form.leader" placeholder="璇疯緭鍏ヨ礋璐d汉" maxlength="20" /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="鑱旂郴鐢佃瘽" prop="phone"> + <el-input v-model="form.phone" placeholder="璇疯緭鍏ヨ仈绯荤數璇�" maxlength="11" /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="閭" prop="email"> + <el-input v-model="form.email" placeholder="璇疯緭鍏ラ偖绠�" maxlength="50" /> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="閮ㄩ棬鐘舵��"> + <el-radio-group v-model="form.status"> + <el-radio v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.value">{{ + dict.label + }}</el-radio> + </el-radio-group> + </el-form-item> + </el-col> + </el-row> + </el-form> + <template #footer> + <div class="dialog-footer"> + <el-button type="primary" @click="submitForm">纭� 瀹�</el-button> + <el-button @click="cancel">鍙� 娑�</el-button> + </div> + </template> + </el-dialog> + </div> </template> <script setup name="Dept"> -import { listDept, getDept, delDept, addDept, updateDept, listDeptExcludeChild } from "@/api/system/dept"; +import { listDept, getDept, delDept, addDept, updateDept, listDeptExcludeChild } from "@/api/system/dept" -const { proxy } = getCurrentInstance(); -const { sys_normal_disable } = proxy.useDict("sys_normal_disable"); +const { proxy } = getCurrentInstance() +const { sys_normal_disable } = proxy.useDict("sys_normal_disable") -const deptList = ref([]); -const open = ref(false); -const loading = ref(true); -const showSearch = ref(true); -const title = ref(""); -const deptOptions = ref([]); -const isExpandAll = ref(true); -const refreshTable = ref(true); +const deptList = ref([]) +const open = ref(false) +const loading = ref(true) +const showSearch = ref(true) +const title = ref("") +const deptOptions = ref([]) +const isExpandAll = ref(true) +const refreshTable = ref(true) const data = reactive({ form: {}, queryParams: { deptName: undefined, - status: undefined + status: undefined, }, rules: { parentId: [{ required: true, message: "涓婄骇閮ㄩ棬涓嶈兘涓虹┖", trigger: "blur" }], deptName: [{ required: true, message: "閮ㄩ棬鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }], orderNum: [{ required: true, message: "鏄剧ず鎺掑簭涓嶈兘涓虹┖", trigger: "blur" }], email: [{ type: "email", message: "璇疯緭鍏ユ纭殑閭鍦板潃", trigger: ["blur", "change"] }], - phone: [{ pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "璇疯緭鍏ユ纭殑鎵嬫満鍙风爜", trigger: "blur" }] + phone: [{ pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "璇疯緭鍏ユ纭殑鎵嬫満鍙风爜", trigger: "blur" }], }, -}); +}) -const { queryParams, form, rules } = toRefs(data); +const { queryParams, form, rules } = toRefs(data) /** 鏌ヨ閮ㄩ棬鍒楄〃 */ function getList() { - loading.value = true; - listDept(queryParams.value).then(response => { - deptList.value = proxy.handleTree(response.data, "deptId"); - loading.value = false; - }); + loading.value = true + listDept(queryParams.value).then((response) => { + deptList.value = proxy.handleTree(response.data, "deptId") + loading.value = false + }) } /** 鍙栨秷鎸夐挳 */ function cancel() { - open.value = false; - reset(); + open.value = false + reset() } /** 琛ㄥ崟閲嶇疆 */ function reset() { @@ -195,80 +196,88 @@ leader: undefined, phone: undefined, email: undefined, - status: "0" - }; - proxy.resetForm("deptRef"); + status: "0", + } + proxy.resetForm("deptRef") } /** 鎼滅储鎸夐挳鎿嶄綔 */ function handleQuery() { - getList(); + getList() } /** 閲嶇疆鎸夐挳鎿嶄綔 */ function resetQuery() { - proxy.resetForm("queryRef"); - handleQuery(); + proxy.resetForm("queryRef") + handleQuery() } /** 鏂板鎸夐挳鎿嶄綔 */ function handleAdd(row) { - reset(); - listDept().then(response => { - deptOptions.value = proxy.handleTree(response.data, "deptId"); - }); + reset() + listDept().then((response) => { + deptOptions.value = proxy.handleTree(response.data, "deptId") + }) if (row != undefined) { - form.value.parentId = row.deptId; + form.value.parentId = row.deptId } - open.value = true; - title.value = "娣诲姞閮ㄩ棬"; + open.value = true + title.value = "娣诲姞閮ㄩ棬" } /** 灞曞紑/鎶樺彔鎿嶄綔 */ function toggleExpandAll() { - refreshTable.value = false; - isExpandAll.value = !isExpandAll.value; + refreshTable.value = false + isExpandAll.value = !isExpandAll.value nextTick(() => { - refreshTable.value = true; - }); + refreshTable.value = true + }) } /** 淇敼鎸夐挳鎿嶄綔 */ function handleUpdate(row) { - reset(); - listDeptExcludeChild(row.deptId).then(response => { - deptOptions.value = proxy.handleTree(response.data, "deptId"); - }); - getDept(row.deptId).then(response => { - form.value = response.data; - open.value = true; - title.value = "淇敼閮ㄩ棬"; - }); + reset() + listDeptExcludeChild(row.deptId).then((response) => { + deptOptions.value = proxy.handleTree(response.data, "deptId") + }) + getDept(row.deptId).then((response) => { + form.value = response.data + open.value = true + title.value = "淇敼閮ㄩ棬" + }) } /** 鎻愪氦鎸夐挳 */ function submitForm() { - proxy.$refs["deptRef"].validate(valid => { + proxy.$refs["deptRef"].validate((valid) => { if (valid) { if (form.value.deptId != undefined) { - updateDept(form.value).then(response => { - proxy.$modal.msgSuccess("淇敼鎴愬姛"); - open.value = false; - getList(); - }); + updateDept(form.value).then((response) => { + proxy.$modal.msgSuccess("淇敼鎴愬姛") + open.value = false + getList() + }) } else { - addDept(form.value).then(response => { - proxy.$modal.msgSuccess("鏂板鎴愬姛"); - open.value = false; - getList(); - }); + addDept(form.value).then((response) => { + proxy.$modal.msgSuccess("鏂板鎴愬姛") + open.value = false + getList() + }) } } - }); + }) } /** 鍒犻櫎鎸夐挳鎿嶄綔 */ function handleDelete(row) { - proxy.$modal.confirm('鏄惁纭鍒犻櫎鍚嶇О涓�"' + row.deptName + '"鐨勬暟鎹」?').then(function() { - return delDept(row.deptId); - }).then(() => { - getList(); - proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛"); - }).catch(() => {}); + proxy.$modal + .confirm('鏄惁纭鍒犻櫎鍚嶇О涓�"' + row.deptName + '"鐨勬暟鎹」?') + .then(function () { + return delDept(row.deptId) + }) + .then(() => { + getList() + proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛") + }) + .catch(() => {}) } -getList(); +getList() </script> + +<style lang="scss" scoped> +@import "@/assets/styles/page.scss"; +</style> -- Gitblit v1.9.3