From 1595cb282aab5399862fac6406b5de550863e3b6 Mon Sep 17 00:00:00 2001 From: 疯狂的狮子Li <15040126243@163.com> Date: 星期一, 03 四月 2023 00:05:09 +0800 Subject: [PATCH] update 调整代码格式 --- src/views/system/dict/data.vue | 444 +++++++++++++++++++++++++++--------------------------- 1 files changed, 222 insertions(+), 222 deletions(-) diff --git a/src/views/system/dict/data.vue b/src/views/system/dict/data.vue index f5c2dbe..2b26493 100644 --- a/src/views/system/dict/data.vue +++ b/src/views/system/dict/data.vue @@ -1,3 +1,136 @@ +<template> + <div class="p-2"> + <transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave"> + <div class="search" v-show="showSearch"> + <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px"> + <el-form-item label="瀛楀吀鍚嶇О" prop="dictType"> + <el-select v-model="queryParams.dictType" style="width: 200px"> + <el-option v-for="item in typeOptions" :key="item.dictId" :label="item.dictName" :value="item.dictType" /> + </el-select> + </el-form-item> + <el-form-item label="瀛楀吀鏍囩" prop="dictLabel"> + <el-input v-model="queryParams.dictLabel" 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> + </div> + </transition> + <el-card shadow="never"> + <template #header> + <el-row :gutter="10" class="mb8"> + <el-col :span="1.5"> + <el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['system:dict:add']">鏂板</el-button> + </el-col> + <el-col :span="1.5"> + <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['system:dict:edit']">淇敼</el-button> + </el-col> + <el-col :span="1.5"> + <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['system:dict:remove']"> + 鍒犻櫎 + </el-button> + </el-col> + <el-col :span="1.5"> + <el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['system:dict:export']">瀵煎嚭</el-button> + </el-col> + <el-col :span="1.5"> + <el-button type="warning" plain icon="Close" @click="handleClose">鍏抽棴</el-button> + </el-col> + <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar> + </el-row> + </template> + + <el-table v-loading="loading" :data="dataList" @selection-change="handleSelectionChange"> + <el-table-column type="selection" width="55" align="center" /> + <el-table-column label="瀛楀吀缂栫爜" align="center" prop="dictCode" v-if="false" /> + <el-table-column label="瀛楀吀鏍囩" align="center" prop="dictLabel"> + <template #default="scope"> + <span v-if="scope.row.listClass === '' || scope.row.listClass === 'default'">{{ scope.row.dictLabel }}</span> + <el-tag v-else :type="scope.row.listClass === 'primary' ? '' : scope.row.listClass">{{ scope.row.dictLabel + }}</el-tag> + </template> + </el-table-column> + <el-table-column label="瀛楀吀閿��" align="center" prop="dictValue" /> + <el-table-column label="瀛楀吀鎺掑簭" align="center" prop="dictSort" /> + <el-table-column label="鐘舵��" align="center" prop="status"> + <template #default="scope"> + <dict-tag :options="sys_normal_disable" :value="scope.row.status" /> + </template> + </el-table-column> + <el-table-column label="澶囨敞" align="center" prop="remark" :show-overflow-tooltip="true" /> + <el-table-column label="鍒涘缓鏃堕棿" align="center" prop="createTime" width="180"> + <template #default="scope"> + <span>{{ parseTime(scope.row.createTime) }}</span> + </template> + </el-table-column> + <el-table-column label="鎿嶄綔" align="center" width="160" class-name="small-padding fixed-width"> + <template #default="scope"> + <el-tooltip content="淇敼" placement="top"> + <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:dict:edit']"></el-button> + </el-tooltip> + <el-tooltip content="鍒犻櫎" placement="top"> + <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:dict:remove']"></el-button> + </el-tooltip> + </template> + </el-table-column> + </el-table> + + <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" /> + </el-card> + <!-- 娣诲姞鎴栦慨鏀瑰弬鏁伴厤缃璇濇 --> + <el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body> + <el-form ref="dataFormRef" :model="form" :rules="rules" label-width="80px"> + <el-form-item label="瀛楀吀绫诲瀷"> + <el-input v-model="form.dictType" :disabled="true" /> + </el-form-item> + <el-form-item label="鏁版嵁鏍囩" prop="dictLabel"> + <el-input v-model="form.dictLabel" placeholder="璇疯緭鍏ユ暟鎹爣绛�" /> + </el-form-item> + <el-form-item label="鏁版嵁閿��" prop="dictValue"> + <el-input v-model="form.dictValue" placeholder="璇疯緭鍏ユ暟鎹敭鍊�" /> + </el-form-item> + <el-form-item label="鏍峰紡灞炴��" prop="cssClass"> + <el-input v-model="form.cssClass" placeholder="璇疯緭鍏ユ牱寮忓睘鎬�" /> + </el-form-item> + <el-form-item label="鏄剧ず鎺掑簭" prop="dictSort"> + <el-input-number v-model="form.dictSort" controls-position="right" :min="0" /> + </el-form-item> + <el-form-item label="鍥炴樉鏍峰紡" prop="listClass"> + <el-select v-model="form.listClass"> + <el-option + v-for="item in listClassOptions" + :key="item.value" + :label="item.label + '(' + item.value + ')'" + :value="item.value" + ></el-option> + </el-select> + </el-form-item> + <el-form-item label="鐘舵��" prop="status"> + <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-form-item label="澶囨敞" prop="remark"> + <el-input v-model="form.remark" type="textarea" placeholder="璇疯緭鍏ュ唴瀹�"></el-input> + </el-form-item> + </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="Data" lang="ts"> import useDictStore from '@/store/modules/dict' import { optionselect as getDictOptionselect, getType } from "@/api/system/dict/type"; @@ -26,287 +159,154 @@ const dialog = reactive<DialogOption>({ - visible: false, - title: '' + visible: false, + title: '' }); // 鏁版嵁鏍囩鍥炴樉鏍峰紡 const listClassOptions = ref<Array<{ value: string, label: string }>>([ - { value: "default", label: "榛樿" }, - { value: "primary", label: "涓昏" }, - { value: "success", label: "鎴愬姛" }, - { value: "info", label: "淇℃伅" }, - { value: "warning", label: "璀﹀憡" }, - { value: "danger", label: "鍗遍櫓" } + { value: "default", label: "榛樿" }, + { value: "primary", label: "涓昏" }, + { value: "success", label: "鎴愬姛" }, + { value: "info", label: "淇℃伅" }, + { value: "warning", label: "璀﹀憡" }, + { value: "danger", label: "鍗遍櫓" } ]); const initFormData: DictDataForm = { - dictCode: undefined, - dictLabel: '', - dictValue: '', - cssClass: '', - listClass: "default", - dictSort: 0, - status: "0", - remark: '' + dictCode: undefined, + dictLabel: '', + dictValue: '', + cssClass: '', + listClass: "default", + dictSort: 0, + status: "0", + remark: '' } const data = reactive<PageData<DictDataForm, DictDataQuery>>({ - form: { ...initFormData }, - queryParams: { - pageNum: 1, - pageSize: 10, - dictName: '', - dictType: '', - status: '', - dictLabel: '' - }, - rules: { - dictLabel: [{ required: true, message: "鏁版嵁鏍囩涓嶈兘涓虹┖", trigger: "blur" }], - dictValue: [{ required: true, message: "鏁版嵁閿�间笉鑳戒负绌�", trigger: "blur" }], - dictSort: [{ required: true, message: "鏁版嵁椤哄簭涓嶈兘涓虹┖", trigger: "blur" }] - } + form: { ...initFormData }, + queryParams: { + pageNum: 1, + pageSize: 10, + dictName: '', + dictType: '', + status: '', + dictLabel: '' + }, + rules: { + dictLabel: [{ required: true, message: "鏁版嵁鏍囩涓嶈兘涓虹┖", trigger: "blur" }], + dictValue: [{ required: true, message: "鏁版嵁閿�间笉鑳戒负绌�", trigger: "blur" }], + dictSort: [{ required: true, message: "鏁版嵁椤哄簭涓嶈兘涓虹┖", trigger: "blur" }] + } }); const { queryParams, form, rules } = toRefs(data); /** 鏌ヨ瀛楀吀绫诲瀷璇︾粏 */ const getTypes = async (dictId: string | number) => { - const { data } = await getType(dictId); - queryParams.value.dictType = data.dictType; - defaultDictType.value = data.dictType; - getList(); + const { data } = await getType(dictId); + queryParams.value.dictType = data.dictType; + defaultDictType.value = data.dictType; + getList(); } /** 鏌ヨ瀛楀吀绫诲瀷鍒楄〃 */ const getTypeList = async () => { - const res = await getDictOptionselect() - typeOptions.value = res.data; + const res = await getDictOptionselect() + typeOptions.value = res.data; } /** 鏌ヨ瀛楀吀鏁版嵁鍒楄〃 */ const getList = async () => { - loading.value = true; - const res = await listData(queryParams.value); - dataList.value = res.rows; - total.value = res.total; - loading.value = false; + loading.value = true; + const res = await listData(queryParams.value); + dataList.value = res.rows; + total.value = res.total; + loading.value = false; } /** 鍙栨秷鎸夐挳 */ const cancel = () => { - dialog.visible = false; - reset(); + dialog.visible = false; + reset(); } /** 琛ㄥ崟閲嶇疆 */ const reset = () => { - form.value = { ...initFormData }; - dataFormRef.value.resetFields(); + form.value = { ...initFormData }; + dataFormRef.value.resetFields(); } /** 鎼滅储鎸夐挳鎿嶄綔 */ const handleQuery = () => { - queryParams.value.pageNum = 1; - getList(); + queryParams.value.pageNum = 1; + getList(); } /** 杩斿洖鎸夐挳鎿嶄綔 */ const handleClose = () => { - const obj = { path: "/system/dict" }; - proxy?.$tab.closeOpenPage(obj); + const obj = { path: "/system/dict" }; + proxy?.$tab.closeOpenPage(obj); } /** 閲嶇疆鎸夐挳鎿嶄綔 */ const resetQuery = () => { - queryFormRef.value.resetFields(); - queryParams.value.dictType = defaultDictType.value; - handleQuery(); + queryFormRef.value.resetFields(); + queryParams.value.dictType = defaultDictType.value; + handleQuery(); } /** 鏂板鎸夐挳鎿嶄綔 */ const handleAdd = () => { - dialog.visible = true; - dialog.title = "娣诲姞瀛楀吀鏁版嵁"; - nextTick(() => { - reset(); - form.value.dictType = queryParams.value.dictType; - }) + dialog.visible = true; + dialog.title = "娣诲姞瀛楀吀鏁版嵁"; + nextTick(() => { + reset(); + form.value.dictType = queryParams.value.dictType; + }) } /** 澶氶�夋閫変腑鏁版嵁 */ const handleSelectionChange = (selection: DictDataVO[]) => { - ids.value = selection.map(item => item.dictCode); - single.value = selection.length != 1; - multiple.value = !selection.length; + ids.value = selection.map(item => item.dictCode); + single.value = selection.length != 1; + multiple.value = !selection.length; } /** 淇敼鎸夐挳鎿嶄綔 */ const handleUpdate = (row?: DictDataVO) => { - const dictCode = row?.dictCode || ids.value[0]; - dialog.visible = true; - dialog.title = "淇敼瀛楀吀鏁版嵁"; - nextTick(async () => { - const res = await getData(dictCode); - reset(); - form.value = res.data; - }) + const dictCode = row?.dictCode || ids.value[0]; + dialog.visible = true; + dialog.title = "淇敼瀛楀吀鏁版嵁"; + nextTick(async () => { + const res = await getData(dictCode); + reset(); + form.value = res.data; + }) } /** 鎻愪氦鎸夐挳 */ const submitForm = () => { - dataFormRef.value.validate(async (valid: boolean) => { - if (valid) { - form.value.dictCode ? await updateData(form.value) : await addData(form.value); - useDictStore().removeDict(queryParams.value.dictType); - proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛"); - dialog.visible = false; - getList(); + dataFormRef.value.validate(async (valid: boolean) => { + if (valid) { + form.value.dictCode ? await updateData(form.value) : await addData(form.value); + useDictStore().removeDict(queryParams.value.dictType); + proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛"); + dialog.visible = false; + getList(); - } - }); + } + }); } /** 鍒犻櫎鎸夐挳鎿嶄綔 */ const handleDelete = async (row?: DictDataVO) => { - const dictCodes = row?.dictCode || ids.value; - await proxy?.$modal.confirm('鏄惁纭鍒犻櫎瀛楀吀缂栫爜涓�"' + dictCodes + '"鐨勬暟鎹」锛�'); - await delData(dictCodes); - getList(); - proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛"); - useDictStore().removeDict(queryParams.value.dictType); + const dictCodes = row?.dictCode || ids.value; + await proxy?.$modal.confirm('鏄惁纭鍒犻櫎瀛楀吀缂栫爜涓�"' + dictCodes + '"鐨勬暟鎹」锛�'); + await delData(dictCodes); + getList(); + proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛"); + useDictStore().removeDict(queryParams.value.dictType); } /** 瀵煎嚭鎸夐挳鎿嶄綔 */ const handleExport = () => { - proxy?.download("system/dict/data/export", { - ...queryParams.value - }, `dict_data_${new Date().getTime()}.xlsx`); + proxy?.download("system/dict/data/export", { + ...queryParams.value + }, `dict_data_${new Date().getTime()}.xlsx`); } onMounted(() => { - getTypes(route.params && route.params.dictId as string); - getTypeList(); + getTypes(route.params && route.params.dictId as string); + getTypeList(); }) </script> - -<template> - <div class="p-2"> - <transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave"> - <div class="search" v-show="showSearch"> - <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px"> - <el-form-item label="瀛楀吀鍚嶇О" prop="dictType"> - <el-select v-model="queryParams.dictType" style="width: 200px"> - <el-option v-for="item in typeOptions" :key="item.dictId" :label="item.dictName" :value="item.dictType" /> - </el-select> - </el-form-item> - <el-form-item label="瀛楀吀鏍囩" prop="dictLabel"> - <el-input v-model="queryParams.dictLabel" 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> - </div> - </transition> - <el-card shadow="never"> - <template #header> - <el-row :gutter="10" class="mb8"> - <el-col :span="1.5"> - <el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['system:dict:add']">鏂板</el-button> - </el-col> - <el-col :span="1.5"> - <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['system:dict:edit']">淇敼</el-button> - </el-col> - <el-col :span="1.5"> - <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['system:dict:remove']"> - 鍒犻櫎 - </el-button> - </el-col> - <el-col :span="1.5"> - <el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['system:dict:export']">瀵煎嚭</el-button> - </el-col> - <el-col :span="1.5"> - <el-button type="warning" plain icon="Close" @click="handleClose">鍏抽棴</el-button> - </el-col> - <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar> - </el-row> - </template> - - <el-table v-loading="loading" :data="dataList" @selection-change="handleSelectionChange"> - <el-table-column type="selection" width="55" align="center" /> - <el-table-column label="瀛楀吀缂栫爜" align="center" prop="dictCode" v-if="false" /> - <el-table-column label="瀛楀吀鏍囩" align="center" prop="dictLabel"> - <template #default="scope"> - <span v-if="scope.row.listClass === '' || scope.row.listClass === 'default'">{{ scope.row.dictLabel }}</span> - <el-tag v-else :type="scope.row.listClass === 'primary' ? '' : scope.row.listClass">{{ scope.row.dictLabel - }}</el-tag> - </template> - </el-table-column> - <el-table-column label="瀛楀吀閿��" align="center" prop="dictValue" /> - <el-table-column label="瀛楀吀鎺掑簭" align="center" prop="dictSort" /> - <el-table-column label="鐘舵��" align="center" prop="status"> - <template #default="scope"> - <dict-tag :options="sys_normal_disable" :value="scope.row.status" /> - </template> - </el-table-column> - <el-table-column label="澶囨敞" align="center" prop="remark" :show-overflow-tooltip="true" /> - <el-table-column label="鍒涘缓鏃堕棿" align="center" prop="createTime" width="180"> - <template #default="scope"> - <span>{{ parseTime(scope.row.createTime) }}</span> - </template> - </el-table-column> - <el-table-column label="鎿嶄綔" align="center" width="160" class-name="small-padding fixed-width"> - <template #default="scope"> - <el-tooltip content="淇敼" placement="top"> - <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:dict:edit']"></el-button> - </el-tooltip> - <el-tooltip content="鍒犻櫎" placement="top"> - <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:dict:remove']"></el-button> - </el-tooltip> - </template> - </el-table-column> - </el-table> - - <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" /> - </el-card> - <!-- 娣诲姞鎴栦慨鏀瑰弬鏁伴厤缃璇濇 --> - <el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body> - <el-form ref="dataFormRef" :model="form" :rules="rules" label-width="80px"> - <el-form-item label="瀛楀吀绫诲瀷"> - <el-input v-model="form.dictType" :disabled="true" /> - </el-form-item> - <el-form-item label="鏁版嵁鏍囩" prop="dictLabel"> - <el-input v-model="form.dictLabel" placeholder="璇疯緭鍏ユ暟鎹爣绛�" /> - </el-form-item> - <el-form-item label="鏁版嵁閿��" prop="dictValue"> - <el-input v-model="form.dictValue" placeholder="璇疯緭鍏ユ暟鎹敭鍊�" /> - </el-form-item> - <el-form-item label="鏍峰紡灞炴��" prop="cssClass"> - <el-input v-model="form.cssClass" placeholder="璇疯緭鍏ユ牱寮忓睘鎬�" /> - </el-form-item> - <el-form-item label="鏄剧ず鎺掑簭" prop="dictSort"> - <el-input-number v-model="form.dictSort" controls-position="right" :min="0" /> - </el-form-item> - <el-form-item label="鍥炴樉鏍峰紡" prop="listClass"> - <el-select v-model="form.listClass"> - <el-option - v-for="item in listClassOptions" - :key="item.value" - :label="item.label + '(' + item.value + ')'" - :value="item.value" - ></el-option> - </el-select> - </el-form-item> - <el-form-item label="鐘舵��" prop="status"> - <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-form-item label="澶囨敞" prop="remark"> - <el-input v-model="form.remark" type="textarea" placeholder="璇疯緭鍏ュ唴瀹�"></el-input> - </el-form-item> - </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> -- Gitblit v1.9.3