新增界面

.eslintrc.cjs

@@ -13,9 +13,7 @@ module.exports = {
   ],
   parserOptions: {
     ecmaVersion: '2020',
-    sourceType: 'module',
-    project: './tsconfig.*?.json',
-    parser: '@typescript-eslint/parser'
+    sourceType: 'module'
   },
   plugins: ['vue', 'import', 'promise', 'node', 'prettier'],
   rules: {
@@ -26,18 +24,7 @@ module.exports = {
     'vue/no-v-model-argument': 'off',
     'prefer-rest-params': 'off',
     // prettier
-    'prettier/prettier': 'error',
-    '@typescript-eslint/ban-types': [
-      'error',
-      {
-        // 关闭空类型检查 {}
-        extendDefaults: true,
-        types: {
-          '{}': false,
-          Function: false
-        }
-      }
-    ]
+    'prettier/prettier': 'error'
   },
   globals: {
     DialogOption: 'readonly',

package.json

@@ -43,6 +43,7 @@
   },
   "devDependencies": {
     "@iconify-json/ep": "^1.2.2",
+    "@types/node": "^22.15.26",
     "@unocss/preset-attributify": "0.58.6",
     "@unocss/preset-icons": "0.58.6",
     "@unocss/preset-uno": "0.58.6",

src/main.js

@@ -13,7 +13,7 @@ import router from './router';
 import directive from './directive';
 
 // 注册插件
-import plugins from './plugins/index'; // plugins
+import plugins from './plugins/index';
 
 // 高亮组件
 // import 'highlight.js/styles/a11y-light.css';

src/plugins/index.js

@@ -12,6 +12,7 @@ import { getConfigKey, updateConfigByKey } from '@/api/system/config';
 import { parseTime, addDateRange, handleTree, selectDictLabel, selectDictLabels } from '@/utils/ruoyi';
 
 export default function installPlugin(app) {
+  debugger
   // 页签操作
   app.config.globalProperties.$tab = tab;
 

src/views/commodityManage/CommodityManageForm.vue

@@ -2,12 +2,12 @@
   <div class="common-dialog">
     <div class="common-dialog-content">
       <div class="common-dialog-title-box">
-        <h3 class="common-dialog-title">新增商品</h3>
+        <h3 class="common-dialog-title">{{ id ? '修改商品' : '新增商品' }}</h3>
       </div>
       <div class="common-dialog-box">
-        <el-form ref="form" :model="formData" :rules="rules" label-width="auto" class="common-form">
+        <el-form ref="formRef" :model="formData" :rules="rules" label-width="auto" class="common-form">
           <el-form-item label="商品名称：" prop="name">
-            <el-input v-model="formData.name" placeholder="请输入商品名称" type="textarea" autosize />
+            <el-input v-model="formData.name" placeholder="请输入商品名称" type="textarea" autosize clearable />
           </el-form-item>
           <div class="common-form-row">
             <el-form-item label="定价：" prop="fixedPrice">
@@ -20,7 +20,7 @@
         </el-form>
         <div class="common-dialog-footer">
           <el-button @click="handleCancel">取消</el-button>
-          <el-button type="primary" @click="submitForm">确定</el-button>
+          <el-button type="primary" @click="submitForm(formRef)">确定</el-button>
         </div>
       </div>
     </div>
@@ -33,8 +33,9 @@ const props = defineProps({
     type: String,
     required: true
   }
-})
-const proxy = getCurrentInstance();
+});
+const formRef = ref(null);
+const { proxy } = getCurrentInstance();
 const emits = defineEmits(['onCancel', 'onConfirm']);
 const formData = ref({
   name: '',
@@ -44,21 +45,24 @@ const formData = ref({
 const rules = reactive({
   name: [{ required: true, message: '商品名称不能为空', trigger: 'blur' }],
   fixedPrice: [{ required: true, message: '定价不能为空', trigger: 'blur' }],
-  price: [{ required: true, message: '售价不能为空', trigger: 'blur' }],
-})
+  price: [{ required: true, message: '售价不能为空', trigger: 'blur' }]
+});
 // 取消
 const handleCancel = () => {
   emits('onCancel');
-}
+};
 
 // 提交表单
-const submitForm = () => {
-  const flag = props.id;
-  proxy?.$modal.msgSuccess(flag ? '修改成功' : '新增成功')
-  emits('onConfirm');
+const submitForm = (formEl) => {
+  if (!formEl) return;
+  formEl.validate((valid) => {
+    if (valid) {
+      const flag = props.id;
+      proxy?.$modal.msgSuccess(flag ? '修改成功' : '新增成功');
+      emits('onConfirm');
+    }
+  });
 };
 </script>
 
-<style lang="scss" scoped>
-
-</style>
+<style lang="scss" scoped></style>

src/views/commodityManage/index.vue

@@ -2,42 +2,41 @@
   <div class="app-container">
     <div v-show="!commodityManageFormState.show">
       <transition name="fade">
-        <div>
-          <el-form ref="queryFormRef" :model="queryParams">
-            <el-row :gutter="20">
-              <el-col :span="6">
-                <el-form-item label="输入搜索：" prop="name">
-                  <el-input v-model="queryParams.name" placeholder="请输入报告名称" clearable @keyup.enter="handleQuery" />
-                </el-form-item>
-              </el-col>
-              <el-col :span="6">
-                <el-form-item label="服务分类：" prop="serviceClass">
-                  <el-select v-model="queryParams.serviceClass" clearable>
-                    <!--<el-option v-for="item in mm_event_type" :key="item.value" :label="item.label" :value="item.value"></el-option>-->
-                  </el-select>
-                </el-form-item>
-              </el-col>
-              <el-col :span="6">
-                <el-form-item label="服务状态：" prop="serviceStatus">
-                  <el-select v-model="queryParams.serviceStatus" clearable>
-                    <!--<el-option v-for="item in mm_event_type" :key="item.value" :label="item.label" :value="item.value"></el-option>-->
-                  </el-select>
-                </el-form-item>
-              </el-col>
-              <el-col :span="6">
-                <el-button type="primary" @click="handleQuery">搜索</el-button>
-                <el-button @click="resetQuery">重置</el-button>
-              </el-col>
-            </el-row>
-          </el-form>
-        </div>
+        <el-form ref="queryFormRef" :model="queryParams">
+          <el-row :gutter="20">
+            <el-col :span="6">
+              <el-form-item label="报告名称：" prop="name">
+                <el-input v-model="queryParams.name" placeholder="请输入报告名称" clearable @keyup.enter="handleQuery"/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="6">
+              <el-form-item label="服务分类：" prop="serviceClass">
+                <el-select v-model="queryParams.serviceClass" clearable>
+                  <!--<el-option v-for="item in mm_event_type" :key="item.value" :label="item.label" :value="item.value"></el-option>-->
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="6">
+              <el-form-item label="服务状态：" prop="serviceStatus">
+                <el-select v-model="queryParams.serviceStatus" clearable>
+                  <!--<el-option v-for="item in mm_event_type" :key="item.value" :label="item.label" :value="item.value"></el-option>-->
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="6">
+              <el-button type="primary" @click="handleQuery">搜索</el-button>
+              <el-button @click="resetQuery">重置</el-button>
+            </el-col>
+          </el-row>
+        </el-form>
       </transition>
       <el-row :gutter="10" class="mb8">
         <el-col :span="1.5">
           <el-button type="primary" icon="Plus" @click="handleAdd">新增</el-button>
         </el-col>
         <el-col :span="1.5">
-          <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete(selectedRow)">删除</el-button>
+          <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete(selectedRow)">删除
+          </el-button>
         </el-col>
         <el-col :span="1.5">
           <el-button plain icon="Upload" @click="handleImport">导入</el-button>
@@ -67,14 +66,19 @@
         </el-table-column>
       </el-table>
 
-      <pagination v-show="total > 0" v-model:page="queryParams.page" v-model:limit="queryParams.page_size" :total="total" @pagination="getList" />
+      <pagination v-show="total > 0" v-model:page="queryParams.page" v-model:limit="queryParams.page_size"
+                  :total="total" @pagination="getList"/>
     </div>
-    <CommodityManageForm v-if="commodityManageFormState.show" @onCancel="commodityManageFormState.show = false" @onConfirm="handleCommodityManageFormState" />
+    <CommodityManageForm
+      v-if="commodityManageFormState.show"
+      @onCancel="commodityManageFormState.show = false"
+      @onConfirm="handleCommodityManageFormState"
+    />
   </div>
 </template>
 
 <script setup name="CommodityManage">
-import CommodityManageForm from "@/views/commodityManage/CommodityManageForm.vue";
+import CommodityManageForm from './CommodityManageForm.vue';
 
 const { proxy } = getCurrentInstance();
 const queryFormRef = ref();
@@ -86,7 +90,7 @@ const queryParams = reactive({
   page_size: ''
 });
 // 表格数据
-const dataList = ref([{}]);
+const dataList = ref([]);
 // 加载中
 const loading = ref(false);
 // 总数
@@ -103,18 +107,17 @@ const selectedRow = ref(null);
 const commodityManageFormState = ref({
   show: false,
   id: ''
-})
+});
 
 // 获取数据
 const getList = () => {
   loading.value = true;
   setTimeout(() => {
     loading.value = false;
-  }, 500)
-}
+  }, 500);
+};
 // 点击查询
 const handleQuery = () => {
-  commodityManageFormState
   queryParams.page = 1;
   getList();
 };
