1、添加业务功能；2、更新element-plus

package.json

@@ -21,7 +21,7 @@
     "@vueuse/core": "10.11.0",
     "axios": "0.28.1",
     "echarts": "5.5.1",
-    "element-plus": "2.7.6",
+    "element-plus": "^2.9.0",
     "file-saver": "2.0.5",
     "fuse.js": "6.6.2",
     "js-cookie": "3.0.5",

pnpm-lock.yaml

@@ -24,8 +24,8 @@ importers:
         specifier: 5.5.1
         version: 5.5.1
       element-plus:
-        specifier: 2.7.6
-        version: 2.7.6(vue@3.4.31)
+        specifier: ^2.9.0
+        version: 2.9.0(vue@3.4.31)
       file-saver:
         specifier: 2.0.5
         version: 2.0.5
@@ -1042,8 +1042,8 @@ packages:
   echarts@5.5.1:
     resolution: {integrity: sha512-Fce8upazaAXUVUVsjgV6mBnGuqgO+JNDlcgF79Dksy4+wgGpQB2lmYoO4TSweFg/mZITdpGHomw/cNBJZj1icA==}
 
-  element-plus@2.7.6:
-    resolution: {integrity: sha512-36sw1K23hYjgeooR10U6CiCaCp2wvOqwoFurADZVlekeQ9v5U1FhJCFGEXO6i/kZBBMwsE1c9fxjLs9LENw2Rg==}
+  element-plus@2.9.0:
+    resolution: {integrity: sha512-ccOFXKsauo2dtokAr4OX7gZsb7TuAoVxA2zGRZo5o2yyDDBLBaZxOoFQPoxITSLcHbBfQuNDGK5Iag5hnyKkZA==}
     peerDependencies:
       vue: ^3.2.0
 
@@ -3148,7 +3148,7 @@ snapshots:
       tslib: 2.3.0
       zrender: 5.6.0
 
-  element-plus@2.7.6(vue@3.4.31):
+  element-plus@2.9.0(vue@3.4.31):
     dependencies:
       '@ctrl/tinycolor': 3.6.1
       '@element-plus/icons-vue': 2.3.1(vue@3.4.31)

src/api/customer/info.js

