1

src/router/module/system.js

@@ -8,5 +8,10 @@ export default [
     path: '/system/dict',
     meta: { title: '字典表设置', is_filter: true },
     component: () => import('@/views/system/dict/index.vue')
+  },
+  {
+    path: '/system/dict/detail',
+    meta: { title: '字典表设置', is_filter: true },
+    component: () => import('@/views/system/dict/detail.vue')
   }
-];
+]

src/views/system/dict/detail.vue

@@ -3,38 +3,38 @@
     <el-row>
       <el-col :span="24" class="main animate__animated animate__backInRight">
         <el-col :span="24" class="one">
-          <c-search :is_title="false" :is_back="true" @toBack="toBack"> </c-search>
-        </el-col>
-        <el-col :span="24" class="two">
-          <component :is="search1" :form="searchForm" @onSubmit="toSearch" @toReset="toReset" @changeType="changeType"></component>
+          <c-search :is_title="false" :is_back="true" @toBack="toBack" :is_search="true" :fields="fields" @search="toSearch">
+            <template #type>
+              <el-select v-model="searchForm.type" filterable placeholder="请选择" style="width: 100%" @change="changeType">
+                <el-option v-for="(item, index) in typeList" :key="index" :label="item.name" :value="item.type"></el-option>
+              </el-select>
+            </template>
+          </c-search>
         </el-col>
         <el-col :span="24" class="two">
           <cButton @toAdd="toAdd()"> </cButton>
         </el-col>
         <el-col :span="24" class="fou">
-          <cTable :fields="fields" :opera="opera" :data="list" @query="search" :total="total" @edit="toEdit" @del="toDel" :select="false"> </cTable>
+          <cTable :fields="fields" :opera="opera" :list="list" @query="search" :total="total" @edit="toEdit" @del="toDel" :select="false">
+            <template #type="{ item, row }">
+              <template v-if="item.model === 'type'">
+                {{ getProps(row, item.model) }}
+              </template>
+            </template>
+          </cTable>
         </el-col>
       </el-col>
     </el-row>
     <cDialog :dialog="dialog" @handleClose="toClose">
       <template v-slot:info>
-        <cForm v-if="dialog.type == '1'" :span="24" :fields="formFields" :form="form" :rules="rules" @save="onSubmit">
-          <template #status>
-            <el-radio label="0">正常</el-radio>
-            <el-radio label="1">停用</el-radio>
-          </template>
-          <template #is_default>
-            <el-radio label="0">非默认</el-radio>
-            <el-radio label="1">默认</el-radio>
-          </template>
-        </cForm>
+        <cForm v-if="dialog.type == '1'" :span="24" :fields="formFields" :form="form" :rules="rules" @save="onSubmit"> </cForm>
       </template>
     </cDialog>
   </div>
 </template>
 <script lang="ts" setup>
 import _ from 'lodash'
-import search1 from './parts_two/search-1.vue'
+// import search1 from './parts_two/search-1.vue'
 import type { FormRules } from 'element-plus'
 import type { Ref } from 'vue'
 import { ref, onMounted, getCurrentInstance, reactive } from 'vue'
@@ -48,16 +48,17 @@ const dictData = DictDataStore()
 const route = useRoute()
 const { proxy } = getCurrentInstance() as any
 // 列表数据
-let list: Ref<any[]> = ref([])
+let list: Ref<any> = ref([])
 // 总数
 let total: Ref<number> = ref(0)
 let skip = 0
 let limit: number = proxy.$limit
 // 列表
 let fields: Ref<any[]> = ref([
-  { label: '字典标签', model: 'dict_label' },
-  { label: '字典键值', model: 'dict_value' },
-  { label: '字典排序', model: 'dict_sort' },
+  { label: '字典类型', model: 'type', isSearch: true, custom: true },
+  { label: '字典标签', model: 'label', isSearch: true },
+  { label: '字典键值', model: 'value' },
+  { label: '字典排序', model: 'sort' },
   { label: '状态', model: 'status', format: (i) => (i == '0' ? '正常' : '停用') }
 ])
 // 操作