@@ -166,6 +169,4 @@ const handleExport = () => {};
 getList();
 </script>
 
-<style lang="scss" scoped>
-
-</style>
+<style lang="scss" scoped></style>

tsconfig.json

@@ -1,31 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "esnext",
-    "module": "esnext",
-//    "useDefineForClassFields": true,
-    "moduleResolution": "bundler",
-    "strict": true,
-    "jsx": "preserve",
-    "strictNullChecks": false,
-    "sourceMap": true,
-    "resolveJsonModule": true,
-    "esModuleInterop": true,
-    "strictFunctionTypes": false,
-    "lib": ["esnext", "dom"],
-    "noImplicitAny": false,
-    "baseUrl": ".",
-    "allowJs": true,
-    "experimentalDecorators": true,
-    "paths": {
-      "@/*": ["src/*"]
-    },
-    "types": ["vite/client"],
-    "skipLibCheck": true,
-    "removeComments": true,
-    // 允许默认导入
-    "allowSyntheticDefaultImports": true,
-    "forceConsistentCasingInFileNames": true
-  },
-  "include": ["src/**/*.vue", "vite.config.js"],
-  "exclude": ["node_modules", "dist", "**/*.js", "**/*.md", "src/**/*.md"]
-}

vite.config.js

@@ -1,6 +1,7 @@
 import { loadEnv, defineConfig } from 'vite';
 import createPlugins from './vite/plugins';
 import path from 'path';
+import {fileURLToPath, URL} from "node:url";
 
 export default defineConfig(({ mode, command }) => {
   const env = loadEnv(mode, process.cwd());
@@ -10,8 +11,8 @@ export default defineConfig(({ mode, command }) => {
     base: env.VITE_APP_CONTEXT_PATH,
     resolve: {
       alias: {
-        '~': path.resolve(__dirname, './'),
-        '@': path.resolve(__dirname, './src')
+        '~': fileURLToPath(new URL('./', import.meta.url)),
+        '@': fileURLToPath(new URL('./src', import.meta.url))
       },
       extensions: ['.mjs', '.js', '.jsx', '.json', '.vue']
     },