feat: 完成打包配置

.env

@@ -0,0 +1 @@
+VITE_API_HOST = 'http://localhost/api'

.env.test

@@ -0,0 +1 @@
+VITE_API_HOST = 'http://192.168.0.161'

package.json

@@ -5,9 +5,11 @@
   "type": "module",
   "scripts": {
     "dev": "vite",
+    "dev:test": "vite --host --mode test",
     "build": "run-p type-check \"build-only {@}\" --",
     "preview": "vite preview",
     "build-only": "vite build",
+    "build:test": "vite build --mode test",
     "type-check": "vue-tsc --build --force",
     "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
     "format": "prettier --write src/"
@@ -28,6 +30,7 @@
     "mitt": "^3.0.1",
     "moment": "^2.30.1",
     "pinia": "^2.2.2",
+    "sass-loader": "^16.0.2",
     "vue": "^3.4.29",
     "vue-draggable-plus": "^0.5.3",
     "vue-router": "^4.3.3",
@@ -54,7 +57,7 @@
     "postcss": "^8.4.41",
     "postcss-loader": "^8.1.1",
     "prettier": "^3.2.5",
-    "sass": "^1.77.8",
+    "sass": "^1.79.4",
     "typescript": "~5.4.0",
     "unplugin-auto-import": "^0.18.2",
     "unplugin-icons": "^0.19.2",

src/api/module/booking.ts

@@ -1,6 +1,7 @@
 import HttpAxios from '@/utils/axios'
 
-const baseUrl = 'http://localhost/api/Customer_Service_Online/main_new_version.php'
+const base = import.meta.env.VITE_API_HOST
+const baseUrl = `${base}/Customer_Service_Online/main_new_version.php`
 
 /**
  * Booking首页表格列数据

src/api/module/common.ts

@@ -1,6 +1,7 @@
 import HttpAxios from '@/utils/axios'
 
-const baseUrl = 'http://localhost/api/Customer_Service_Online/main_new_version.php'
+const base = import.meta.env.VITE_API_HOST
+const baseUrl = `${base}/Customer_Service_Online/main_new_version.php`
 
 /**
  * 获取表格定制列功能数据

src/api/module/login.ts

@@ -1,6 +1,7 @@
 import HttpAxios from '@/utils/axios'
 
-const baseUrl = 'http://localhost/api/Customer_Service_Online/login.php'
+const base = import.meta.env.VITE_API_HOST
+const baseUrl = `${base}/Customer_Service_Online/login.php`
 
 /**
  * 获取验证码

src/api/module/tracking.ts

@@ -1,6 +1,7 @@
 import HttpAxios from '@/utils/axios'
 
-const baseUrl = 'http://localhost/api/Customer_Service_Online/main_new_version.php'
+const base = import.meta.env.VITE_API_HOST
+const baseUrl = `${base}/Customer_Service_Online/main_new_version.php`
 
 /**
  * Tracking首页表格列数据

src/auto-imports.d.ts

@@ -69,6 +69,6 @@ declare global {
 // for type re-export
 declare global {
   // @ts-ignore
-  export type { Component, ComponentPublicInstance, ComputedRef, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, VNode, WritableComputedRef } from 'vue'
+  export type { Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue'
   import('vue')
 }

src/views/Tracking/src/components/TrackingTable/src/TrackingTable.vue

@@ -1,5 +1,4 @@
 <script setup lang="ts">
-import { type VxeGridInstance, type VxeGridProps } from 'vxe-table'
 import DownloadDialog from './components/DownloadDialog.vue'
 import { autoWidth } from '@/utils/table'
 import { useRowClickStyle } from '@/hooks/rowClickStyle'
@@ -73,7 +72,7 @@ const getTableColumns = async (isInit: boolean) => {
       trackingTable.value.columns = [
         { type: 'checkbox', width: 50, fixed: 'left' },
         ...handleColumns(res.data.TrackingTableColumns),
-        { title: 'Action', fixed: 'left', width: 80, slots: { default: 'action' } }
+        { title: 'Action', fixed: 'right', width: 80, slots: { default: 'action' } }
       ]
       tableOriginColumnsField.value = res.data.TrackingTableColumns
     }
@@ -154,8 +153,8 @@ onMounted(() => {
   })
 })
 
-const tableRef = ref<VxeGridInstance>()
-const trackingTable = ref<VxeGridProps<any>>({
+const tableRef = ref<any>()
+const trackingTable = ref<any>({
   border: true,
   round: true,
   columns: [],
@@ -177,8 +176,8 @@ const trackingTable = ref<VxeGridProps<any>>({
   }
 })
 
-const allTableRef = ref<VxeGridInstance>()
-const allTable = ref<VxeGridProps<any>>({
+const allTableRef = ref<any>()
+const allTable = ref<any>({
   columns: [],
   data: [],
   showHeaderOverflow: true,

src/views/Tracking/src/components/TrackingTable/src/components/VGMView.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-const formInline: any = ref({
+const formInline = ref({
   user: '',
   region: '',
   date: ''
@@ -7,6 +7,13 @@ const formInline: any = ref({
 const onSubmit = () => {
   console.log('submit!')
 }
+
+const rules = reactive({
+  user: [
+    { required: true, message: 'Please input Activity name', trigger: 'blur' },
+  ],
+})
+
 </script>
 
 <template>
@@ -51,31 +58,57 @@ const onSubmit = () => {
           </div>
         </div>
         <div class="form">
-          <el-form :inline="true" :model="formInline" class="demo-form-inline">
-            <el-form-item label="Approved by">
-              <el-input v-model="formInline.user" placeholder="Approved by" clearable />
-            </el-form-item>
-            <el-form-item label="Activity zone">
-              <el-select v-model="formInline.region" placeholder="Activity zone" clearable>
-                <el-option label="Zone one" value="shanghai" />
-                <el-option label="Zone two" value="beijing" />
-              </el-select>
-            </el-form-item>
-            <el-form-item label="Activity time">
-              <el-date-picker
-                v-model="formInline.date"
-                type="date"
-                placeholder="Pick a date"
-                clearable
-              />
-            </el-form-item>
-            <el-form-item>
-              <el-button type="primary" @click="onSubmit">Query</el-button>
-            </el-form-item>
-          </el-form>
+         <div class="form-row">
+            <div class="form-item">
+              <div class="label">
+                Submitter <span class="require-asterisk">*</span>
+              </div>
+              <div class="content">
+                <el-input v-model="formInline.user" placeholder="Please enter..." clearable></el-input>
+              </div>
+            </div>
+            <div class="form-item">
+              <div class="label">
+                Signature <span class="require-asterisk">*</span>
+              </div>
+              <div class="content">
+                <el-input v-model="formInline.user" placeholder="Please enter..." clearable></el-input>
+              </div>
+            </div>
+            <div style="width: 130px;"></div>
+         </div>
+         <div class="form-row">
+            <div class="form-item">
+              <div class="label">
+                Authorized Email <span class="require-asterisk">*</span>
+              </div>
+              <div class="content">
+                <el-input v-model="formInline.user" placeholder="Please enter..." clearable></el-input>
+              </div>
+            </div>
+            <div class="form-item">
+              <div class="label">
+                Authorized Tel
+                <span class="require-asterisk">*</span>
+              </div>
+              <div class="content">
+                <el-input v-model="formInline.user" placeholder="Please enter..." clearable></el-input>
+              </div>
+            </div>
+            <div class="form-item" style="flex: 0 0 130px;">
+             <div class="label"> </div>
+              <div class="content">
+                <el-checkbox v-model="formInline.user" label="Option 1" size="large" />
+              </div>
+            </div>
+         </div>
+        </div>
+      </div>
+      <div class="detail-info" style="margin-top: 8px;">
+        <div class="title">
+          <span>Detail Information</span>
         </div>
       </div>
-      <div class="detail-info"></div>
     </div>
   </div>
 </template>
@@ -129,6 +162,37 @@ const onSubmit = () => {
       border-top: 1px solid var(--color-border);
     }
   }
+  .form {
+    .form-row {
+      display: flex;
+      flex-wrap: wrap;
+      gap: 16px;
+      margin-bottom: 16px;
+      .form-item {
+        flex: 1;
+        .label {
+          height: 16px;
+          margin-bottom: 8px;
+          font-size: 12px;
+          line-height: 16px;
+          color: var(--dashboard-text-color);
+          .require-asterisk  {
+            margin-left: -3px;
+            font-size: 16px;
+            color: #C9353F;
+          }
+        }
+        .content {
+          display: flex;
+          align-items: center;
+          height: 32px;
+          .el-input {
+            width: 100%;
+          }
+        }
+      }
+    }
+  }
 }
 .data-info {
   display: flex;

tsconfig.app.json

@@ -1,5 +1,4 @@
 {
-  "extends": "@vue/tsconfig/tsconfig.dom.json",
   "include": [
     "env.d.ts",
     "src/**/*",
@@ -12,6 +11,9 @@
     "src/**/__tests__/*"
   ],
   "compilerOptions": {
+    "outDir": "./dist/app",
+    "rootDir": "./src/app",
+    "module": "esnext",
     "composite": true,
     "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
     "baseUrl": ".",

tsconfig.node.json

@@ -11,9 +11,11 @@
     "composite": true,
     "noEmit": true,
     "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
-
-    "module": "ESNext",
-    "moduleResolution": "Bundler",
-    "types": ["node"]
+    "outDir": "./dist/node",
+    "rootDir": "./src/node",
+    "module": "node16",
+    "types": [
+      "node"
+    ]
   }
-}
+}

vite.config.ts

@@ -10,6 +10,7 @@ import IconsResolver from 'unplugin-icons/resolver'
 
 // https://vitejs.dev/config/
 export default defineConfig({
+  base: './',
   resolve: {
     alias: {
       '@': fileURLToPath(new URL('./src', import.meta.url))