@@ -70,23 +71,24 @@ let form: Ref<any> = ref({})
 
 // 表单
 let formFields: Ref<any[]> = ref([
-  { label: '字典类型', model: 'dict_type' },
-  { label: '字典标签', model: 'dict_label' },
-  { label: '字典键值', model: 'dict_value' },
-  { label: '显示排序', model: 'dict_sort', type: 'number' },
-  { label: '是否默认', model: 'is_default', type: 'radio' },
-  { label: '状态', model: 'status', type: 'radio' }
+  { label: '字典类型', model: 'type' },
+  { label: '字典标签', model: 'label' },
+  { label: '字典键值', model: 'value' },
+  { label: '显示排序', model: 'sort', type: 'number' },
+  { label: '是否启用', model: 'is_use', type: 'radio' }
 ])
 const rules = reactive<FormRules>({
-  dict_name: [{ required: true, message: '请输入字典名称', trigger: 'blur' }],
-  dict_type: [{ required: true, message: '请输入字典类型', trigger: 'blur' }],
-  status: [{ required: true, message: '请选择状态', trigger: 'change' }]
+  type: [{ required: true, message: '请输入字典类型', trigger: 'blur' }],
+  label: [{ required: true, message: '请输入字典标签', trigger: 'blur' }],
+  value: [{ required: true, message: '请输入字典键值', trigger: 'blur' }],
+  sort: [{ required: true, message: '请输入显示排序', trigger: 'blur' }]
+  // is_use: [{ required: true, message: '请选择是否启用', trigger: 'change' }]
 })
 
 // 查询数据
 let searchForm: Ref<any> = ref({})
