From bbe94610a28e72414df1fb2b36a6d11385873e54 Mon Sep 17 00:00:00 2001 From: 疯狂的狮子Li <15040126243@163.com> Date: 星期一, 20 一月 2025 11:30:16 +0800 Subject: [PATCH] update 优化 parseTime 提示报错问题 --- src/views/system/dict/index.vue | 451 ++++++++++++++++++++++++-------------------------------- 1 files changed, 192 insertions(+), 259 deletions(-) diff --git a/src/views/system/dict/index.vue b/src/views/system/dict/index.vue index 48f3a16..d30ad54 100644 --- a/src/views/system/dict/index.vue +++ b/src/views/system/dict/index.vue @@ -1,313 +1,246 @@ <template> - <div class="app-container"> - <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px"> - <el-form-item label="瀛楀吀鍚嶇О" prop="dictName"> - <el-input - v-model="queryParams.dictName" - placeholder="璇疯緭鍏ュ瓧鍏稿悕绉�" - clearable - style="width: 240px" - @keyup.enter="handleQuery" - /> - </el-form-item> - <el-form-item label="瀛楀吀绫诲瀷" prop="dictType"> - <el-input - v-model="queryParams.dictType" - placeholder="璇疯緭鍏ュ瓧鍏哥被鍨�" - clearable - style="width: 240px" - @keyup.enter="handleQuery" - /> - </el-form-item> - <el-form-item label="鐘舵��" prop="status"> - <el-select - v-model="queryParams.status" - placeholder="瀛楀吀鐘舵��" - clearable - style="width: 240px" - > - <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 label="鍒涘缓鏃堕棿" style="width: 308px"> - <el-date-picker - v-model="dateRange" - value-format="YYYY-MM-DD HH:mm:ss" - type="daterange" - range-separator="-" - start-placeholder="寮�濮嬫棩鏈�" - end-placeholder="缁撴潫鏃ユ湡" - :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]" - ></el-date-picker> - </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> - - <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="danger" - plain - icon="Refresh" - @click="handleRefreshCache" - v-hasPermi="['system:dict:remove']" - >鍒锋柊缂撳瓨</el-button> - </el-col> - <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar> - </el-row> - - <el-table v-loading="loading" :data="typeList" @selection-change="handleSelectionChange"> - <el-table-column type="selection" width="55" align="center" /> - <el-table-column label="瀛楀吀缂栧彿" align="center" prop="dictId" v-if="false" /> - <el-table-column label="瀛楀吀鍚嶇О" align="center" prop="dictName" :show-overflow-tooltip="true"/> - <el-table-column label="瀛楀吀绫诲瀷" align="center" :show-overflow-tooltip="true"> - <template #default="scope"> - <router-link :to="'/system/dict-data/index/' + scope.row.dictId" class="link-type"> - <span>{{ scope.row.dictType }}</span> - </router-link> - </template> - </el-table-column> - <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-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:dict:edit']">淇敼</el-button> - <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:dict:remove']">鍒犻櫎</el-button> - </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-dialog :title="title" v-model="open" width="500px" append-to-body> - <el-form ref="dictRef" :model="form" :rules="rules" label-width="80px"> + <div class="p-2"> + <transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave"> + <div v-show="showSearch" class="mb-[10px]"> + <el-card shadow="hover"> + <el-form ref="queryFormRef" :model="queryParams" :inline="true"> <el-form-item label="瀛楀吀鍚嶇О" prop="dictName"> - <el-input v-model="form.dictName" placeholder="璇疯緭鍏ュ瓧鍏稿悕绉�" /> + <el-input v-model="queryParams.dictName" placeholder="璇疯緭鍏ュ瓧鍏稿悕绉�" clearable @keyup.enter="handleQuery" /> </el-form-item> <el-form-item label="瀛楀吀绫诲瀷" prop="dictType"> - <el-input v-model="form.dictType" placeholder="璇疯緭鍏ュ瓧鍏哥被鍨�" /> + <el-input v-model="queryParams.dictType" placeholder="璇疯緭鍏ュ瓧鍏哥被鍨�" clearable @keyup.enter="handleQuery" /> </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 label="鍒涘缓鏃堕棿" style="width: 308px"> + <el-date-picker + v-model="dateRange" + value-format="YYYY-MM-DD HH:mm:ss" + type="daterange" + range-separator="-" + start-placeholder="寮�濮嬫棩鏈�" + end-placeholder="缁撴潫鏃ユ湡" + :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]" + ></el-date-picker> </el-form-item> - <el-form-item label="澶囨敞" prop="remark"> - <el-input v-model="form.remark" type="textarea" placeholder="璇疯緭鍏ュ唴瀹�"></el-input> + <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> - <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-form> + </el-card> + </div> + </transition> + <el-card shadow="hover"> + <template #header> + <el-row :gutter="10" class="mb8"> + <el-col :span="1.5"> + <el-button v-hasPermi="['system:dict:add']" type="primary" plain icon="Plus" @click="handleAdd">鏂板</el-button> + </el-col> + <el-col :span="1.5"> + <el-button v-hasPermi="['system:dict:edit']" type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()">淇敼</el-button> + </el-col> + <el-col :span="1.5"> + <el-button v-hasPermi="['system:dict:remove']" type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()"> + 鍒犻櫎 + </el-button> + </el-col> + <el-col :span="1.5"> + <el-button v-hasPermi="['system:dict:export']" type="warning" plain icon="Download" @click="handleExport">瀵煎嚭</el-button> + </el-col> + <el-col :span="1.5"> + <el-button v-hasPermi="['system:dict:remove']" type="danger" plain icon="Refresh" @click="handleRefreshCache">鍒锋柊缂撳瓨</el-button> + </el-col> + <right-toolbar v-model:show-search="showSearch" @query-table="getList"></right-toolbar> + </el-row> + </template> + + <el-table v-loading="loading" :data="typeList" @selection-change="handleSelectionChange"> + <el-table-column type="selection" width="55" align="center" /> + <el-table-column v-if="false" label="瀛楀吀缂栧彿" align="center" prop="dictId" /> + <el-table-column label="瀛楀吀鍚嶇О" align="center" prop="dictName" :show-overflow-tooltip="true" /> + <el-table-column label="瀛楀吀绫诲瀷" align="center" :show-overflow-tooltip="true"> + <template #default="scope"> + <router-link :to="'/system/dict-data/index/' + scope.row.dictId" class="link-type"> + <span>{{ scope.row.dictType }}</span> + </router-link> + </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>{{ proxy.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 v-hasPermi="['system:dict:edit']" link type="primary" icon="Edit" @click="handleUpdate(scope.row)"></el-button> + </el-tooltip> + <el-tooltip content="鍒犻櫎" placement="top"> + <el-button v-hasPermi="['system:dict:remove']" link type="primary" icon="Delete" @click="handleDelete(scope.row)"></el-button> + </el-tooltip> + </template> + </el-table-column> + </el-table> + + <pagination v-show="total > 0" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" :total="total" @pagination="getList" /> + </el-card> + <!-- 娣诲姞鎴栦慨鏀瑰弬鏁伴厤缃璇濇 --> + <el-dialog v-model="dialog.visible" :title="dialog.title" width="500px" append-to-body> + <el-form ref="dictFormRef" :model="form" :rules="rules" label-width="80px"> + <el-form-item label="瀛楀吀鍚嶇О" prop="dictName"> + <el-input v-model="form.dictName" placeholder="璇疯緭鍏ュ瓧鍏稿悕绉�" /> + </el-form-item> + <el-form-item label="瀛楀吀绫诲瀷" prop="dictType"> + <el-input v-model="form.dictType" placeholder="璇疯緭鍏ュ瓧鍏哥被鍨�" /> + </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="Dict"> -import useDictStore from '@/store/modules/dict' -import { listType, getType, delType, addType, updateType, refreshCache } from "@/api/system/dict/type"; +<script setup name="Dict" lang="ts"> +import useDictStore from '@/store/modules/dict'; +import { listType, getType, delType, addType, updateType, refreshCache } from '@/api/system/dict/type'; +import { DictTypeForm, DictTypeQuery, DictTypeVO } from '@/api/system/dict/type/types'; -const { proxy } = getCurrentInstance(); -const { sys_normal_disable } = proxy.useDict("sys_normal_disable"); +const { proxy } = getCurrentInstance() as ComponentInternalInstance; -const typeList = ref([]); -const open = ref(false); +const typeList = ref<DictTypeVO[]>([]); const loading = ref(true); const showSearch = ref(true); -const ids = ref([]); +const ids = ref<Array<number | string>>([]); const single = ref(true); const multiple = ref(true); const total = ref(0); -const title = ref(""); -const dateRange = ref([]); +const dateRange = ref<[DateModelType, DateModelType]>(['', '']); -const data = reactive({ - form: {}, +const dictFormRef = ref<ElFormInstance>(); +const queryFormRef = ref<ElFormInstance>(); + +const dialog = reactive<DialogOption>({ + visible: false, + title: '' +}); + +const initFormData: DictTypeForm = { + dictId: undefined, + dictName: '', + dictType: '', + remark: '' +}; +const data = reactive<PageData<DictTypeForm, DictTypeQuery>>({ + form: { ...initFormData }, queryParams: { pageNum: 1, pageSize: 10, - dictName: undefined, - dictType: undefined, - status: undefined + dictName: '', + dictType: '' }, rules: { - dictName: [{ required: true, message: "瀛楀吀鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }], - dictType: [{ required: true, message: "瀛楀吀绫诲瀷涓嶈兘涓虹┖", trigger: "blur" }] - }, + dictName: [{ required: true, message: '瀛楀吀鍚嶇О涓嶈兘涓虹┖', trigger: 'blur' }], + dictType: [{ required: true, message: '瀛楀吀绫诲瀷涓嶈兘涓虹┖', trigger: 'blur' }] + } }); const { queryParams, form, rules } = toRefs(data); /** 鏌ヨ瀛楀吀绫诲瀷鍒楄〃 */ -function getList() { +const getList = () => { loading.value = true; - listType(proxy.addDateRange(queryParams.value, dateRange.value)).then(response => { - typeList.value = response.rows; - total.value = response.total; + listType(proxy?.addDateRange(queryParams.value, dateRange.value)).then((res) => { + typeList.value = res.rows; + total.value = res.total; loading.value = false; }); -} +}; /** 鍙栨秷鎸夐挳 */ -function cancel() { - open.value = false; +const cancel = () => { reset(); -} + dialog.visible = false; +}; /** 琛ㄥ崟閲嶇疆 */ -function reset() { - form.value = { - dictId: undefined, - dictName: undefined, - dictType: undefined, - status: "0", - remark: undefined - }; - proxy.resetForm("dictRef"); -} +const reset = () => { + form.value = { ...initFormData }; + dictFormRef.value?.resetFields(); +}; /** 鎼滅储鎸夐挳鎿嶄綔 */ -function handleQuery() { +const handleQuery = () => { queryParams.value.pageNum = 1; getList(); -} +}; /** 閲嶇疆鎸夐挳鎿嶄綔 */ -function resetQuery() { - dateRange.value = []; - proxy.resetForm("queryRef"); +const resetQuery = () => { + dateRange.value = ['', '']; + queryFormRef.value?.resetFields(); handleQuery(); -} +}; /** 鏂板鎸夐挳鎿嶄綔 */ -function handleAdd() { +const handleAdd = () => { reset(); - open.value = true; - title.value = "娣诲姞瀛楀吀绫诲瀷"; -} + dialog.visible = true; + dialog.title = '娣诲姞瀛楀吀绫诲瀷'; +}; /** 澶氶�夋閫変腑鏁版嵁 */ -function handleSelectionChange(selection) { - ids.value = selection.map(item => item.dictId); +const handleSelectionChange = (selection: DictTypeVO[]) => { + ids.value = selection.map((item) => item.dictId); single.value = selection.length != 1; multiple.value = !selection.length; -} +}; /** 淇敼鎸夐挳鎿嶄綔 */ -function handleUpdate(row) { +const handleUpdate = async (row?: DictTypeVO) => { reset(); - const dictId = row.dictId || ids.value; - getType(dictId).then(response => { - form.value = response.data; - open.value = true; - title.value = "淇敼瀛楀吀绫诲瀷"; - }); -} + const dictId = row?.dictId || ids.value[0]; + const res = await getType(dictId); + Object.assign(form.value, res.data); + dialog.visible = true; + dialog.title = '淇敼瀛楀吀绫诲瀷'; +}; /** 鎻愪氦鎸夐挳 */ -function submitForm() { - proxy.$refs["dictRef"].validate(valid => { +const submitForm = () => { + dictFormRef.value?.validate(async (valid: boolean) => { if (valid) { - if (form.value.dictId != undefined) { - updateType(form.value).then(response => { - proxy.$modal.msgSuccess("淇敼鎴愬姛"); - open.value = false; - getList(); - }); - } else { - addType(form.value).then(response => { - proxy.$modal.msgSuccess("鏂板鎴愬姛"); - open.value = false; - getList(); - }); - } + form.value.dictId ? await updateType(form.value) : await addType(form.value); + proxy?.$modal.msgSuccess('鎿嶄綔鎴愬姛'); + dialog.visible = false; + getList(); } }); -} +}; /** 鍒犻櫎鎸夐挳鎿嶄綔 */ -function handleDelete(row) { - const dictIds = row.dictId || ids.value; - proxy.$modal.confirm('鏄惁纭鍒犻櫎瀛楀吀缂栧彿涓�"' + dictIds + '"鐨勬暟鎹」锛�').then(function() { - return delType(dictIds); - }).then(() => { - getList(); - proxy.$modal.msgSuccess("鍒犻櫎鎴愬姛"); - }).catch(() => {}); -} +const handleDelete = async (row?: DictTypeVO) => { + const dictIds = row?.dictId || ids.value; + await proxy?.$modal.confirm('鏄惁纭鍒犻櫎瀛楀吀缂栧彿涓�"' + dictIds + '"鐨勬暟鎹」锛�'); + await delType(dictIds); + getList(); + proxy?.$modal.msgSuccess('鍒犻櫎鎴愬姛'); +}; /** 瀵煎嚭鎸夐挳鎿嶄綔 */ -function handleExport() { - proxy.download("system/dict/type/export", { - ...queryParams.value - }, `dict_${new Date().getTime()}.xlsx`); -} +const handleExport = () => { + proxy?.download( + 'system/dict/type/export', + { + ...queryParams.value + }, + `dict_${new Date().getTime()}.xlsx` + ); +}; /** 鍒锋柊缂撳瓨鎸夐挳鎿嶄綔 */ -function handleRefreshCache() { - refreshCache().then(() => { - proxy.$modal.msgSuccess("鍒锋柊鎴愬姛"); - useDictStore().cleanDict(); - }); -} +const handleRefreshCache = async () => { + await refreshCache(); + proxy?.$modal.msgSuccess('鍒锋柊鎴愬姛'); + useDictStore().cleanDict(); +}; -getList(); +onMounted(() => { + getList(); +}); </script> -- Gitblit v1.9.3