@@ -0,0 +1,44 @@
+import request from "@/utils/request";
+
+// 查询客户信息列表
+export function listCustomer(query) {
+  return request({
+    url: "/business/customer/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询客户信息详细
+export function getCustomer(id) {
+  return request({
+    url: "/business/customer/" + id,
+    method: "get",
+  });
+}
+
+// 新增客户信息
+export function addCustomer(data) {
+  return request({
+    url: "/business/customer",
+    method: "post",
+    data: data,
+  });
+}
+
+// 修改客户信息
+export function updateCustomer(data) {
+  return request({
+    url: "/business/customer",
+    method: "put",
+    data: data,
+  });
+}
+
+// 删除客户信息
+export function delCustomer(id) {
+  return request({
+    url: "/business/customer/" + id,
+    method: "delete",
+  });
+}

src/api/customer/member.js

@@ -0,0 +1,44 @@
+import request from "@/utils/request";
+
+// 查询客户人员信息列表
+export function listCustomerStaff(query) {
+  return request({
+    url: "/business/customerStaff/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询客户人员信息详细
+export function getCustomerStaff(id) {
+  return request({
+    url: "/business/customerStaff/" + id,
+    method: "get",
+  });
+}
+
+// 新增客户人员信息
+export function addCustomerStaff(data) {
+  return request({
+    url: "/business/customerStaff",
+    method: "post",
+    data: data,
+  });
+}
+
+// 修改客户人员信息
+export function updateCustomerStaff(data) {
+  return request({
+    url: "/business/customerStaff",
+    method: "put",
+    data: data,
+  });
+}
+
+// 删除客户人员信息
+export function delCustomerStaff(id) {
+  return request({
+    url: "/business/customerStaff/" + id,
+    method: "delete",
+  });
+}

src/api/product/category.js

@@ -3,7 +3,7 @@ import request from "@/utils/request";
 // 查询分类列表
 export function listCategory(query) {
   return request({
-    url: "/system/category/list",
+    url: "/business/category/list",
     method: "get",
     params: query,
   });
@@ -12,7 +12,7 @@ export function listCategory(query) {
 // 查询分类详细
 export function getCategory(id) {
   return request({
-    url: "/system/category/" + id,
+    url: "/business/category/" + id,
     method: "get",
   });
 }
@@ -20,7 +20,7 @@ export function getCategory(id) {
 // 新增分类
 export function addCategory(data) {
   return request({
-    url: "/system/category",
+    url: "/business/category",
     method: "post",
     data: data,
   });
@@ -29,7 +29,7 @@ export function addCategory(data) {
 // 修改分类
 export function updateCategory(data) {
   return request({
-    url: "/system/category",
+    url: "/business/category",
     method: "put",
     data: data,
   });
@@ -38,7 +38,7 @@ export function updateCategory(data) {
 // 删除分类
 export function delCategory(id) {
   return request({
-    url: "/system/category/" + id,
+    url: "/business/category/" + id,
     method: "delete",
   });
 }

src/api/product/productsCategory.js

@@ -0,0 +1,44 @@
+import request from "@/utils/request";
+
+// 查询产品品类列表
+export function listProductsCategory(query) {
+  return request({
+    url: "/business/productsCategory/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询产品品类详细
+export function getProductsCategory(id) {
+  return request({
+    url: "/business/productsCategory/" + id,
+    method: "get",
+  });
+}
+
+// 新增产品品类
+export function addProductsCategory(data) {
+  return request({
+    url: "/business/productsCategory",
+    method: "post",
+    data: data,
+  });
+}
+
+// 修改产品品类
+export function updateProductsCategory(data) {
+  return request({
+    url: "/business/productsCategory",
+    method: "put",
+    data: data,
+  });
+}
+
+// 删除产品品类
+export function delProductsCategory(id) {
+  return request({
+    url: "/business/productsCategory/" + id,
+    method: "delete",
+  });
+}

src/api/product/productsRecord.js

@@ -0,0 +1,44 @@
+import request from "@/utils/request";
+
+// 查询产品归档列表
+export function listProductsRecord(query) {
+  return request({
+    url: "/business/products/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询产品归档详细
+export function getProductsRecord(id) {
+  return request({
+    url: "/business/products/" + id,
+    method: "get",
+  });
+}
+
+// 新增产品归档
+export function addProductsRecord(data) {
+  return request({
+    url: "/business/products",
+    method: "post",
+    data: data,
+  });
+}
+
+// 修改产品归档
+export function updateProductsRecord(data) {
+  return request({
+    url: "/business/products",
+    method: "put",
+    data: data,
+  });
+}
+
+// 删除产品归档
+export function delProductsRecord(id) {
+  return request({
+    url: "/business/products/" + id,
+    method: "delete",
+  });
+}

src/api/product/productsType.js

@@ -0,0 +1,44 @@
+import request from "@/utils/request";
+
+// 查询产品类型列表
+export function listProductsType(query) {
+  return request({
+    url: "/business/productsType/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询产品类型详细
+export function getProductsType(id) {
+  return request({
+    url: "/business/productsType/" + id,
+    method: "get",
+  });
+}
+
+// 新增产品类型
+export function addProductsType(data) {
+  return request({
+    url: "/business/productsType",
+    method: "post",
+    data: data,
+  });
+}
+
+// 修改产品类型
+export function updateProductsType(data) {
+  return request({
+    url: "/business/productsType",
+    method: "put",
+    data: data,
+  });
+}
+
+// 删除产品类型
+export function delProductsType(id) {
+  return request({
+    url: "/business/productsType/" + id,
+    method: "delete",
+  });
+}

src/api/supplier/record.js

@@ -0,0 +1,44 @@
+import request from "@/utils/request";
+
+// 查询供应商档案信息列表
+export function listSupplierRecord(query) {
+  return request({
+    url: "/business/supplier/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询供应商档案信息详细
+export function getSupplierRecord(id) {
+  return request({
+    url: "/business/supplier/" + id,
+    method: "get",
+  });
+}
+
+// 新增供应商档案信息
+export function addSupplierRecord(data) {
+  return request({
+    url: "/business/supplier",
+    method: "post",
+    data: data,
+  });
+}
+
+// 修改供应商档案信息
+export function updateSupplierRecord(data) {
+  return request({
+    url: "/business/supplier",
+    method: "put",
+    data: data,
+  });
+}
+
+// 删除供应商档案信息
+export function delSupplierRecord(id) {
+  return request({
+    url: "/business/supplier/" + id,
+    method: "delete",
+  });
+}

src/hooks/useForm.js

@@ -8,14 +8,16 @@
  *
  * Copyright (c) 2023 by ${git_name_email}, All Rights Reserved.
  */
-import { reactive } from "vue";
+import { reactive, ref } from "vue";
+// import { objectMerge } from "@/utils";
 
 function useForm(formRef, defaultForm) {
-  const form = reactive({ ...defaultForm });
+  // const form = reactive({ ...defaultForm });
+  const form = ref({ ...defaultForm });
 
   // 校验表单
   function validateForm() {
-    formRef.validate((status, fields) => {
+    return formRef.value.validate((status, fields) => {
       return status ? Promise.resolve(status) : Promise.reject(fields);
     });
   }
@@ -23,8 +25,9 @@ function useForm(formRef, defaultForm) {
   // 重置表单
   function resetForm(customForm) {
     const rForm = customForm || defaultForm;
-    form.value = { ...rForm };
-    formRef.resetFields();
+    form.value = rForm;
+    // objectMerge(form, rForm);
+    formRef.value && formRef.value.resetFields();
   }
 
   return { form, validateForm, resetForm };

src/hooks/useRemote.js

@@ -0,0 +1,17 @@
+import { reactive, ref } from "vue";
+
+function useRemote() {
+  const loading = ref(false);
+
+  async function remoteMethod(query, callback) {
+    if (!query) return;
+
+    loading.value = true;
+    await callback(query);
+    loading.value = false;
+  }
+
+  return { loading, remoteMethod };
+}
+
+export default useRemote;

src/main.js

@@ -35,6 +35,7 @@ import {
   selectDictLabel,
   selectDictLabels,
 } from "@/utils/ruoyi";
+import * as $utils from "./utils";
 
 // 分页组件
 import Pagination from "@/components/Pagination";
@@ -62,6 +63,7 @@ app.config.globalProperties.handleTree = handleTree;
 app.config.globalProperties.addDateRange = addDateRange;
 app.config.globalProperties.selectDictLabel = selectDictLabel;
 app.config.globalProperties.selectDictLabels = selectDictLabels;
+app.config.globalProperties.$utils = $utils;
 
 // 全局组件挂载
 app.component("DictTag", DictTag);

src/utils/index.js

@@ -1,18 +1,25 @@
-import { parseTime } from './ruoyi'
+import { parseTime } from "./ruoyi";
 
 /**
  * 表格时间格式化
  */
 export function formatDate(cellValue) {
   if (cellValue == null || cellValue == "") return "";
-  var date = new Date(cellValue) 
-  var year = date.getFullYear()
-  var month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1
-  var day = date.getDate() < 10 ? '0' + date.getDate() : date.getDate() 
-  var hours = date.getHours() < 10 ? '0' + date.getHours() : date.getHours() 
-  var minutes = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes() 
-  var seconds = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds()
-  return year + '-' + month + '-' + day + ' ' + hours + ':' + minutes + ':' + seconds
+  var date = new Date(cellValue);
+  var year = date.getFullYear();
+  var month =
+    date.getMonth() + 1 < 10
+      ? "0" + (date.getMonth() + 1)
+      : date.getMonth() + 1;
+  var day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
+  var hours = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
+  var minutes =
+    date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
+  var seconds =
+    date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
+  return (
+    year + "-" + month + "-" + day + " " + hours + ":" + minutes + ":" + seconds
+  );
 }
 
 /**
@@ -21,40 +28,40 @@ export function formatDate(cellValue) {
  * @returns {string}
  */
 export function formatTime(time, option) {
-  if (('' + time).length === 10) {
-    time = parseInt(time) * 1000
+  if (("" + time).length === 10) {
+    time = parseInt(time) * 1000;
   } else {
-    time = +time
+    time = +time;
   }
-  const d = new Date(time)
-  const now = Date.now()
+  const d = new Date(time);
+  const now = Date.now();
 
-  const diff = (now - d) / 1000
+  const diff = (now - d) / 1000;
 
   if (diff < 30) {
-    return '刚刚'
+    return "刚刚";
   } else if (diff < 3600) {
     // less 1 hour
-    return Math.ceil(diff / 60) + '分钟前'
+    return Math.ceil(diff / 60) + "分钟前";
   } else if (diff < 3600 * 24) {
-    return Math.ceil(diff / 3600) + '小时前'
+    return Math.ceil(diff / 3600) + "小时前";
   } else if (diff < 3600 * 24 * 2) {
-    return '1天前'
+    return "1天前";
   }
   if (option) {
-    return parseTime(time, option)
+    return parseTime(time, option);
   } else {
     return (
       d.getMonth() +
       1 +
-      '月' +
+      "月" +
       d.getDate() +
-      '日' +
+      "日" +
       d.getHours() +
-      '时' +
+      "时" +
       d.getMinutes() +
-      '分'
-    )
+      "分"
+    );
   }
 }
 
@@ -63,18 +70,18 @@ export function formatTime(time, option) {
  * @returns {Object}
  */
 export function getQueryObject(url) {
-  url = url == null ? window.location.href : url
-  const search = url.substring(url.lastIndexOf('?') + 1)
-  const obj = {}
-  const reg = /([^?&=]+)=([^?&=]*)/g
+  url = url == null ? window.location.href : url;
+  const search = url.substring(url.lastIndexOf("?") + 1);
+  const obj = {};
+  const reg = /([^?&=]+)=([^?&=]*)/g;
   search.replace(reg, (rs, $1, $2) => {
-    const name = decodeURIComponent($1)
-    let val = decodeURIComponent($2)
-    val = String(val)
-    obj[name] = val
-    return rs
-  })
-  return obj
+    const name = decodeURIComponent($1);
+    let val = decodeURIComponent($2);
+    val = String(val);
+    obj[name] = val;
+    return rs;
+  });
+  return obj;
 }
 
 /**
@@ -83,14 +90,14 @@ export function getQueryObject(url) {
  */
 export function byteLength(str) {
   // returns the byte length of an utf8 string
-  let s = str.length
+  let s = str.length;
   for (var i = str.length - 1; i >= 0; i--) {
-    const code = str.charCodeAt(i)
-    if (code > 0x7f && code <= 0x7ff) s++
-    else if (code > 0x7ff && code <= 0xffff) s += 2
-    if (code >= 0xDC00 && code <= 0xDFFF) i--
+    const code = str.charCodeAt(i);
+    if (code > 0x7f && code <= 0x7ff) s++;
+    else if (code > 0x7ff && code <= 0xffff) s += 2;
+    if (code >= 0xdc00 && code <= 0xdfff) i--;
   }
-  return s
+  return s;
 }
 
 /**
@@ -98,13 +105,13 @@ export function byteLength(str) {
  * @returns {Array}
  */
 export function cleanArray(actual) {
-  const newArray = []
+  const newArray = [];
   for (let i = 0; i < actual.length; i++) {
     if (actual[i]) {
-      newArray.push(actual[i])
+      newArray.push(actual[i]);
     }
   }
-  return newArray
+  return newArray;
 }
 
 /**
@@ -112,13 +119,13 @@ export function cleanArray(actual) {
  * @returns {Array}
  */
 export function param(json) {
-  if (!json) return ''
+  if (!json) return "";
   return cleanArray(
-    Object.keys(json).map(key => {
-      if (json[key] === undefined) return ''
-      return encodeURIComponent(key) + '=' + encodeURIComponent(json[key])
+    Object.keys(json).map((key) => {
+      if (json[key] === undefined) return "";
+      return encodeURIComponent(key) + "=" + encodeURIComponent(json[key]);
     })
-  ).join('&')
+  ).join("&");
 }
 
 /**
@@ -126,21 +133,21 @@ export function param(json) {
  * @returns {Object}
  */
 export function param2Obj(url) {
-  const search = decodeURIComponent(url.split('?')[1]).replace(/\+/g, ' ')
+  const search = decodeURIComponent(url.split("?")[1]).replace(/\+/g, " ");
   if (!search) {
-    return {}
+    return {};
   }
-  const obj = {}
-  const searchArr = search.split('&')
-  searchArr.forEach(v => {
-    const index = v.indexOf('=')
+  const obj = {};
+  const searchArr = search.split("&");
+  searchArr.forEach((v) => {
+    const index = v.indexOf("=");
     if (index !== -1) {
-      const name = v.substring(0, index)
-      const val = v.substring(index + 1, v.length)
-      obj[name] = val
+      const name = v.substring(0, index);
+      const val = v.substring(index + 1, v.length);
+      obj[name] = val;
     }
-  })
-  return obj
+  });
+  return obj;
 }
 
 /**
@@ -148,9 +155,9 @@ export function param2Obj(url) {
  * @returns {string}
  */
 export function html2Text(val) {
-  const div = document.createElement('div')
-  div.innerHTML = val
-  return div.textContent || div.innerText
+  const div = document.createElement("div");
+  div.innerHTML = val;
+  return div.textContent || div.innerText;
 }
 
 /**
@@ -160,21 +167,21 @@ export function html2Text(val) {
  * @returns {Object}
  */
 export function objectMerge(target, source) {
-  if (typeof target !== 'object') {
-    target = {}
+  if (typeof target !== "object") {
+    target = {};
   }
   if (Array.isArray(source)) {
-    return source.slice()
+    return source.slice();
   }
-  Object.keys(source).forEach(property => {
-    const sourceProperty = source[property]
-    if (typeof sourceProperty === 'object') {
-      target[property] = objectMerge(target[property], sourceProperty)
+  Object.keys(source).forEach((property) => {
+    const sourceProperty = source[property];
+    if (typeof sourceProperty === "object" && sourceProperty !== null) {
+      target[property] = objectMerge(target[property], sourceProperty);
     } else {
-      target[property] = sourceProperty
+      target[property] = sourceProperty;
     }
-  })
-  return target
+  });
+  return target;
 }
 
 /**
@@ -183,18 +190,18 @@ export function objectMerge(target, source) {
  */
 export function toggleClass(element, className) {
   if (!element || !className) {
-    return
+    return;
   }
-  let classString = element.className
-  const nameIndex = classString.indexOf(className)
+  let classString = element.className;
+  const nameIndex = classString.indexOf(className);
   if (nameIndex === -1) {
-    classString += '' + className
+    classString += "" + className;
   } else {
     classString =
       classString.substr(0, nameIndex) +
-      classString.substr(nameIndex + className.length)
+      classString.substr(nameIndex + className.length);
   }
-  element.className = classString
+  element.className = classString;
 }
 
 /**
@@ -202,10 +209,10 @@ export function toggleClass(element, className) {
  * @returns {Date}
  */
 export function getTime(type) {
-  if (type === 'start') {
-    return new Date().getTime() - 3600 * 1000 * 24 * 90
+  if (type === "start") {
+    return new Date().getTime() - 3600 * 1000 * 24 * 90;
   } else {
-    return new Date(new Date().toDateString())
+    return new Date(new Date().toDateString());
   }
 }
 
@@ -216,38 +223,38 @@ export function getTime(type) {
  * @return {*}
  */
 export function debounce(func, wait, immediate) {
-  let timeout, args, context, timestamp, result
+  let timeout, args, context, timestamp, result;
 
-  const later = function() {
+  const later = function () {
     // 据上一次触发时间间隔
-    const last = +new Date() - timestamp
+    const last = +new Date() - timestamp;
 
     // 上次被包装函数被调用时间间隔 last 小于设定时间间隔 wait
     if (last < wait && last > 0) {
-      timeout = setTimeout(later, wait - last)
+      timeout = setTimeout(later, wait - last);
     } else {
-      timeout = null
+      timeout = null;
       // 如果设定为immediate===true，因为开始边界已经调用过了此处无需调用
       if (!immediate) {
-        result = func.apply(context, args)
-        if (!timeout) context = args = null
+        result = func.apply(context, args);
+        if (!timeout) context = args = null;
       }
     }
-  }
+  };
 
-  return function(...args) {
-    context = this
-    timestamp = +new Date()
-    const callNow = immediate && !timeout
+  return function (...args) {
+    context = this;
+    timestamp = +new Date();
+    const callNow = immediate && !timeout;
     // 如果延时不存在，重新设定延时
-    if (!timeout) timeout = setTimeout(later, wait)
+    if (!timeout) timeout = setTimeout(later, wait);
     if (callNow) {
-      result = func.apply(context, args)
-      context = args = null
+      result = func.apply(context, args);
+      context = args = null;
     }
 
-    return result
-  }
+    return result;
+  };
 }
 
 /**
@@ -258,18 +265,18 @@ export function debounce(func, wait, immediate) {
  * @returns {Object}
  */
 export function deepClone(source) {
-  if (!source && typeof source !== 'object') {
-    throw new Error('error arguments', 'deepClone')
+  if (!source && typeof source !== "object") {
+    throw new Error("error arguments", "deepClone");
   }
-  const targetObj = source.constructor === Array ? [] : {}
-  Object.keys(source).forEach(keys => {
-    if (source[keys] && typeof source[keys] === 'object') {
-      targetObj[keys] = deepClone(source[keys])
+  const targetObj = source.constructor === Array ? [] : {};
+  Object.keys(source).forEach((keys) => {
+    if (source[keys] && typeof source[keys] === "object") {
+      targetObj[keys] = deepClone(source[keys]);
     } else {
-      targetObj[keys] = source[keys]
+      targetObj[keys] = source[keys];
     }
-  })
-  return targetObj
+  });
+  return targetObj;
 }
 
 /**
@@ -277,16 +284,16 @@ export function deepClone(source) {
  * @returns {Array}
  */
 export function uniqueArr(arr) {
-  return Array.from(new Set(arr))
+  return Array.from(new Set(arr));
 }
 
 /**
  * @returns {string}
  */
 export function createUniqueString() {
-  const timestamp = +new Date() + ''
-  const randomNum = parseInt((1 + Math.random()) * 65536) + ''
-  return (+(randomNum + timestamp)).toString(32)
+  const timestamp = +new Date() + "";
+  const randomNum = parseInt((1 + Math.random()) * 65536) + "";
+  return (+(randomNum + timestamp)).toString(32);
 }
 
 /**
@@ -296,7 +303,7 @@ export function createUniqueString() {
  * @returns {boolean}
  */
 export function hasClass(ele, cls) {
-  return !!ele.className.match(new RegExp('(\\s|^)' + cls + '(\\s|$)'))
+  return !!ele.className.match(new RegExp("(\\s|^)" + cls + "(\\s|$)"));
 }
 
 /**
@@ -305,7 +312,7 @@ export function hasClass(ele, cls) {
  * @param {string} cls
  */
 export function addClass(ele, cls) {
-  if (!hasClass(ele, cls)) ele.className += ' ' + cls
+  if (!hasClass(ele, cls)) ele.className += " " + cls;
 }
 
 /**
@@ -315,76 +322,73 @@ export function addClass(ele, cls) {
  */
 export function removeClass(ele, cls) {
   if (hasClass(ele, cls)) {
-    const reg = new RegExp('(\\s|^)' + cls + '(\\s|$)')
-    ele.className = ele.className.replace(reg, ' ')
+    const reg = new RegExp("(\\s|^)" + cls + "(\\s|$)");
+    ele.className = ele.className.replace(reg, " ");
   }
 }
 
 export function makeMap(str, expectsLowerCase) {
-  const map = Object.create(null)
-  const list = str.split(',')
+  const map = Object.create(null);
+  const list = str.split(",");
   for (let i = 0; i < list.length; i++) {
-    map[list[i]] = true
+    map[list[i]] = true;
   }
-  return expectsLowerCase
-    ? val => map[val.toLowerCase()]
-    : val => map[val]
+  return expectsLowerCase ? (val) => map[val.toLowerCase()] : (val) => map[val];
 }
 
-export const exportDefault = 'export default '
+export const exportDefault = "export default ";
 
 export const beautifierConf = {
   html: {
-    indent_size: '2',
-    indent_char: ' ',
-    max_preserve_newlines: '-1',
+    indent_size: "2",
+    indent_char: " ",
+    max_preserve_newlines: "-1",
     preserve_newlines: false,
     keep_array_indentation: false,
     break_chained_methods: false,
-    indent_scripts: 'separate',
-    brace_style: 'end-expand',
+    indent_scripts: "separate",
+    brace_style: "end-expand",
     space_before_conditional: true,
     unescape_strings: false,
     jslint_happy: false,
     end_with_newline: true,
-    wrap_line_length: '110',
+    wrap_line_length: "110",
     indent_inner_html: true,
     comma_first: false,
     e4x: true,
-    indent_empty_lines: true
+    indent_empty_lines: true,
   },
   js: {
-    indent_size: '2',
-    indent_char: ' ',
-    max_preserve_newlines: '-1',
+    indent_size: "2",
+    indent_char: " ",
+    max_preserve_newlines: "-1",
     preserve_newlines: false,
     keep_array_indentation: false,
     break_chained_methods: false,
-    indent_scripts: 'normal',
-    brace_style: 'end-expand',
+    indent_scripts: "normal",
+    brace_style: "end-expand",
     space_before_conditional: true,
     unescape_strings: false,
     jslint_happy: true,
     end_with_newline: true,
-    wrap_line_length: '110',
+    wrap_line_length: "110",
     indent_inner_html: true,
     comma_first: false,
     e4x: true,
-    indent_empty_lines: true
-  }
-}
+    indent_empty_lines: true,
+  },
+};
 
 // 首字母大小
 export function titleCase(str) {
-  return str.replace(/( |^)[a-z]/g, L => L.toUpperCase())
+  return str.replace(/( |^)[a-z]/g, (L) => L.toUpperCase());
 }
 
 // 下划转驼峰
 export function camelCase(str) {
-  return str.replace(/_[a-z]/g, str1 => str1.substr(-1).toUpperCase())
+  return str.replace(/_[a-z]/g, (str1) => str1.substr(-1).toUpperCase());
 }
 
 export function isNumberStr(str) {
-  return /^[+-]?(0|([1-9]\d*))(\.\d+)?$/g.test(str)
+  return /^[+-]?(0|([1-9]\d*))(\.\d+)?$/g.test(str);
 }
- 

src/views/customer/info/index.vue

@@ -0,0 +1,307 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="客户名称" prop="name">
+        <el-input
+          v-model="queryParams.name"
+          placeholder="请输入客户名称"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="所属类别">
+        <el-select v-model="queryParams.type" placeholder="请选择" style="width: 200px;">
+          <el-option
+            v-for="item in customer_type"
+            :key="item.value"
+            :label="item.label"
+            :value="item.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>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="plus"
+          @click="handleAdd"
+          v-hasPermi="['business:customer:add']"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="edit"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['business:customer:edit']"
+        >修改</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="delete"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['business:customer:remove']"
+        >删除</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="download"
+          @click="handleExport"
+          v-hasPermi="['business:customer:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="customerList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="客户编码" align="center" prop="code" />
+      <el-table-column label="客户名称" align="center" prop="name" />
+      <el-table-column label="所属类别" align="center" prop="type" />
+      <el-table-column label="业务状态" align="center" prop="businessStatus" />
+      <el-table-column label="联系人姓名" align="center" prop="contactsName" />
+      <el-table-column label="联系人电话" align="center" prop="contactsPhone" />
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+        <template #default="scope">
+          <el-button
+            link
+            size="mini"
+            icon="edit"
+            type="primary"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['business:customer:edit']"
+          >修改</el-button>
+          <el-button
+            link
+            size="mini"
+            icon="delete"
+            type="danger"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['business:customer:remove']"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改客户信息对话框 -->
+    <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+      <el-form ref="formRef" :model="form" :rules="rules" label-width="90px">
+        <el-form-item label="客户编码" prop="code">
+          <el-input v-model="form.code" placeholder="请输入客户编码" />
+        </el-form-item>
+        <el-form-item label="客户名称" prop="code">
+          <el-input v-model="form.name" placeholder="请输入客户名称" />
+        </el-form-item>
+        <el-form-item label="所属类别" prop="code">
+          <el-select v-model="form.type" placeholder="请选择所属类别">
+            <el-option
+              v-for="item in customer_type"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="业务状态" prop="businessStatus">
+          <el-select v-model="form.businessStatus" placeholder="请选择业务状态">
+            <el-option
+              v-for="item in customer_business_status"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="联系人姓名" prop="contactsName">
+          <el-input v-model="form.contactsName" placeholder="请输入联系人姓名" />
+        </el-form-item>
+        <el-form-item label="联系人电话" prop="contactsPhone">
+          <el-input v-model="form.contactsPhone" placeholder="请输入联系人电话" />
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import { listCustomer, getCustomer, delCustomer, addCustomer, updateCustomer } from "@/api/customer/info";
+import useForm from '@/hooks/useForm.js';
+
+const defaultForm = {
+  id: null,
+  code: null,
+  name: null,
+  contactsName: null,
+  contactsPhone: null,
+  type: null,
+  businessStatus: null,
+}
+
+const defaultParams = {
+  pageNum: 1,
+  pageSize: 10,
+  contactsName: null,
+  type: null
+}
+
+const formRef = ref(null);
+const queryRef = ref(null);
+
+const { proxy } = getCurrentInstance()
+
+const data = reactive({
+  // 遮罩层
+  loading: true,
+  // 选中数组
+  ids: [],
+  // 非单个禁用
+  single: true,
+  // 非多个禁用
+  multiple: true,
+  // 显示搜索条件
+  showSearch: true,
+  // 总条数
+  total: 0,
+  // 分类表格数据
+  customerList: [],
+  // 弹出层标题
+  title: "",
+  // 是否显示弹出层
+  open: false,
+  // 表单校验
+  rules: {
+  }
+})
+
+const { loading, ids, single, multiple, showSearch, total, customerList, title, open, rules, typeOptions } = toRefs(data);
+
+const { form, validateForm, resetForm } = useForm(formRef, defaultForm)
+const { form: queryParams, resetForm: resetQueryForm } = useForm(queryRef, defaultParams)
+
+
+const { customer_business_status, customer_type } = proxy.useDict('customer_business_status', 'customer_type');
+getList();
+
+function getList() {
+  loading.value = true;
+  listCustomer(queryParams.value).then(response => {
+    customerList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  resetForm();
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  resetQueryForm();
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids = selection.map(item => item.id)
+  single = selection.length!==1
+  multiple.value = !selection.length
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加客户信息";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const id = row.id || ids.value
+  getCustomer(id).then(response => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改客户信息";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  validateForm.then(() => {
+    if (form.value.id != null) {
+      updateCustomer(form.value).then(response => {
+        proxy.$modal.msgSuccess("修改成功");
+        open.value = false;
+        getList();
+      });
+    } else {
+      addCustomer(form.value).then(response => {
+        proxy.$modal.msgSuccess("新增成功");
+        open.value = false;
+        getList();
+      });
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const ids = row.id || ids.value;
+  proxy.$modal.confirm('是否确认删除分类编号为"' + ids + '"的数据项？').then(function() {
+    return delCustomer(ids);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+  }).catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download('business/customer/export', {
+    ...queryParams.value
+  }, `customer_${new Date().getTime()}.xlsx`)
+}
+</script>
+
+<style lang="scss" scoped>
+</style>

src/views/customer/member/index.vue

@@ -0,0 +1,311 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="所属客户" prop="customerId">
+        <el-input
+          v-model="queryParams.customerId"
+          placeholder="请输入所属客户"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </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="['business:customer-staff:add']"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="edit"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['business:customer-staff:edit']"
+        >修改</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="delete"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['business:customer-staff:remove']"
+        >删除</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="download"
+          @click="handleExport"
+          v-hasPermi="['business:customer-staff:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="memberList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="所属客户" align="center" prop="customerId" />
+      <el-table-column label="员工姓名" align="center" prop="name" />
+      <el-table-column label="性别" align="center" prop="sex" />
+      <el-table-column label="员工职位" align="center" prop="post" />
+      <el-table-column label="员工电话" align="center" prop="phone" />
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+        <template slot-scope="scope">
+          <el-button
+            link
+            type="primary"
+            icon="edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['business:customer-staff:edit']"
+          >修改</el-button>
+          <el-button
+            link
+            type="danger"
+            icon="delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['business:customer-staff:remove']"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改客户人员信息对话框 -->
+    <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+      <el-form ref="formRef" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="所属客户" prop="customerId">
+          <el-select
+            v-model="form.customerId"
+            filterable
+            remote
+            placeholder="请输入关键词搜索"
+            remote-show-suffix
+            :remote-method="($event) => remoteMethod($event, remoteCustomer)"
+            :loading="remoteLoading"
+          >
+            <el-option
+              v-for="item in customerList"
+              :key="item.id"
+              :label="item.contactsName"
+              :value="item.id"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="员工姓名" prop="name">
+          <el-input v-model="form.name" placeholder="请输入员工姓名" />
+        </el-form-item>
+        <el-form-item label="员工性别" prop="sex">
+          <el-select v-model="form.type" placeholder="请选择性别">
+            <el-option
+              v-for="item in customer_sex"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="员工职位" prop="post">
+          <el-input v-model="form.name" placeholder="请输入员工职位" />
+        </el-form-item>
+        <el-form-item label="员工电话" prop="phone">
+          <el-input v-model="form.phone" placeholder="请输入员工电话" />
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import { listCustomerStaff, getCustomerStaff, delCustomerStaff, addCustomerStaff, updateCustomerStaff } from "@/api/customer/member";
+import { listCustomer } from "@/api/customer/info";
+import useForm from '@/hooks/useForm.js';
+import useRemote from '@/hooks/useRemote.js';
+
+const defaultForm = {
+  id: null,
+  code: null,
+  name: null,
+  contactsName: null,
+  contactsPhone: null,
+  type: null,
+  businessStatus: null,
+}
+
+const defaultParams = {
+  pageNum: 1,
+  pageSize: 10,
+  contactsName: null,
+  type: null
+}
+
+const formRef = ref(null);
+const queryRef = ref(null);
+
+const { proxy } = getCurrentInstance()
+
+const data = reactive({
+  // 遮罩层
+  loading: true,
+  // 选中数组
+  ids: [],
+  // 非单个禁用
+  single: true,
+  // 非多个禁用
+  multiple: true,
+  // 显示搜索条件
+  showSearch: true,
+  // 总条数
+  total: 0,
+  // 分类表格数据
+  memberList: [],
+  customerList: [],
+  // 弹出层标题
+  title: "",
+  // 是否显示弹出层
+  open: false,
+  // 表单校验
+  rules: {
+  }
+})
+
+const { loading, ids, single, multiple, showSearch, total, memberList, title, open, rules, customerList } = toRefs(data);
+
+const { form, validateForm, resetForm } = useForm(formRef, defaultForm)
+const { form: queryParams, resetForm: resetQueryForm } = useForm(queryRef, defaultParams)
+
+const { customer_sex } = proxy.useDict('customer_sex')
+getList();
+
+const { loading: remoteLoading, remoteMethod } = useRemote();
+
+function getList() {
+  loading.value = true;
+  listCustomerStaff(queryParams.value).then(response => {
+    memberList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+function remoteCustomer (query) {
+  const params = {
+    pageNum: 1,
+    pageSize: 20,
+    contactsName: query
+  }
+  return listCustomer(params).then(resp => {
+    return customerList.value = resp.rows;
+  })
+}
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  resetForm();
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  resetQueryForm();
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids = selection.map(item => item.id)
+  single = selection.length!==1
+  multiple.value = !selection.length
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加人员信息";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const id = row.id || ids.value
+  getCustomerStaff(id).then(response => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改人员信息";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  validateForm.then(() => {
+    if (form.value.id != null) {
+      updateCustomerStaff(form.value).then(response => {
+        proxy.$modal.msgSuccess("修改成功");
+        open.value = false;
+        getList();
+      });
+    } else {
+      addCustomerStaff(form.value).then(response => {
+        proxy.$modal.msgSuccess("新增成功");
+        open.value = false;
+        getList();
+      });
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const ids = row.id || ids.value;
+  proxy.$modal.confirm('是否确认删除分类编号为"' + ids + '"的数据项？').then(function() {
+    return delCustomerStaff(ids);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+  }).catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download('business/customer-staff/export', {
+    ...queryParams.value
+  }, `customer_${new Date().getTime()}.xlsx`)
+}
+</script>

src/views/product/category/index.vue

@@ -1,120 +1,125 @@
 <template>
   <div class="app-container">
-    <el-form :model="queryParams" ref="queryRef" size="small" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item label="分类名称" prop="name">
-        <el-input
-          v-model="queryParams.name"
-          placeholder="请输入分类名称"
-          clearable
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
-        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
-      </el-form-item>
-    </el-form>
+    <splitpanes :horizontal="appStore.device === 'mobile'" class="default-theme">
+      <pane size="8">
+        <el-segmented :options="categoryOptions" size="large" v-model="queryParams.pid" direction="vertical"/>
+      </pane>
+      <pane size="92">
+        <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
+          <el-form-item label="分类名称" prop="name">
+            <el-input
+              v-model="queryParams.name"
+              placeholder="请输入分类名称"
+              clearable
+              @keyup.enter.native="handleQuery"
+            />
+          </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="el-icon-plus"
-          size="mini"
-          @click="handleAdd"
-          v-hasPermi="['system:category:add']"
-        >新增</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="success"
-          plain
-          icon="el-icon-edit"
-          size="mini"
-          :disabled="single"
-          @click="handleUpdate"
-          v-hasPermi="['system:category:edit']"
-        >修改</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="danger"
-          plain
-          icon="el-icon-delete"
-          size="mini"
-          :disabled="multiple"
-          @click="handleDelete"
-          v-hasPermi="['system:category:remove']"
-        >删除</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="warning"
-          plain
-          icon="el-icon-download"
-          size="mini"
-          @click="handleExport"
-          v-hasPermi="['system:category:export']"
-        >导出</el-button>
-      </el-col>
-      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
-    </el-row>
+        <el-row :gutter="10" class="mb8">
+          <el-col :span="1.5">
+            <el-button
+              type="primary"
+              plain
+              icon="plus"
+              @click="handleAdd"
+              v-hasPermi="['business:category:add']"
+            >新增</el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button
+              type="success"
+              plain
+              icon="edit"
+              :disabled="single"
+              @click="handleUpdate"
+              v-hasPermi="['business:category:edit']"
+            >修改</el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button
+              type="danger"
+              plain
+              icon="delete"
+              :disabled="multiple"
+              @click="handleDelete"
+              v-hasPermi="['business:category:remove']"
+            >删除</el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button
+              type="warning"
+              plain
+              icon="download"
+              @click="handleExport"
+              v-hasPermi="['business:category:export']"
+            >导出</el-button>
+          </el-col>
+          <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+        </el-row>
 
-    <el-table v-loading="loading" :data="categoryList" @selection-change="handleSelectionChange">
-      <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="分类名称" align="center" prop="name" />
-      <el-table-column label="类别" align="center" prop="type" />
-      <el-table-column label="备注" align="center" prop="remark" />
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
-        <template slot-scope="scope">
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-edit"
-            @click="handleUpdate(scope.row)"
-            v-hasPermi="['system:category:edit']"
-          >修改</el-button>
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-delete"
-            @click="handleDelete(scope.row)"
-            v-hasPermi="['system:category:remove']"
-          >删除</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
+        <el-table v-loading="loading" :data="categoryList" @selection-change="handleSelectionChange">
+          <el-table-column type="selection" width="55" align="center" />
+          <el-table-column label="分类名称" align="center" prop="name" />
+          <el-table-column label="备注" align="center" prop="remark" />
+          <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="['business:category:edit']"
+              >修改</el-button>
+              <el-button
+                link
+                type="danger"
+                icon="delete"
+                @click="handleDelete(scope.row)"
+                v-hasPermi="['business:category:remove']"
+              >删除</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
         
-    <pagination
-      v-show="total>0"
-      :total="total"
-      :page.sync="queryParams.pageNum"
-      :limit.sync="queryParams.pageSize"
-      @pagination="getList"
-    />
+        <pagination
+          v-show="total>0"
+          :total="total"
+          :page.sync="queryParams.pageNum"
+          :limit.sync="queryParams.pageSize"
+          @pagination="getList"
+        />
 
-    <!-- 添加或修改分类对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
-      <el-form ref="formRef" :model="form" :rules="rules" label-width="80px">
-        <el-form-item label="分类名称" prop="name">
-          <el-input v-model="form.name" placeholder="请输入分类名称" />
-        </el-form-item>
-        <el-form-item label="备注" prop="remark">
-          <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
-        </el-form-item>
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitForm">确 定</el-button>
-        <el-button @click="cancel">取 消</el-button>
-      </div>
-    </el-dialog>
+        <!-- 添加或修改分类对话框 -->
+        <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+          <el-form ref="formRef" :model="form" :rules="rules" label-width="80px">
+            <el-form-item label="分类名称" prop="name">
+              <el-input v-model="form.name" placeholder="请输入分类名称" />
+            </el-form-item>
+            <el-form-item label="备注" prop="remark">
+              <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
+            </el-form-item>
+          </el-form>
+          <div slot="footer" class="dialog-footer">
+            <el-button type="primary" @click="submitForm">确 定</el-button>
+            <el-button @click="cancel">取 消</el-button>
+          </div>
+        </el-dialog>
+      </pane>
+    </splitpanes>
   </div>
 </template>
 
 <script setup>
-import { listCategory, getCategory, delCategory, addCategory, updateCategory } from "@/api/system/category";
+import { listCategory, getCategory, delCategory, addCategory, updateCategory } from "@/api/product/category";
 import useForm from '@/hooks/useForm.js';
+import { Splitpanes, Pane } from "splitpanes"
+import "splitpanes/dist/splitpanes.css"
+import useAppStore from '@/store/modules/app'
 
 const defaultForm = {
   id: null,
@@ -127,12 +132,14 @@ const defaultParams = {
   pageNum: 1,
   pageSize: 10,
   name: null,
+  pid: null
 }
 
 const formRef = ref(null);
 const queryRef = ref(null);
 
 const { proxy } = getCurrentInstance()
+const appStore = useAppStore()
 
 const data = reactive({
   // 遮罩层
@@ -149,6 +156,20 @@ const data = reactive({
   total: 0,
   // 分类表格数据
   categoryList: [],
+  categoryOptions: [
+    {
+      value: 0,
+      label: '一级分类'
+    },
+    {
+      value: 1,
+      label: '二级分类'
+    },
+    {
+      value: 2,
+      label: '三级分类'
+    },
+  ],
   // 弹出层标题
   title: "",
   // 是否显示弹出层
@@ -158,14 +179,12 @@ const data = reactive({
   }
 })
 
-const { loading, ids, single, showSearch, total, categoryList, title, open, rules } = toRefs(data);
+const { loading, ids, single, multiple, showSearch, total, categoryList, title, open, rules, categoryOptions } = toRefs(data);
 
 const { form, validateForm, resetForm } = useForm(formRef, defaultForm)
 const { form: queryParams, resetForm: resetQueryForm } = useForm(queryRef, defaultParams)
 
-onCreated (() => {
-  getList();
-})
+getList();
 
 function getList() {
   loading.value = true;
@@ -189,7 +208,7 @@ function reset() {
 
 /** 搜索按钮操作 */
 function handleQuery() {
-  queryParams.pageNum = 1;
+  queryParams.value.pageNum = 1;
   getList();
 }
 
@@ -226,7 +245,7 @@ function handleUpdate(row) {
 
 /** 提交按钮 */
 function submitForm() {
-  validateForm.then(() => {
+  validateForm().then(() => {
     if (form.value.id != null) {
       updateCategory(form.value).then(response => {
         proxy.$modal.msgSuccess("修改成功");
@@ -256,7 +275,7 @@ function handleDelete(row) {
 
 /** 导出按钮操作 */
 function handleExport() {
-  proxy.download('system/category/export', {
+  proxy.download('business/category/export', {
     ...queryParams.value
   }, `category_${new Date().getTime()}.xlsx`)
 }

src/views/product/productCategory/index.vue

@@ -0,0 +1,262 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="分类名称" prop="name">
+        <el-input
+          v-model="queryParams.name"
+          placeholder="请输入分类名称"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </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="['business:products-category:add']"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="edit"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['business:products-category:edit']"
+        >修改</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="delete"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['business:products-category:remove']"
+        >删除</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="download"
+          @click="handleExport"
+          v-hasPermi="['business:products-category:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="categoryList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="分类名称" align="center" prop="name" />
+      <el-table-column label="分类编码" align="center" prop="code" />
+      <el-table-column label="备注" align="center" prop="remark" />
+      <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="['business:products-category:edit']"
+          >修改</el-button>
+          <el-button
+            link
+            type="danger"
+            icon="delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['business:products-category:remove']"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改产品品类对话框 -->
+    <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+      <el-form ref="formRef" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="分类名称" prop="name">
+          <el-input v-model="form.name" placeholder="请输入分类名称" />
+        </el-form-item>
+        <el-form-item label="分类编码" prop="code">
+          <el-input v-model="form.code" placeholder="请输入分类编码" />
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import { listProductsCategory, getProductsCategory, delProductsCategory, addProductsCategory, updateProductsCategory } from "@/api/product/productsCategory";
+
+import useForm from '@/hooks/useForm.js';
+
+const defaultForm = {
+  id: null,
+  name: null,
+  code: null,
+  remark: null
+}
+
+const defaultParams = {
+  pageNum: 1,
+  pageSize: 10,
+  name: null,
+  code: null
+}
+
+const formRef = ref(null);
+const queryRef = ref(null);
+
+const { proxy } = getCurrentInstance()
+
+const data = reactive({
+  // 遮罩层
+  loading: true,
+  // 选中数组
+  ids: [],
+  // 非单个禁用
+  single: true,
+  // 非多个禁用
+  multiple: true,
+  // 显示搜索条件
+  showSearch: true,
+  // 总条数
+  total: 0,
+  // 分类表格数据
+  categoryList: [],
+  // 弹出层标题
+  title: "",
+  // 是否显示弹出层
+  open: false,
+  // 表单校验
+  rules: {
+  }
+})
+
+const { loading, ids, single, multiple, showSearch, total, categoryList, title, open, rules } = toRefs(data);
+
+const { form, validateForm, resetForm } = useForm(formRef, defaultForm)
+const { form: queryParams, resetForm: resetQueryForm } = useForm(queryRef, defaultParams)
+
+getList();
+
+function getList() {
+  loading.value = true;
+  listProductsCategory(queryParams.value).then(response => {
+    categoryList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  resetForm();
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  resetQueryForm();
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids = selection.map(item => item.id)
+  single = selection.length!==1
+  multiple.value = !selection.length
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加品类";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const id = row.id || ids.value
+  getProductsCategory(id).then(response => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改品类";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  validateForm.then(() => {
+    if (form.value.id != null) {
+      updateProductsCategory(form.value).then(response => {
+        proxy.$modal.msgSuccess("修改成功");
+        open.value = false;
+        getList();
+      });
+    } else {
+      addProductsCategory(form.value).then(response => {
+        proxy.$modal.msgSuccess("新增成功");
+        open.value = false;
+        getList();
+      });
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const ids = row.id || ids.value;
+  proxy.$modal.confirm('是否确认删除分类编号为"' + ids + '"的数据项？').then(function() {
+    return delProductsCategory(ids);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+  }).catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download('business/products-category/export', {
+    ...queryParams.value
+  }, `products-category_${new Date().getTime()}.xlsx`)
+}
+</script>

src/views/product/productRecord/index.vue

@@ -0,0 +1,294 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="产品名称" prop="name">
+        <el-input
+          v-model="queryParams.name"
+          placeholder="请输入产品名称"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="产品别名" prop="alias">
+        <el-input
+          v-model="queryParams.alias"
+          placeholder="请输入产品别名"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </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="['business:products:add']"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="edit"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['business:products:edit']"
+        >修改</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="delete"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['business:products:remove']"
+        >删除</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="download"
+          @click="handleExport"
+          v-hasPermi="['business:products:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="recordList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="产品名称" align="center" prop="name" />
+      <el-table-column label="产品别名" align="center" prop="alias" />
+      <el-table-column label="产品编码" align="center" prop="code" />
+      <el-table-column label="规格" align="center" prop="specs" />
+      <el-table-column label="单位" align="center" prop="unit" />
+      <el-table-column label="标签" align="center" prop="label" />
+      <el-table-column label="备注" align="center" prop="remark" />
+      <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="['business:products:edit']"
+          >修改</el-button>
+          <el-button
+            link
+            type="danger"
+            icon="delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['business:products:remove']"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改产品归档对话框 -->
+    <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+      <el-form ref="formRef" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="产品名称" prop="name">
+          <el-input v-model="form.name" placeholder="请输入产品名称" />
+        </el-form-item>
+        <el-form-item label="产品别名" prop="alias">
+          <el-input v-model="form.alias" placeholder="请输入产品别名" />
+        </el-form-item>
+        <el-form-item label="产品编码" prop="code">
+          <el-input v-model="form.code" placeholder="请输入产品编码" />
+        </el-form-item>
+        <el-form-item label="规格" prop="specs">
+          <el-input v-model="form.specs" placeholder="请输入规格" />
+        </el-form-item>
+        <el-form-item label="单位" prop="unit">
+          <el-input v-model="form.unit" placeholder="请输入单位" />
+        </el-form-item>
+        <el-form-item label="标签" prop="label">
+          <el-input v-model="form.label" placeholder="请输入标签" />
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import { listProductsRecord, getProductsRecord, delProductsRecord, addProductsRecord, updateProductsRecord } from "@/api/product/productsRecord";
+
+import useForm from '@/hooks/useForm.js';
+
+const defaultForm = {
+  id: null,
+  name: null,
+  alias: null,
+  code: null,
+  specs: null,
+  unit: null,
+  label: null,
+  remark: null
+}
+
+const defaultParams = {
+  pageNum: 1,
+  pageSize: 10,
+  name: null,
+  alias: null,
+  code: null,
+  specs: null,
+  unit: null,
+  label: null,
+}
+
+const formRef = ref(null);
+const queryRef = ref(null);
+
+const { proxy } = getCurrentInstance()
+
+const data = reactive({
+  // 遮罩层
+  loading: true,
+  // 选中数组
+  ids: [],
+  // 非单个禁用
+  single: true,
+  // 非多个禁用
+  multiple: true,
+  // 显示搜索条件
+  showSearch: true,
+  // 总条数
+  total: 0,
+  // 分类表格数据
+  recordList: [],
+  // 弹出层标题
+  title: "",
+  // 是否显示弹出层
+  open: false,
+  // 表单校验
+  rules: {
+  }
+})
+
+const { loading, ids, single, multiple, showSearch, total, recordList, title, open, rules } = toRefs(data);
+
+const { form, validateForm, resetForm } = useForm(formRef, defaultForm)
+const { form: queryParams, resetForm: resetQueryForm } = useForm(queryRef, defaultParams)
+
+getList();
+
+function getList() {
+  loading.value = true;
+  listProductsRecord(queryParams.value).then(response => {
+    recordList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  resetForm();
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  resetQueryForm();
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids = selection.map(item => item.id)
+  single = selection.length!==1
+  multiple.value = !selection.length
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加档案";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const id = row.id || ids.value
+  getProductsRecord(id).then(response => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改档案";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  validateForm.then(() => {
+    if (form.value.id != null) {
+      updateProductsRecord(form.value).then(response => {
+        proxy.$modal.msgSuccess("修改成功");
+        open.value = false;
+        getList();
+      });
+    } else {
+      addProductsRecord(form.value).then(response => {
+        proxy.$modal.msgSuccess("新增成功");
+        open.value = false;
+        getList();
+      });
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const ids = row.id || ids.value;
+  proxy.$modal.confirm('是否确认删除分类编号为"' + ids + '"的数据项？').then(function() {
+    return delProductsRecord(ids);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+  }).catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download('business/products/export', {
+    ...queryParams.value
+  }, `products-record_${new Date().getTime()}.xlsx`)
+}
+</script>

src/views/product/productType/index.vue

@@ -0,0 +1,278 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
+      <el-form-item label="部门ID" prop="deptId">
+        <el-input
+          v-model="queryParams.deptId"
+          placeholder="请输入部门ID"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="分类名称" prop="name">
+        <el-input
+          v-model="queryParams.name"
+          placeholder="请输入分类名称"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="分类编码" prop="code">
+        <el-input
+          v-model="queryParams.code"
+          placeholder="请输入分类编码"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </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="['business:products-type:add']"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="edit"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['business:products-type:edit']"
+        >修改</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="delete"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['business:products-type:remove']"
+        >删除</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="download"
+          @click="handleExport"
+          v-hasPermi="['business:products-type:export']"
+        >导出</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="name" />
+      <el-table-column label="分类编码" align="center" prop="code" />
+      <el-table-column label="备注" align="center" prop="remark" />
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+        <template slot-scope="scope">
+          <el-button
+            link
+            type="primary"
+            icon="edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['business:products-type:edit']"
+          >修改</el-button>
+          <el-button
+            link
+            type="danger"
+            icon="delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['business:products-type:remove']"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改产品类型对话框 -->
+    <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+      <el-form ref="formRef" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="分类名称" prop="name">
+          <el-input v-model="form.name" placeholder="请输入分类名称" />
+        </el-form-item>
+        <el-form-item label="分类编码" prop="code">
+          <el-input v-model="form.code" placeholder="请输入分类编码" />
+        </el-form-item>
+        <el-form-item label="备注" prop="remark">
+          <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import { listProductsType, getProductsType, delProductsType, addProductsType, updateProductsType } from "@/api/product/productsType";
+
+import useForm from '@/hooks/useForm.js';
+
+const defaultForm = {
+  id: null,
+  name: null,
+  code: null,
+  remark: null
+}
+
+const defaultParams = {
+  pageNum: 1,
+  pageSize: 10,
+  name: null,
+  code: null
+}
+
+const formRef = ref(null);
+const queryRef = ref(null);
+
+const { proxy } = getCurrentInstance()
+
+const data = reactive({
+  // 遮罩层
+  loading: true,
+  // 选中数组
+  ids: [],
+  // 非单个禁用
+  single: true,
+  // 非多个禁用
+  multiple: true,
+  // 显示搜索条件
+  showSearch: true,
+  // 总条数
+  total: 0,
+  // 分类表格数据
+  typeList: [],
+  // 弹出层标题
+  title: "",
+  // 是否显示弹出层
+  open: false,
+  // 表单校验
+  rules: {
+  }
+})
+
+const { loading, ids, single, multiple, showSearch, total, typeList, title, open, rules } = toRefs(data);
+
+const { form, validateForm, resetForm } = useForm(formRef, defaultForm)
+const { form: queryParams, resetForm: resetQueryForm } = useForm(queryRef, defaultParams)
+
+getList();
+
+function getList() {
+  loading.value = true;
+  listProductsType(queryParams.value).then(response => {
+    typeList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  resetForm();
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  resetQueryForm();
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids = selection.map(item => item.id)
+  single = selection.length!==1
+  multiple.value = !selection.length
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加类型";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const id = row.id || ids.value
+  getProductsType(id).then(response => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改类型";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  validateForm.then(() => {
+    if (form.value.id != null) {
+      updateProductsType(form.value).then(response => {
+        proxy.$modal.msgSuccess("修改成功");
+        open.value = false;
+        getList();
+      });
+    } else {
+      addProductsType(form.value).then(response => {
+        proxy.$modal.msgSuccess("新增成功");
+        open.value = false;
+        getList();
+      });
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const ids = row.id || ids.value;
+  proxy.$modal.confirm('是否确认删除分类编号为"' + ids + '"的数据项？').then(function() {
+    return delProductsType(ids);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+  }).catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download('system/products-type/export', {
+    ...queryParams.value
+  }, `products-type_${new Date().getTime()}.xlsx`)
+}
+</script>

src/views/supplier/record/index.vue

@@ -0,0 +1,479 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="110px">
+      <el-form-item label="供应商名称" prop="name">
+        <el-input
+          v-model="queryParams.name"
+          placeholder="请输入供应商名称"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="供应商法人类型" prop="corporationType">
+        <el-select
+          v-model="queryParams.corporationType"
+          placeholder="请选择类型"
+          clearable
+          @keyup.enter.native="handleQuery"
+          style="width: 200px;"
+        >
+          <el-option
+            v-for="item in supplier_corporation_type"
+            :key="item.value"
+            :label="item.label"
+            :value="item.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>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="plus"
+          @click="handleAdd"
+          v-hasPermi="['business:supplier:add']"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="edit"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['business:supplier:edit']"
+        >修改</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="delete"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['business:supplier:remove']"
+        >删除</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="download"
+          @click="handleExport"
+          v-hasPermi="['business:supplier:export']"
+        >导出</el-button>
+      </el-col>
+      <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="recordList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="供应商名称" align="center" prop="name" />
+      <el-table-column label="供应商评分" align="center" prop="score" />
+      <el-table-column label="供应商规模" align="center" prop="scale" />
+      <el-table-column label="供应商经营开始时间" align="center" prop="startTime" width="180">
+        <template #default="scope">
+          <span>{{ parseTime(scope.row.startTime, '{y}-{m}-{d}') }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="供应商法人类型" align="center" prop="corporationType" />
+      <el-table-column label="供应商股票名称" align="center" prop="stockName" />
+      <el-table-column label="是否小微企业" align="center" prop="smallVendors" />
+      <el-table-column label="供应商注册号" align="center" prop="registNo" />
+      <el-table-column label="供应商注册资本" align="center" prop="registCapital" />
+      <el-table-column label="供应商登记机关" align="center" prop="registAuthority" />
+      <el-table-column label="营业执照" align="center" prop="businessLicense" />
+      <el-table-column label="营业地址" align="center" prop="businessAddress" />
+      <el-table-column label="供应商注册行业" align="center" prop="registSector" />
+      <el-table-column label="供应商核准时间" align="center" prop="approvalTime" width="180">
+        <template #default="scope">
+          <span>{{ parseTime(scope.row.approvalTime, '{y}-{m}-{d}') }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="中标信息" align="center" prop="winBidInfo" />
+      <el-table-column label="合同信息" align="center" prop="contractInfo" />
+      <el-table-column label="合同有效期" align="center" prop="expirationTime" width="180">
+        <template #default="scope">
+          <span>{{ parseTime(scope.row.expirationTime, '{y}-{m}-{d}') }}</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="['business:supplier:edit']"
+          >修改</el-button>
+          <el-button
+            link
+            type="danger"
+            icon="delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['business:supplier:remove']"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改供应商档案信息对话框 -->
+    <el-dialog :title="title" v-model="open" width="1000px" append-to-body>
+      <el-form ref="formRef" :model="form" :rules="rules" label-width="160px">
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="供应商名称" prop="name">
+              <el-input v-model="form.name" placeholder="请输入供应商名称" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="供应商评分" prop="score">
+              <el-input v-model="form.score" placeholder="请输入供应商评分" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="供应商规模" prop="scale">
+              <el-select
+                v-model="form.scale"
+                placeholder="请选择规模"
+                clearable
+              >
+                <el-option
+                  v-for="item in supplier_scale"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="供应商经营开始时间" prop="startTime">
+              <el-date-picker clearable
+                v-model="form.startTime"
+                type="date"
+                value-format="yyyy-MM-dd"
+                placeholder="请选择供应商经营开始时间">
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="供应商股票名称" prop="stockName">
+              <el-input v-model="form.stockName" placeholder="请输入供应商股票名称" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="供应商法人类型" prop="corporationType">
+              <el-select
+                v-model="form.corporationType"
+                placeholder="请选择类型"
+                clearable
+              >
+                <el-option
+                  v-for="item in supplier_corporation_type"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="是否小商企业" prop="smallVendors">
+              <el-select
+                v-model="form.smallVendors"
+                placeholder="请选择"
+                clearable
+              >
+                <el-option
+                  v-for="item in [{ value: 0, label: '否' }, { value: 1, label: '是' }]"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="供应商注册号" prop="registNo">
+              <el-input v-model="form.registNo" placeholder="请输入供应商注册号" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="股票曾用名" prop="stockNameUsed">
+              <el-input v-model="form.stockNameUsed" placeholder="请输入供应商股票曾用名" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="供应商注册资本" prop="registCapital">
+              <el-input v-model="form.registCapital" placeholder="请输入供应商注册资本" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="供应商登记机关" prop="registAuthority">
+              <el-input v-model="form.registAuthority" placeholder="请输入供应商登记机关" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="供应商注册行业" prop="registSector">
+              <el-input v-model="form.registSector" placeholder="请输入供应商注册行业" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="供应商核准时间" prop="approvalTime">
+              <el-date-picker clearable
+                v-model="form.approvalTime"
+                type="date"
+                value-format="yyyy-MM-dd"
+                placeholder="请选择供应商核准时间">
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="中标信息" prop="winBidInfo">
+              <el-input v-model="form.winBidInfo" placeholder="请输入中标信息" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="合同信息" prop="contractInfo">
+              <el-input v-model="form.contractInfo" placeholder="请输入合同信息" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="合同有效期" prop="expirationTime">
+              <el-date-picker clearable
+                v-model="form.expirationTime"
+                type="date"
+                value-format="yyyy-MM-dd"
+                placeholder="请选择合同有效期">
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="营业执照" prop="businessLicense">
+              <el-input v-model="form.businessLicense" placeholder="请输入营业执照" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="营业地址" prop="businessAddress">
+              <el-input v-model="form.businessAddress" type="textarea" placeholder="请输入内容" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="附件是否上传" prop="attachment">
+              <el-select
+                v-model="form.attachment"
+                placeholder="请选择"
+                clearable
+              >
+                <el-option
+                  v-for="item in [{ value: 0, label: '否' }, { value: 1, label: '是' }]"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24" v-if="form.attachment">
+            <el-form-item label="执照相片" prop="licenseImg">
+              <image-upload
+                :limit="1"
+              >
+              </image-upload>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import { listSupplierRecord, getSupplierRecord, delSupplierRecord, addSupplierRecord, updateSupplierRecord } from "@/api/supplier/record";
+import ImageUpload from "@/components/ImageUpload";
+
+import useForm from '@/hooks/useForm.js';
+
+const defaultForm = {
+  id: null,
+  name: null,
+  score: null,
+  scale: null,
+  stockName: null,
+  stockNameUsed: null,
+  startTime: null,
+  corporationType: null,
+  smallVendors: null,
+  registNo: null,
+  registCapital: null,
+  registAuthority: null,
+  registSector: null,
+  approvalTime: null,
+  winBidInfo: null,
+  contractInfo: null,
+  expirationTime: null,
+  businessLicense: null,
+  businessAddress: null,
+  attachment: 0,
+  licenseImg: null,
+}
+
+const defaultParams = {
+  pageNum: 1,
+  pageSize: 10,
+  name: null,
+  corporationType: null
+}
+
+const formRef = ref(null);
+const queryRef = ref(null);
+
+const { proxy } = getCurrentInstance()
+
+const data = reactive({
+  // 遮罩层
+  loading: true,
+  // 选中数组
+  ids: [],
+  // 非单个禁用
+  single: true,
+  // 非多个禁用
+  multiple: true,
+  // 显示搜索条件
+  showSearch: true,
+  // 总条数
+  total: 0,
+  // 分类表格数据
+  recordList: [],
+  // 弹出层标题
+  title: "",
+  // 是否显示弹出层
+  open: false,
+  // 表单校验
+  rules: {
+  }
+})
+
+const { loading, ids, single, multiple, showSearch, total, recordList, title, open, rules } = toRefs(data);
+
+const { form, validateForm, resetForm } = useForm(formRef, defaultForm)
+const { form: queryParams, resetForm: resetQueryForm } = useForm(queryRef, defaultParams)
+
+const { supplier_scale, supplier_corporation_type } = proxy.useDict('supplier_scale', 'supplier_corporation_type')
+
+getList();
+
+function getList() {
+  loading.value = true;
+  listSupplierRecord(queryParams.value).then(response => {
+    recordList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  resetForm();
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  resetQueryForm();
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids = selection.map(item => item.id)
+  single = selection.length!==1
+  multiple.value = !selection.length
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加档案";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const id = row.id || ids.value
+  getSupplierRecord(id).then(response => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改档案";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  validateForm.then(() => {
+    if (form.value.id != null) {
+      updateSupplierRecord(form.value).then(response => {
+        proxy.$modal.msgSuccess("修改成功");
+        open.value = false;
+        getList();
+      });
+    } else {
+      addSupplierRecord(form.value).then(response => {
+        proxy.$modal.msgSuccess("新增成功");
+        open.value = false;
+        getList();
+      });
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const ids = row.id || ids.value;
+  proxy.$modal.confirm('是否确认删除分类编号为"' + ids + '"的数据项？').then(function() {
+    return delSupplierRecord(ids);
+  }).then(() => {
+    getList();
+    proxy.$modal.msgSuccess("删除成功");
+  }).catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download('business/supplier/export', {
+    ...queryParams.value
+  }, `supplier-record_${new Date().getTime()}.xlsx`)
+}
+</script>

src/views/system/role/index.vue

@@ -1,249 +1,375 @@
 <template>
-   <div class="app-container">
-      <el-form :model="queryParams" ref="queryRef" v-show="showSearch" :inline="true" label-width="68px">
-         <el-form-item label="角色名称" prop="roleName">
-            <el-input
-               v-model="queryParams.roleName"
-               placeholder="请输入角色名称"
-               clearable
-               style="width: 240px"
-               @keyup.enter="handleQuery"
-            />
-         </el-form-item>
-         <el-form-item label="权限字符" prop="roleKey">
-            <el-input
-               v-model="queryParams.roleKey"
-               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"
-               type="daterange"
-               range-separator="-"
-               start-placeholder="开始日期"
-               end-placeholder="结束日期"
-            ></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">
+  <div class="app-container">
+    <el-form
+      :model="queryParams"
+      ref="queryRef"
+      v-show="showSearch"
+      :inline="true"
+      label-width="68px"
+    >
+      <el-form-item label="角色名称" prop="roleName">
+        <el-input
+          v-model="queryParams.roleName"
+          placeholder="请输入角色名称"
+          clearable
+          style="width: 240px"
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="权限字符" prop="roleKey">
+        <el-input
+          v-model="queryParams.roleKey"
+          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"
+          type="daterange"
+          range-separator="-"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+        ></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:role:add']"
+          >新增</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="Edit"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['system:role:edit']"
+          >修改</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="Delete"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['system:role:remove']"
+          >删除</el-button
+        >
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="warning"
+          plain
+          icon="Download"
+          @click="handleExport"
+          v-hasPermi="['system:role:export']"
+          >导出</el-button
+        >
+      </el-col>
+      <right-toolbar
+        v-model:showSearch="showSearch"
+        @queryTable="getList"
+      ></right-toolbar>
+    </el-row>
+
+    <!-- 表格数据 -->
+    <el-table
+      v-loading="loading"
+      :data="roleList"
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="角色编号" prop="roleId" width="120" />
+      <el-table-column
+        label="角色名称"
+        prop="roleName"
+        :show-overflow-tooltip="true"
+        width="150"
+      />
+      <el-table-column
+        label="权限字符"
+        prop="roleKey"
+        :show-overflow-tooltip="true"
+        width="150"
+      />
+      <el-table-column label="显示顺序" prop="roleSort" width="100" />
+      <el-table-column label="状态" align="center" width="100">
+        <template #default="scope">
+          <el-switch
+            v-model="scope.row.status"
+            active-value="0"
+            inactive-value="1"
+            @change="handleStatusChange(scope.row)"
+          ></el-switch>
+        </template>
+      </el-table-column>
+      <el-table-column label="创建时间" align="center" prop="createTime">
+        <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-tooltip
+            content="修改"
+            placement="top"
+            v-if="scope.row.roleId !== 1"
+          >
             <el-button
-               type="primary"
-               plain
-               icon="Plus"
-               @click="handleAdd"
-               v-hasPermi="['system:role:add']"
-            >新增</el-button>
-         </el-col>
-         <el-col :span="1.5">
+              link
+              type="primary"
+              icon="Edit"
+              @click="handleUpdate(scope.row)"
+              v-hasPermi="['system:role:edit']"
+            ></el-button>
+          </el-tooltip>
+          <el-tooltip
+            content="删除"
+            placement="top"
+            v-if="scope.row.roleId !== 1"
+          >
             <el-button
-               type="success"
-               plain
-               icon="Edit"
-               :disabled="single"
-               @click="handleUpdate"
-               v-hasPermi="['system:role:edit']"
-            >修改</el-button>
-         </el-col>
-         <el-col :span="1.5">
+              link
+              type="primary"
+              icon="Delete"
+              @click="handleDelete(scope.row)"
+              v-hasPermi="['system:role:remove']"
+            ></el-button>
+          </el-tooltip>
+          <el-tooltip
+            content="数据权限"
+            placement="top"
+            v-if="scope.row.roleId !== 1"
+          >
             <el-button
-               type="danger"
-               plain
-               icon="Delete"
-               :disabled="multiple"
-               @click="handleDelete"
-               v-hasPermi="['system:role:remove']"
-            >删除</el-button>
-         </el-col>
-         <el-col :span="1.5">
+              link
+              type="primary"
+              icon="CircleCheck"
+              @click="handleDataScope(scope.row)"
+              v-hasPermi="['system:role:edit']"
+            ></el-button>
+          </el-tooltip>
+          <el-tooltip
+            content="分配用户"
+            placement="top"
+            v-if="scope.row.roleId !== 1"
+          >
             <el-button
-               type="warning"
-               plain
-               icon="Download"
-               @click="handleExport"
-               v-hasPermi="['system:role:export']"
-            >导出</el-button>
-         </el-col>
-         <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
-      </el-row>
-
-      <!-- 表格数据 -->
-      <el-table v-loading="loading" :data="roleList" @selection-change="handleSelectionChange">
-         <el-table-column type="selection" width="55" align="center" />
-         <el-table-column label="角色编号" prop="roleId" width="120" />
-         <el-table-column label="角色名称" prop="roleName" :show-overflow-tooltip="true" width="150" />
-         <el-table-column label="权限字符" prop="roleKey" :show-overflow-tooltip="true" width="150" />
-         <el-table-column label="显示顺序" prop="roleSort" width="100" />
-         <el-table-column label="状态" align="center" width="100">
-            <template #default="scope">
-               <el-switch
-                  v-model="scope.row.status"
-                  active-value="0"
-                  inactive-value="1"
-                  @change="handleStatusChange(scope.row)"
-               ></el-switch>
-            </template>
-         </el-table-column>
-         <el-table-column label="创建时间" align="center" prop="createTime">
-            <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-tooltip content="修改" placement="top" v-if="scope.row.roleId !== 1">
-                <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:role:edit']"></el-button>
-              </el-tooltip>
-              <el-tooltip content="删除" placement="top" v-if="scope.row.roleId !== 1">
-                <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:role:remove']"></el-button>
+              link
+              type="primary"
+              icon="User"
+              @click="handleAuthUser(scope.row)"
+              v-hasPermi="['system:role:edit']"
+            ></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-dialog :title="title" v-model="open" width="500px" append-to-body>
+      <el-form ref="roleRef" :model="form" :rules="rules" label-width="100px">
+        <el-form-item label="角色名称" prop="roleName">
+          <el-input v-model="form.roleName" placeholder="请输入角色名称" />
+        </el-form-item>
+        <el-form-item prop="roleKey">
+          <template #label>
+            <span>
+              <el-tooltip
+                content="控制器中定义的权限字符，如：@PreAuthorize(`@ss.hasRole('admin')`)"
+                placement="top"
+              >
+                <el-icon><question-filled /></el-icon>
               </el-tooltip>
-              <el-tooltip content="数据权限" placement="top" v-if="scope.row.roleId !== 1">
-                <el-button link type="primary" icon="CircleCheck" @click="handleDataScope(scope.row)" v-hasPermi="['system:role:edit']"></el-button>
-              </el-tooltip>
-              <el-tooltip content="分配用户" placement="top" v-if="scope.row.roleId !== 1">
-                <el-button link type="primary" icon="User" @click="handleAuthUser(scope.row)" v-hasPermi="['system:role:edit']"></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-dialog :title="title" v-model="open" width="500px" append-to-body>
-         <el-form ref="roleRef" :model="form" :rules="rules" label-width="100px">
-            <el-form-item label="角色名称" prop="roleName">
-               <el-input v-model="form.roleName" placeholder="请输入角色名称" />
-            </el-form-item>
-            <el-form-item prop="roleKey">
-               <template #label>
-                  <span>
-                     <el-tooltip content="控制器中定义的权限字符，如：@PreAuthorize(`@ss.hasRole('admin')`)" placement="top">
-                        <el-icon><question-filled /></el-icon>
-                     </el-tooltip>
-                     权限字符
-                  </span>
-               </template>
-               <el-input v-model="form.roleKey" placeholder="请输入权限字符" />
-            </el-form-item>
-            <el-form-item label="角色顺序" prop="roleSort">
-               <el-input-number v-model="form.roleSort" controls-position="right" :min="0" />
-            </el-form-item>
-            <el-form-item label="状态">
-               <el-radio-group v-model="form.status">
-                  <el-radio
-                     v-for="dict in sys_normal_disable"
-                     :key="dict.value"
-                     :value="dict.value"
-                  >{{ dict.label }}</el-radio>
-               </el-radio-group>
-            </el-form-item>
-            <el-form-item label="菜单权限">
-               <el-checkbox v-model="menuExpand" @change="handleCheckedTreeExpand($event, 'menu')">展开/折叠</el-checkbox>
-               <el-checkbox v-model="menuNodeAll" @change="handleCheckedTreeNodeAll($event, 'menu')">全选/全不选</el-checkbox>
-               <el-checkbox v-model="form.menuCheckStrictly" @change="handleCheckedTreeConnect($event, 'menu')">父子联动</el-checkbox>
-               <el-tree
-                  class="tree-border"
-                  :data="menuOptions"
-                  show-checkbox
-                  ref="menuRef"
-                  node-key="id"
-                  :check-strictly="!form.menuCheckStrictly"
-                  empty-text="加载中，请稍候"
-                  :props="{ label: 'label', children: 'children' }"
-               ></el-tree>
-            </el-form-item>
-            <el-form-item label="备注">
-               <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>
-
-      <!-- 分配角色数据权限对话框 -->
-      <el-dialog :title="title" v-model="openDataScope" width="500px" append-to-body>
-         <el-form :model="form" label-width="80px">
-            <el-form-item label="角色名称">
-               <el-input v-model="form.roleName" :disabled="true" />
-            </el-form-item>
-            <el-form-item label="权限字符">
-               <el-input v-model="form.roleKey" :disabled="true" />
-            </el-form-item>
-            <el-form-item label="权限范围">
-               <el-select v-model="form.dataScope" @change="dataScopeSelectChange">
-                  <el-option
-                     v-for="item in dataScopeOptions"
-                     :key="item.value"
-                     :label="item.label"
-                     :value="item.value"
-                  ></el-option>
-               </el-select>
-            </el-form-item>
-            <el-form-item label="数据权限" v-show="form.dataScope == 2">
-               <el-checkbox v-model="deptExpand" @change="handleCheckedTreeExpand($event, 'dept')">展开/折叠</el-checkbox>
-               <el-checkbox v-model="deptNodeAll" @change="handleCheckedTreeNodeAll($event, 'dept')">全选/全不选</el-checkbox>
-               <el-checkbox v-model="form.deptCheckStrictly" @change="handleCheckedTreeConnect($event, 'dept')">父子联动</el-checkbox>
-               <el-tree
-                  class="tree-border"
-                  :data="deptOptions"
-                  show-checkbox
-                  default-expand-all
-                  ref="deptRef"
-                  node-key="id"
-                  :check-strictly="!form.deptCheckStrictly"
-                  empty-text="加载中，请稍候"
-                  :props="{ label: 'label', children: 'children' }"
-               ></el-tree>
-            </el-form-item>
-         </el-form>
-         <template #footer>
-            <div class="dialog-footer">
-               <el-button type="primary" @click="submitDataScope">确 定</el-button>
-               <el-button @click="cancelDataScope">取 消</el-button>
-            </div>
-         </template>
-      </el-dialog>
-   </div>
+              权限字符
+            </span>
+          </template>
+          <el-input v-model="form.roleKey" placeholder="请输入权限字符" />
+        </el-form-item>
+        <el-form-item label="角色顺序" prop="roleSort">
+          <el-input-number
+            v-model="form.roleSort"
+            controls-position="right"
+            :min="0"
+          />
+        </el-form-item>
+        <el-form-item label="状态">
+          <el-radio-group v-model="form.status">
+            <el-radio
+              v-for="dict in sys_normal_disable"
+              :key="dict.value"
+              :value="dict.value"
+              >{{ dict.label }}</el-radio
+            >
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item label="菜单权限">
+          <el-checkbox
+            v-model="menuExpand"
+            @change="handleCheckedTreeExpand($event, 'menu')"
+            >展开/折叠</el-checkbox
+          >
+          <el-checkbox
+            v-model="menuNodeAll"
+            @change="handleCheckedTreeNodeAll($event, 'menu')"
+            >全选/全不选</el-checkbox
+          >
+          <el-checkbox
+            v-model="form.menuCheckStrictly"
+            @change="handleCheckedTreeConnect($event, 'menu')"
+            >父子联动</el-checkbox
+          >
+          <el-tree
+            class="tree-border"
+            :data="menuOptions"
+            show-checkbox
+            ref="menuRef"
+            node-key="id"
+            :check-strictly="!form.menuCheckStrictly"
+            empty-text="加载中，请稍候"
+            :props="{ label: 'label', children: 'children' }"
+          ></el-tree>
+        </el-form-item>
+        <el-form-item label="备注">
+          <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>
+
+    <!-- 分配角色数据权限对话框 -->
+    <el-dialog
+      :title="title"
+      v-model="openDataScope"
+      width="500px"
+      append-to-body
+    >
+      <el-form :model="form" label-width="80px">
+        <el-form-item label="角色名称">
+          <el-input v-model="form.roleName" :disabled="true" />
+        </el-form-item>
+        <el-form-item label="权限字符">
+          <el-input v-model="form.roleKey" :disabled="true" />
+        </el-form-item>
+        <el-form-item label="权限范围">
+          <el-select v-model="form.dataScope" @change="dataScopeSelectChange">
+            <el-option
+              v-for="item in dataScopeOptions"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="数据权限" v-show="form.dataScope == 2">
+          <el-checkbox
+            v-model="deptExpand"
+            @change="handleCheckedTreeExpand($event, 'dept')"
+            >展开/折叠</el-checkbox
+          >
+          <el-checkbox
+            v-model="deptNodeAll"
+            @change="handleCheckedTreeNodeAll($event, 'dept')"
+            >全选/全不选</el-checkbox
+          >
+          <el-checkbox
+            v-model="form.deptCheckStrictly"
+            @change="handleCheckedTreeConnect($event, 'dept')"
+            >父子联动</el-checkbox
+          >
+          <el-tree
+            class="tree-border"
+            :data="deptOptions"
+            show-checkbox
+            default-expand-all
+            ref="deptRef"
+            node-key="id"
+            :check-strictly="!form.deptCheckStrictly"
+            empty-text="加载中，请稍候"
+            :props="{ label: 'label', children: 'children' }"
+          ></el-tree>
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitDataScope">确 定</el-button>
+          <el-button @click="cancelDataScope">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
 </template>
 
 <script setup name="Role">
-import { addRole, changeRoleStatus, dataScope, delRole, getRole, listRole, updateRole, deptTreeSelect } from "@/api/system/role";
-import { roleMenuTreeselect, treeselect as menuTreeselect } from "@/api/system/menu";
+import {
+  addRole,
+  changeRoleStatus,
+  dataScope,
+  delRole,
+  getRole,
+  listRole,
+  updateRole,
+  deptTreeSelect,
+} from "@/api/system/role";
+import {
+  roleMenuTreeselect,
+  treeselect as menuTreeselect,
+} from "@/api/system/menu";
 
 const router = useRouter();
 const { proxy } = getCurrentInstance();
@@ -275,7 +401,7 @@ const dataScopeOptions = ref([
   { value: "2", label: "自定数据权限" },
   { value: "3", label: "本部门数据权限" },
   { value: "4", label: "本部门及以下数据权限" },
-  { value: "5", label: "仅本人数据权限" }
+  { value: "5", label: "仅本人数据权限" },
 ]);
 
 const data = reactive({
@@ -285,12 +411,16 @@ const data = reactive({
     pageSize: 10,
     roleName: undefined,
     roleKey: undefined,
-    status: undefined
+    status: undefined,
   },
   rules: {
-    roleName: [{ required: true, message: "角色名称不能为空", trigger: "blur" }],
+    roleName: [
+      { required: true, message: "角色名称不能为空", trigger: "blur" },
+    ],
     roleKey: [{ required: true, message: "权限字符不能为空", trigger: "blur" }],
-    roleSort: [{ required: true, message: "角色顺序不能为空", trigger: "blur" }]
+    roleSort: [
+      { required: true, message: "角色顺序不能为空", trigger: "blur" },
+    ],
   },
 });
 
@@ -299,11 +429,13 @@ const { queryParams, form, rules } = toRefs(data);
 /** 查询角色列表 */
 function getList() {
   loading.value = true;
-  listRole(proxy.addDateRange(queryParams.value, dateRange.value)).then(response => {
-    roleList.value = response.rows;
-    total.value = response.total;
-    loading.value = false;
-  });
+  listRole(proxy.addDateRange(queryParams.value, dateRange.value)).then(
+    (response) => {
+      roleList.value = response.rows;
+      total.value = response.total;
+      loading.value = false;
+    }
+  );
 }
 
 /** 搜索按钮操作 */
@@ -322,24 +454,32 @@ function resetQuery() {
 /** 删除按钮操作 */
 function handleDelete(row) {
   const roleIds = row.roleId || ids.value;
-  proxy.$modal.confirm('是否确认删除角色编号为"' + roleIds + '"的数据项?').then(function () {
-    return delRole(roleIds);
-  }).then(() => {
-    getList();
-    proxy.$modal.msgSuccess("删除成功");
-  }).catch(() => {});
+  proxy.$modal
+    .confirm('是否确认删除角色编号为"' + roleIds + '"的数据项?')
+    .then(function () {
+      return delRole(roleIds);
+    })
+    .then(() => {
+      getList();
+      proxy.$modal.msgSuccess("删除成功");
+    })
+    .catch(() => {});
 }
 
 /** 导出按钮操作 */
 function handleExport() {
-  proxy.download("system/role/export", {
-    ...queryParams.value,
-  }, `role_${new Date().getTime()}.xlsx`);
+  proxy.download(
+    "system/role/export",
+    {
+      ...queryParams.value,
+    },
+    `role_${new Date().getTime()}.xlsx`
+  );
 }
 
 /** 多选框选中数据 */
 function handleSelectionChange(selection) {
-  ids.value = selection.map(item => item.roleId);
+  ids.value = selection.map((item) => item.roleId);
   single.value = selection.length != 1;
   multiple.value = !selection.length;
 }
@@ -347,13 +487,17 @@ function handleSelectionChange(selection) {
 /** 角色状态修改 */
 function handleStatusChange(row) {
   let text = row.status === "0" ? "启用" : "停用";
-  proxy.$modal.confirm('确认要"' + text + '""' + row.roleName + '"角色吗?').then(function () {
-    return changeRoleStatus(row.roleId, row.status);
-  }).then(() => {
-    proxy.$modal.msgSuccess(text + "成功");
-  }).catch(function () {
-    row.status = row.status === "0" ? "1" : "0";
-  });
+  proxy.$modal
+    .confirm('确认要"' + text + '""' + row.roleName + '"角色吗?')
+    .then(function () {
+      return changeRoleStatus(row.roleId, row.status);
+    })
+    .then(() => {
+      proxy.$modal.msgSuccess(text + "成功");
+    })
+    .catch(function () {
+      row.status = row.status === "0" ? "1" : "0";
+    });
 }
 
 /** 更多操作 */
@@ -377,7 +521,7 @@ function handleAuthUser(row) {
 
 /** 查询菜单树结构 */
 function getMenuTreeselect() {
-  menuTreeselect().then(response => {
+  menuTreeselect().then((response) => {
     menuOptions.value = response.data;
   });
 }
@@ -411,7 +555,7 @@ function reset() {
     deptIds: [],
     menuCheckStrictly: true,
     deptCheckStrictly: true,
-    remark: undefined
+    remark: undefined,
   };
   proxy.resetForm("roleRef");
 }
@@ -429,7 +573,7 @@ function handleUpdate(row) {
   reset();
   const roleId = row.roleId || ids.value;
   const roleMenu = getRoleMenuTreeselect(roleId);
-  getRole(roleId).then(response => {
+  getRole(roleId).then((response) => {
     form.value = response.data;
     form.value.roleSort = Number(form.value.roleSort);
     open.value = true;
@@ -449,7 +593,7 @@ function handleUpdate(row) {
 
 /** 根据角色ID查询菜单树结构 */
 function getRoleMenuTreeselect(roleId) {
-  return roleMenuTreeselect(roleId).then(response => {
+  return roleMenuTreeselect(roleId).then((response) => {
     menuOptions.value = response.menus;
     return response;
   });
@@ -457,7 +601,7 @@ function getRoleMenuTreeselect(roleId) {
 
 /** 根据角色ID查询部门树结构 */
 function getDeptTree(roleId) {
-  return deptTreeSelect(roleId).then(response => {
+  return deptTreeSelect(roleId).then((response) => {
     deptOptions.value = response.depts;
     return response;
   });
@@ -508,18 +652,18 @@ function getMenuAllCheckedKeys() {
 
 /** 提交按钮 */
 function submitForm() {
-  proxy.$refs["roleRef"].validate(valid => {
+  proxy.$refs["roleRef"].validate((valid) => {
     if (valid) {
       if (form.value.roleId != undefined) {
         form.value.menuIds = getMenuAllCheckedKeys();
-        updateRole(form.value).then(response => {
+        updateRole(form.value).then((response) => {
           proxy.$modal.msgSuccess("修改成功");
           open.value = false;
           getList();
         });
       } else {
         form.value.menuIds = getMenuAllCheckedKeys();
-        addRole(form.value).then(response => {
+        addRole(form.value).then((response) => {
           proxy.$modal.msgSuccess("新增成功");
           open.value = false;
           getList();
@@ -546,11 +690,11 @@ function dataScopeSelectChange(value) {
 function handleDataScope(row) {
   reset();
   const deptTreeSelect = getDeptTree(row.roleId);
-  getRole(row.roleId).then(response => {
+  getRole(row.roleId).then((response) => {
     form.value = response.data;
     openDataScope.value = true;
     nextTick(() => {
-      deptTreeSelect.then(res => {
+      deptTreeSelect.then((res) => {
         nextTick(() => {
           if (deptRef.value) {
             deptRef.value.setCheckedKeys(res.checkedKeys);
@@ -566,7 +710,7 @@ function handleDataScope(row) {
 function submitDataScope() {
   if (form.value.roleId != undefined) {
     form.value.deptIds = getDeptAllCheckedKeys();
-    dataScope(form.value).then(response => {
+    dataScope(form.value).then((response) => {
       proxy.$modal.msgSuccess("修改成功");
       openDataScope.value = false;
       getList();

vite.config.js

@@ -31,7 +31,7 @@ export default defineConfig(({ mode, command }) => {
       proxy: {
         // https://cn.vitejs.dev/config/#server-proxy
         "/dev-api": {
-          target: "http://192.168.0.120:8080",
+          target: "http://192.168.0.111:8080",
           changeOrigin: true,
           rewrite: (p) => p.replace(/^\/dev-api/, ""),
         },