-let dict_type: Ref<any> = ref('')
-let dict_typeList: Ref<any> = ref([])
+let type: Ref<any> = ref('')
+let typeList: Ref<any> = ref([])
 
 onMounted(async () => {
   await searchOther()
@@ -107,15 +109,11 @@ const toSearch = () => {
   search({ skip, limit })
 }
 const searchOther = async () => {
-  if (route.query.dict_type) dict_type.value = route.query.dict_type
-  form.value.dict_type = dict_type.value
-  searchForm.value.dict_type = dict_type.value
+  if (route.query.type) type.value = route.query.type
+  form.value.type = type.value
+  searchForm.value.type = type.value
   let res: IQueryResult = await dictType.query()
-  if (res.errcode == 0) dict_typeList.value = res.data as any[]
-}
-const toReset = () => {
-  searchForm.value = { dict_type: route.query.dict_type }
-  search({ skip, limit })
+  if (res.errcode == 0) typeList.value = res.data
 }
 // 新增
 const toAdd = () => {
@@ -139,6 +137,13 @@ const onSubmit = async (data) => {
     toClose()
   }
 }
+const getProps = (e, model) => {
+  if (model == 'type') {
+    let data = typeList.value.find((i) => i.type == e.type)
+    if (data) return data.name
+  }
+}
+
 // 删除
 const toDel = async (data) => {
   let res: IQueryResult = await dictData.del(data._id)
@@ -149,8 +154,8 @@ const toDel = async (data) => {
 }
 // 选择字典名称
 const changeType = (value) => {
-  dict_type.value = value
-  form.value.dict_type = value
+  type.value = value
+  form.value.type = value
 }
 // 返回
 const toBack = () => {
@@ -159,7 +164,7 @@ const toBack = () => {
 // 弹框关闭
 const toClose = () => {
   form.value = {}
-  searchForm.value = { dict_type: dict_type.value }
+  searchForm.value = { type: type.value }
   dialog.value = { title: '信息管理', show: false, type: '1' }
   search({ skip, limit })
 }

src/views/system/dict/index.vue

@@ -4,8 +4,8 @@
       <el-col :span="24" class="main animate__animated animate__backInRight">
         <el-col :span="24" class="one">
           <cSearch :is_title="false" :is_search="true" :fields="fields" @search="toSearch">
-            <template #dict_type>
-              <el-input v-model="searchForm.dict_type" placeholder="请输入字典类型"></el-input>
+            <template #type>
+              <el-input v-model="searchForm.type" placeholder="请输入字典类型"></el-input>
             </template>
           </cSearch>
         </el-col>
@@ -13,9 +13,9 @@
           <cButton @toAdd="toAdd()"> </cButton>
         </el-col>
         <el-col :span="24" class="thr">
-          <cTable :fields="fields" :opera="opera" :data="list" @query="search" :total="total" @edit="toEdit" @del="toDel" :select="false">
-            <template #dict_type="{ item, row }">
-              <template v-if="item.model === 'dict_type'">
+          <cTable :fields="fields" :opera="opera" :list="list" @query="search" :total="total" @edit="toEdit" @del="toDel" :select="false">
+            <template #type="{ item, row }">
+              <template v-if="item.model === 'type'">
                 <el-link size="mini" type="primary" @click="toType(row)">{{ getProps(row, item.model) }}</el-link>
               </template>
             </template>
@@ -26,9 +26,8 @@
     <cDialog :dialog="dialog" @handleClose="toClose">
       <template v-slot:info>
         <cForm v-if="dialog.type == '1'" :span="24" :fields="formFields" :form="form" :rules="rules" @save="onSubmit">
-          <template #status>
-            <el-radio label="0">正常</el-radio>
-            <el-radio label="1">停用</el-radio>
+          <template #is_use>
+            <el-radio v-for="(i, index) in is_useList" :key="index" :label="i.label">{{ i.label }}</el-radio>
           </template>
         </cForm>
       </template>
@@ -37,28 +36,29 @@
 </template>
 <script lang="ts" setup>
 import _ from 'lodash'
-// import search1 from './parts/search-1.vue'
 import type { FormRules } from 'element-plus'
 import type { Ref } from 'vue'
 import { ref, onMounted, getCurrentInstance, reactive } from 'vue'
 import { ElMessage } from 'element-plus'
 import { useRouter } from 'vue-router'
+import { DictDataStore } from '@common/src/stores/system/dictData' // 字典表
 import { DictTypeStore } from '@common/src/stores/system/dictType' // 字典表
 import type { IQueryResult } from '@/util/types.util'
 const dictType = DictTypeStore()
+const dictData = DictDataStore()
 const router = useRouter()
 const { proxy } = getCurrentInstance() as any
 // 列表数据
-let list: Ref<any[]> = ref([])
+let list: Ref<any> = ref([])
 // 总数
 let total: Ref<number> = ref(0)
 let skip = 0
 let limit: number = proxy.$limit
 // 列表
 let fields: Ref<any[]> = ref([
-  { label: '字典名称', model: 'dict_name', isSearch: true },
-  { label: '字典类型', model: 'dict_type', custom: true },
-  { label: '状态', model: 'status', format: (i) => (i == '0' ? '正常' : '停用') },
+  { label: '字典名称', model: 'name', isSearch: true },
+  { label: '字典类型', model: 'type', custom: true },
+  { label: '是否启用', model: 'is_use', format: (i) => (i == '0' ? '使用' : '禁用') },
   { label: '备注', model: 'remark' }
 ])
 // 操作
@@ -68,26 +68,24 @@ let opera: Ref<any[]> = ref([
 ])
 const dialog: Ref<{ type: string; show: boolean; title: string }> = ref({ type: '1', show: false, title: '信息管理' })
 let form: Ref<{}> = ref({})
-
+let is_useList: Ref<any> = ref([])
 // 表单
 let formFields: Ref<any[]> = ref([
-  { label: '字典名称', model: 'dict_name' },
-  { label: '字典类型', model: 'dict_type' },
-  { label: '状态', model: 'status', type: 'radio' },
+  { label: '字典名称', model: 'name' },
+  { label: '字典类型', model: 'type' },
+  { label: '状态', model: 'is_use', type: 'radio' },
   { label: '备注', model: 'remark', type: 'textarea' }
 ])
 const rules = reactive<FormRules>({
-  dict_type: [{ required: true, message: '请输入字典类型', trigger: 'blur' }],
-  dict_label: [{ required: true, message: '请输入字典标签', trigger: 'blur' }],
-  dict_value: [{ required: true, message: '请输入字典键值', trigger: 'blur' }],
-  dict_sort: [{ required: true, message: '请输入显示排序', trigger: 'blur' }],
-  status: [{ required: true, message: '请选择状态', trigger: 'change' }]
+  name: [{ required: true, message: '字典名称', trigger: 'blur' }],
+  type: [{ required: true, message: '字典类型', trigger: 'blur' }]
 })
 
 // 查询数据
 let searchForm: Ref<any> = ref({})
 
 onMounted(async () => {
+  await searchOther()
   await search({ skip, limit })
 })
 // 查询
@@ -97,7 +95,7 @@ const search = async (e: { skip: number; limit: number }) => {
   let info = { limit: limit, skip: skip, ...condition }
   let res: IQueryResult = await dictType.query(info)
   if (res.errcode == 0) {
-    list.value = res.data as any[]
+    list.value = res.data
     total.value = res.total
   }
 }
@@ -137,7 +135,7 @@ const toDel = async (data) => {
 }
 // 字典类型跳转
 const toType = (data) => {
-  router.push({ path: '/system/dict/detail', query: { id: data._id, dict_type: data.dict_type } })
+  router.push({ path: '/system/dict/detail', query: { id: data._id, type: data.type } })
 }
 // 弹框关闭
 const toClose = () => {
@@ -149,6 +147,10 @@ const toClose = () => {
 const getProps = (data, prop) => {
   return _.get(data, prop)
 }
+const searchOther = async () => {
+  let res: IQueryResult = await dictData.query({ type: 'common_type' })
+  if (res.errcode == 0) is_useList.value = res.data
+}
 </script>
 <style lang="scss" scoped>
 .main {

src/views/system/dict/parts/search-1.vue

@@ -1,64 +0,0 @@
-<template>
-  <div id="search-1">
-    <el-row>
-      <el-col :span="24" class="main">
-        <el-form :model="form" ref="refForm" label-width="100px">
-          <el-col :span="24" class="form">
-            <el-col :span="6">
-              <el-form-item label="字典名称" prop="dict_name">
-                <el-input v-model="form.dict_name" placeholder="请输入字典名称"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="6">
-              <el-form-item label="字典类型" prop="dict_type">
-                <el-input v-model="form.dict_type" placeholder="请输入字典类型"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="6">
-              <el-form-item label="状态" prop="status">
-                <el-select v-model="form.status" clearable filterable placeholder="请选择状态" style="width: 100%">
-                  <el-option label="正常" value="0"></el-option>
-                  <el-option label="停用" value="1"></el-option>
-                </el-select>
-              </el-form-item>
-            </el-col>
-          </el-col>
-          <el-col :span="24" class="btn">
-            <el-button type="primary" :icon="Search" @click="onSubmit()">搜索</el-button>
-            <el-button :icon="Refresh" @click="toReset()">重置</el-button>
-          </el-col>
-        </el-form>
-      </el-col>
-    </el-row>
-  </div>
-</template>
-<script setup lang="ts">
-import { Search, Refresh } from '@element-plus/icons-vue'
-import { toRefs } from 'vue'
-const props = defineProps({
-  form: { type: Object, default: () => {} }
-})
-const { form } = toRefs(props)
-const emit = defineEmits(['toReset', 'onSubmit'])
-const onSubmit = () => {
-  emit('onSubmit')
-}
-// 重置
-const toReset = () => {
-  form.value = {}
-  emit('toReset')
-}
-</script>
-
-<style lang="scss" scoped>
-.main {
-  .form {
-    display: flex;
-    flex-direction: row;
-    flex-wrap: wrap;
-  }
-  .btn {
-    text-align: right;
-  }
-}
-</style>

src/views/system/dict/parts_two/search-1.vue

@@ -1,85 +0,0 @@
-<template>
-  <div id="search-1">
-    <el-row>
-      <el-col :span="24" class="main">
-        <el-form :model="form" ref="refForm" label-width="100px">
-          <el-col :span="24" class="form">
-            <el-col :span="6">
-              <el-form-item label="字典名称" prop="dict_type">
-                <el-select v-model="form.dict_type" filterable placeholder="请选择状态" style="width: 100%" @change="changeType">
-                  <el-option v-for="(item, index) in dict_typeList" :key="index" :label="item.dict_name" :value="item.dict_type"></el-option>
-                </el-select>
-              </el-form-item>
-            </el-col>
-            <el-col :span="6">
-              <el-form-item label="字典标签" prop="dict_label">
-                <el-input v-model="form.dict_label" placeholder="请输入字典标签"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="6">
-              <el-form-item label="状态" prop="status">
-                <el-select v-model="form.status" clearable filterable placeholder="请选择状态" style="width: 100%">
-                  <el-option label="正常" value="0"></el-option>
-                  <el-option label="停用" value="1"></el-option>
-                </el-select>
-              </el-form-item>
-            </el-col>
-          </el-col>
-          <el-col :span="24" class="btn">
-            <el-button type="primary" :icon="Search" @click="onSubmit()">搜索</el-button>
-            <el-button :icon="Refresh" @click="toReset()">重置</el-button>
-          </el-col>
-        </el-form>
-      </el-col>
-    </el-row>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { Search, Refresh } from '@element-plus/icons-vue'
-import { toRefs, onMounted, ref } from 'vue'
-import type { Ref } from 'vue'
-import { DictTypeStore } from '@common/src/stores/users/sysdicttype' // 字典表
-import type { IQueryResult } from '@/util/types.util'
-const sysdicttype = DictTypeStore()
-const props = defineProps({
-  form: { type: Object, default: () => {} }
-})
-const { form } = toRefs(props)
-let dict_typeList: Ref<any[]> = ref([])
-onMounted(async () => {
-  console.log(form.value)
-
-  await searchOther()
-})
-// 查询
-const searchOther = async () => {
-  let res: IQueryResult = await sysdicttype.query()
-  if (res.errcode == 0) dict_typeList.value = res.data as any[]
-}
-const emit = defineEmits(['toReset', 'onSubmit', 'changeType'])
-const changeType = (value) => {
-  emit('changeType', value)
-}
-const onSubmit = () => {
-  emit('onSubmit')
-}
-// 重置
-const toReset = () => {
-  form.value = {}
-  emit('toReset')
-}
-</script>
-
-<style lang="scss" scoped>
-.main {
-  .form {
-    display: flex;
-    flex-direction: row;
-    flex-wrap: wrap;
-  }
-  .btn {
-    text-align: right;
-  }
-}
-</style>

vite.config.ts

@@ -1,10 +1,10 @@
-import { fileURLToPath, URL } from 'node:url';
-import { defineConfig, loadEnv } from 'vite';
-import vue from '@vitejs/plugin-vue';
-const path = require('path');
-const common = path.resolve(__dirname, '../common');
+import { fileURLToPath, URL } from 'node:url'
+import { defineConfig, loadEnv } from 'vite'
+import vue from '@vitejs/plugin-vue'
+const path = require('path')
+const common = path.resolve(__dirname, '../common')
 export default defineConfig(({ mode }) => {
-  const env = loadEnv(mode, __dirname);
+  const env = loadEnv(mode, __dirname)
   return {
     // 静态路径
     base: env.VITE_BASE_URL,
@@ -33,5 +33,5 @@ export default defineConfig(({ mode }) => {
         '@common': common
       }
     }
-  };
-});
+  }
+})