调整备货单 crm 端页面

src/App.vue

@@ -183,7 +183,8 @@
         // 排除移动端电子签名页，不做签名校验
         const currentPath = router.currentRoute.value?.path || ''
         const isOnMobileSignature = currentPath.startsWith('/auth/signature/mobile')
-        if (!isOnMobileSignature && (data.user.sign_img == null || data.user.sign_img == '')) {
+        if (!isOnMobileSignature) {
+          if (data.user.sign_img == null || data.user.sign_img == '') {
             ElMessageBox.alert('请前往个人中心完成签名操作！', '提醒', {
               confirmButtonText: '确定',
               callback: () => {
@@ -194,6 +195,18 @@
                 }
               }
             })
+          } else if (data.user.email == null || data.user.email == '') {
+            ElMessageBox.alert('邮箱没有填写！请前往个人中心补充邮箱！', '提醒', {
+              confirmButtonText: '确定',
+              callback: () => {
+                if (systemsid == '1') {
+                  router.push('/admin/user/user_info')
+                } else {
+                  router.push('/system/user-center')
+                }
+              }
+            })
+          }
         }
         userStore.setUserInfo(data)
       } catch (error) {

src/api/crmpc/vehicleApi.ts

@@ -64,4 +64,35 @@ export class vehicleService {
       params
     })
   }
+  // 改装管理
+  static getModificationList(params: Api.Common.PaginatingParams & any) {
+    return request.get<Api.Common.CommonListData>({
+      url: '/crm/modification/list',
+      params
+    })
+  }
+  static modificationAdd(params: any) {
+    return request.post<Api.Common.AddResponse>({
+      url: '/crm/modification/store',
+      params
+    })
+  }
+  static modificationDetail(params: any) {
+    return request.get<any>({
+      url: '/crm/modification/show',
+      params
+    })
+  }
+  static modificationEdit(params: any) {
+    return request.post<Api.Common.AddResponse>({
+      url: '/crm/modification/update',
+      params
+    })
+  }
+  static modificationDelete(params: any) {
+    return request.post<Api.Common.AddResponse>({
+      url: '/crm/modification/destroy',
+      params
+    })
+  }
 }

src/components/custom/OrderDetailContent.vue

@@ -63,9 +63,9 @@
               <th class="col-discount">FOB运费</th>
               <th class="col-discount">港杂费</th>
               <th class="col-discount">海运费</th>
-              <th class="col-discount">单价(美金)</th>
+              <th class="col-discount">单价</th>
-              <th class="col-discount">总价(美金)</th>
+              <th class="col-discount">总价</th>
-              <th class="col-discount">利润(美金)</th>
+              <th class="col-discount">利润</th>
             </tr>
           </thead>
           <tbody>

src/composables/useStockingForm.ts

@@ -183,10 +183,10 @@ export function useStockingForm(isFinal = false, stockingId?: string | number) {
     mileage: 0,
     listing_price: undefined,
     listing_price_currency: 'CNY',
-    listing_price_currency_snapshot: '',
+    listing_price_currency_snapshot: '人民币',
     reduction_price: undefined,
     reduction_price_currency: 'CNY',
-    reduction_price_currency_snapshot: '',
+    reduction_price_currency_snapshot: '人民币',
     color_interior_code: '',
     color_interior_snapshot: '',
     color_exterior_code: '',
@@ -197,38 +197,38 @@ export function useStockingForm(isFinal = false, stockingId?: string | number) {
     port_misc_fee: '',
     ocean_freight: '',
     ocean_freight_currency: 'CNY',
-    ocean_freight_currency_snapshot: '',
+    ocean_freight_currency_snapshot: '人民币',
     retrofit_fee: '',
     total_price: undefined,
     official_price: undefined,
     discount_price: undefined,
     fob_fee: undefined,
     fob_fee_currency: 'CNY',
-    fob_fee_currency_snapshot: '',
+    fob_fee_currency_snapshot: '人民币',
     helper_fee: undefined,
     helper_fee_currency: 'CNY',
-    helper_fee_currency_snapshot: '',
+    helper_fee_currency_snapshot: '人民币',
     domestic_freight: undefined,
     domestic_freight_currency: 'CNY',
-    domestic_freight_currency_snapshot: '',
+    domestic_freight_currency_snapshot: '人民币',
     port_fee: undefined,
     port_fee_currency: 'CNY',
-    port_fee_currency_snapshot: '',
+    port_fee_currency_snapshot: '人民币',
     unit_price_currency: 'CNY',
-    unit_price_currency_snapshot: '',
+    unit_price_currency_snapshot: '人民币',
     total_price_currency: 'CNY',
-    total_price_currency_snapshot: '',
+    total_price_currency_snapshot: '人民币',
     guide_price_currency: 'CNY',
-    guide_price_currency_snapshot: '',
+    guide_price_currency_snapshot: '人民币',
     discount: undefined,
     discount_currency: 'CNY',
-    discount_currency_snapshot: '',
+    discount_currency_snapshot: '人民币',
     contract_rate: 7.16,
     profit: undefined,
     modify_ids: [],
     modify_list: [],
     modify_fee_currency: 'CNY',
-    modify_fee_currency_snapshot: ''
+    modify_fee_currency_snapshot: '人民币'
   })
 
   // 创建新的收款项
@@ -237,7 +237,7 @@ export function useStockingForm(isFinal = false, stockingId?: string | number) {
     remit_country_name_snapshot: '',
     remit_date: '',
     currency_code: 'CNY',
-    currency_name_snapshot: '',
+    currency_name_snapshot: '人民币',
     account_id: '',
     account_name_snapshot: '',
     remitter_name: '',

src/views/admin/system/menu/index.vue

@@ -190,7 +190,11 @@
               </ElCol>
               <ElCol :span="5">
                 <ElFormItem label="是否隐藏" prop="is_hide">
-                  <ElSwitch v-model="form.is_hide" :active-value="1" :inactive-value="0"></ElSwitch>
+                  <ElSwitch
+                    v-model="form.is_hide"
+                    :active-value="true"
+                    :inactive-value="false"
+                  ></ElSwitch>
                 </ElFormItem>
               </ElCol>
               <ElCol :span="5">

src/views/admin/user/user_info.vue

@@ -319,11 +319,11 @@
       label: '未知'
     },
     {
-      value: '1',
+      value: 1,
       label: '男'
     },
     {
-      value: '2',
+      value: 2,
       label: '女'
     }
   ]

src/views/admin/vehicle/brand.vue

@@ -79,11 +79,12 @@
             <div class="type-pagination">
               <el-pagination
                 background
-                layout="total, sizes, prev, pager, next"
+                layout="total, prev, pager, next"
                 :current-page="brandPagination.currentPage"
                 :page-size="brandPagination.pageSize"
                 :total="brandPagination.total"
                 :page-sizes="[10, 20, 30, 50]"
+                :pager-count="4"
                 @current-change="handleBrandCurrentChange"
                 @size-change="handleBrandSizeChange"
               />
@@ -231,10 +232,9 @@
               disabled
             />
           </ElFormItem>
-          <ElFormItem label="系列编码" prop="series_code">
+          <!-- <ElFormItem label="系列编码" prop="series_code">
-            <!-- <ElInput v-model="seriesForm.series_code" :disabled="seriesDialogType === 'edit'" /> -->
             <ElInput v-model="seriesForm.series_code" />
-          </ElFormItem>
+          </ElFormItem> -->
           <ElFormItem label="系列名称" prop="series_name">
             <ElInput v-model="seriesForm.series_name" />
           </ElFormItem>
@@ -418,7 +418,6 @@
     status: 1
   })
   const seriesRules = reactive<FormRules>({
-    series_code: [{ required: true, message: '请输入系列编码', trigger: 'blur' }],
     series_name: [{ required: true, message: '请输入系列名称', trigger: 'blur' }]
   })
 
@@ -488,7 +487,6 @@
       if (seriesDialogType.value === 'add') {
         const { message } = await vehicleService.seriesAdd({
           brand_id: activeBrand.value.id,
-          series_code: seriesForm.series_code,
           series_name: seriesForm.series_name,
           description: seriesForm.description,
           sort: seriesForm.sort,
@@ -499,7 +497,6 @@
         const { message } = await vehicleService.seriesEdit({
           id: seriesForm.id,
           brand_id: activeBrand.value.id,
-          series_code: seriesForm.series_code,
           series_name: seriesForm.series_name,
           description: seriesForm.description,
           sort: seriesForm.sort,

src/views/admin/vehicle/color.vue

@@ -105,17 +105,17 @@
       width="600px"
     >
       <ElForm ref="formRef" :model="form" :rules="rules" label-width="100px" class="form">
-        <ElFormItem label="颜色编码" prop="color_code">
+        <ElFormItem label="颜色编码" prop="color_code" v-if="dialogType === 'edit'">
-          <ElInput v-model="form.color_code" placeholder="请输入颜色编码" />
+          <ElInput v-model="form.color_code" disabled placeholder="请输入颜色编码" />
         </ElFormItem>
         <ElFormItem label="颜色名称" prop="color_text">
           <ElInput v-model="form.color_text" placeholder="请输入颜色名称" />
         </ElFormItem>
         <ElFormItem label="类型" prop="type">
-          <el-select v-model="form.type" placeholder="请选择颜色类型" style="width: 100%">
+          <el-radio-group v-model="form.type">
-            <el-option label="外观颜色" :value="1" />
+            <el-radio :label="1">外观颜色</el-radio>
-            <el-option label="内饰颜色" :value="2" />
+            <el-radio :label="2">内饰颜色</el-radio>
-          </el-select>
+          </el-radio-group>
         </ElFormItem>
         <ElFormItem label="排序" prop="sort">
           <ElInputNumber v-model="form.sort" :min="0" :max="999" style="width: 100%" />
@@ -164,7 +164,6 @@
 
   // 表单验证规则
   const rules = reactive<FormRules>({
-    color_code: [{ required: true, message: '请输入颜色编码', trigger: 'blur' }],
     color_text: [{ required: true, message: '请输入颜色名称', trigger: 'blur' }],
     type: [{ required: true, message: '请选择颜色类型', trigger: 'change' }]
   })
@@ -287,7 +286,6 @@
         if (dialogType.value === 'add') {
           // 新增
           const { message } = await vehicleService.colorAdd({
-            color_code: form.color_code,
             color_text: form.color_text,
             type: form.type,
             status: form.status,
@@ -298,7 +296,6 @@
           // 编辑
           const { message } = await vehicleService.colorEdit({
             id: form.id,
-            color_code: form.color_code,
             color_text: form.color_text,
             type: form.type,
             status: form.status,

src/views/admin/vehicle/modification.vue

@@ -87,8 +87,8 @@
       width="600px"
     >
       <ElForm ref="formRef" :model="form" :rules="rules" label-width="100px" class="form">
-        <ElFormItem label="项目编码" prop="code">
+        <ElFormItem label="项目编码" prop="code" v-if="dialogType === 'edit'">
-          <ElInput v-model="form.code" placeholder="请输入改装项目编码" />
+          <ElInput v-model="form.code" disabled placeholder="请输入改装项目编码" />
         </ElFormItem>
         <ElFormItem label="项目名称" prop="name">
           <ElInput v-model="form.name" placeholder="请输入改装项目名称" />
@@ -149,7 +149,6 @@
 
   // 表单验证规则
   const rules = reactive<FormRules>({
-    code: [{ required: true, message: '请输入改装项目编码', trigger: 'blur' }],
     name: [{ required: true, message: '请输入改装项目名称', trigger: 'blur' }],
     type: [{ required: true, message: '请选择改装类型', trigger: 'change' }]
   })
@@ -263,7 +262,6 @@
         if (dialogType.value === 'add') {
           // 新增
           const { message } = await vehicleService.modificationAdd({
-            code: form.code,
             name: form.name,
             type: form.type,
             status: form.status,
@@ -274,7 +272,6 @@
           // 编辑
           const { message } = await vehicleService.modificationEdit({
             id: form.id,
-            code: form.code,
             name: form.name,
             type: form.type,
             status: form.status,

src/views/auth/login/index.vue

@@ -36,11 +36,11 @@
         <div class="form">
           <!-- 登录方式切换 tab -->
           <div class="login-type-tabs">
-            <span
+            <!-- <span
               :class="{ active: activeLoginType === 'password' }"
               @click="activeLoginType = 'password'"
               >账号密码登录</span
-            >
+            > -->
             <span
               :class="{ active: activeLoginType === 'qrcode' }"
               @click="activeLoginType = 'qrcode'"

src/views/crmpc/stocking/Add.vue

@@ -442,7 +442,13 @@
               >
                 新增
               </el-tag>
-              <el-tag type="danger" effect="light" @click="removeRow(idx)" v-if="items.length > 1">
+              <el-tag
+                type="danger"
+                effect="light"
+                class="row-actions"
+                @click="removeRow(idx)"
+                v-if="items.length > 1"
+              >
                 删除
               </el-tag>
             </ElCol>
@@ -854,7 +860,13 @@
           <ElTableColumn label="客户名称" prop="contacts" />
           <ElTableColumn label="客户编码" prop="code" />
           <ElTableColumn label="电话" prop="phone" />
-          <ElTableColumn label="公司" prop="company" />
+          <ElTableColumn label="公司" prop="company">
+            <template #default="scope">
+              <div>{{
+                scope.row.company == '' || scope.row.company == '0' ? ' --' : scope.row.company
+              }}</div>
+            </template>
+          </ElTableColumn>
           <ElTableColumn label="操作" width="80" align="center" fixed="right">
             <template #default="scope">
               <ElButton link type="primary" @click="chooseCustomer(scope.row)">选择</ElButton>

src/views/crmpc/stocking/final_add.vue

@@ -740,10 +740,19 @@
     <div class="form-card">
       <!-- 底部信息 -->
       <div class="submit-wrap">
-        <ElButton type="primary" plain size="large" class="submit-btn" @click="handleSubmit(0)"
+        <ElButton
+          type="primary"
+          plain
+          size="large"
+          class="submit-btn"
+          @click="handleSubmit(0, undefined, '1')"
           >保存</ElButton
         >
-        <ElButton type="primary" size="large" class="submit-btn" @click="handleSubmit(1)"
+        <ElButton
+          type="primary"
+          size="large"
+          class="submit-btn"
+          @click="handleSubmit(1, undefined, '1')"
           >提交</ElButton
         >
       </div>
@@ -836,7 +845,13 @@
           <ElTableColumn label="客户名称" prop="contacts" />
           <ElTableColumn label="客户编码" prop="code" />
           <ElTableColumn label="电话" prop="phone" />
-          <ElTableColumn label="公司" prop="company" />
+          <ElTableColumn label="公司" prop="company">
+            <template #default="scope">
+              <div>{{
+                scope.row.company == '' || scope.row.company == '0' ? ' --' : scope.row.company
+              }}</div>
+            </template>
+          </ElTableColumn>
           <ElTableColumn label="操作" width="80" align="center" fixed="right">
             <template #default="scope">
               <ElButton link type="primary" @click="chooseCustomer(scope.row)">选择</ElButton>

src/views/crmpc/stocking/final_edit.vue

@@ -925,7 +925,13 @@
           <ElTableColumn label="客户名称" prop="contacts" />
           <ElTableColumn label="客户编码" prop="code" />
           <ElTableColumn label="电话" prop="phone" />
-          <ElTableColumn label="公司" prop="company" />
+          <ElTableColumn label="公司" prop="company">
+            <template #default="scope">
+              <div>{{
+                scope.row.company == '' || scope.row.company == '0' ? ' --' : scope.row.company
+              }}</div>
+            </template>
+          </ElTableColumn>
           <ElTableColumn label="操作" width="80" align="center" fixed="right">
             <template #default="scope">
               <ElButton link type="primary" @click="chooseCustomer(scope.row)">选择</ElButton>

src/views/crmpc/stocking/stocking_edit.vue

@@ -430,12 +430,23 @@
             </ElCol>
           </ElRow>
           <ElRow :gutter="12">
-            <ElCol :span="24" class="row-actions">
+            <ElCol :span="24" style="text-align: right">
-              <el-tag effect="light" type="success" @click="copyRow(idx)"> 复制 </el-tag>
+              <el-tag effect="light" class="row-actions" type="success" @click="copyRow(idx)"> 复制 </el-tag>
-              <el-tag effect="light" @click="addRowAfter(idx)" v-if="idx == items.length - 1">
+              <el-tag
+                effect="light"
+                class="row-actions"
+                @click="addRowAfter(idx)"
+                v-if="idx == items.length - 1"
+              >
                 新增
               </el-tag>
-              <el-tag type="danger" effect="light" @click="removeRow(idx)" v-if="items.length > 1">
+              <el-tag
+                type="danger"
+                class="row-actions"
+                effect="light"
+                @click="removeRow(idx)"
+                v-if="items.length > 1"
+              >
                 删除
               </el-tag>
             </ElCol>
@@ -835,7 +846,13 @@
           <ElTableColumn label="客户名称" prop="contacts" />
           <ElTableColumn label="客户编码" prop="code" />
           <ElTableColumn label="电话" prop="phone" />
-          <ElTableColumn label="公司" prop="company" />
+          <ElTableColumn label="公司" prop="company">
+            <template #default="scope">
+              <div>{{
+                scope.row.company == '' || scope.row.company == '0' ? ' --' : scope.row.company
+              }}</div>
+            </template>
+          </ElTableColumn>
           <ElTableColumn label="操作" width="80" align="center" fixed="right">
             <template #default="scope">
               <ElButton link type="primary" @click="chooseCustomer(scope.row)">选择</ElButton>
@@ -991,10 +1008,7 @@
   }
 
   .row-actions {
-    display: flex;
+    margin-left: 8px;
-    align-items: center;
-    gap: 8px;
-    justify-content: flex-end;
   }
   /* 利润为负数时，输入文字变红（兼容 Element Plus disabled 样式） */
   :deep(.profit-negative .el-input__wrapper) {
@@ -1008,18 +1022,6 @@
     background-color: var(--el-fill-color-blank) !important;
     box-shadow: 0 0 0 1px var(--el-input-border-color, #dcdfe6) inset !important;
   }
-  .row-actions span {
-    font-size: 12px;
-    cursor: pointer;
-  }
-  .row-actions .primary {
-    color: var(--el-color-primary);
-    cursor: pointer;
-  }
-  .row-actions .danger {
-    color: var(--el-color-danger);
-    cursor: pointer;
-  }
 
   .submit-wrap {
     display: flex;

src/views/crmpc/vehicle/color.vue

@@ -105,9 +105,8 @@
       width="600px"
     >
       <ElForm ref="formRef" :model="form" :rules="rules" label-width="100px" class="form">
-        <ElFormItem label="颜色编码" prop="color_code">
+        <ElFormItem label="颜色编码" prop="color_code" v-if="dialogType === 'edit'">
-          <ElInput v-model="form.color_code" placeholder="请输入颜色编码" />
+          <ElInput v-model="form.color_code" disabled placeholder="请输入颜色编码" />
-          <el-text class="mx-1" type="warning">请输入颜色的英文名称</el-text>
         </ElFormItem>
         <ElFormItem label="颜色名称" prop="color_text">
           <ElInput v-model="form.color_text" placeholder="请输入颜色名称" />
@@ -165,7 +164,6 @@
 
   // 表单验证规则
   const rules = reactive<FormRules>({
-    color_code: [{ required: true, message: '请输入颜色编码', trigger: 'blur' }],
     color_text: [{ required: true, message: '请输入颜色名称', trigger: 'blur' }],
     type: [{ required: true, message: '请选择颜色类型', trigger: 'change' }]
   })
@@ -288,7 +286,6 @@
         if (dialogType.value === 'add') {
           // 新增
           const { message } = await vehicleService.colorAdd({
-            color_code: form.color_code,
             color_text: form.color_text,
             type: form.type,
             status: form.status,
@@ -299,7 +296,6 @@
           // 编辑
           const { message } = await vehicleService.colorEdit({
             id: form.id,
-            color_code: form.color_code,
             color_text: form.color_text,
             type: form.type,
             status: form.status,

src/views/crmpc/vehicle/modification.vue

@@ -0,0 +1,361 @@
+<template>
+  <div class="modification-page">
+    <div class="modification-toolbar boxshadow">
+      <div class="modification-search-group">
+        <el-form-item label="关键字:" label-width="70px">
+          <el-input
+            style="min-width: 120px"
+            v-model="keyword"
+            placeholder="请输入关键字"
+            clearable
+            @keyup.enter="getModificationList"
+          />
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="getModificationList" v-ripple>搜索</el-button>
+        </el-form-item>
+      </div>
+    </div>
+    <div class="boxshadow">
+      <ElRow>
+        <div style="width: 12px"></div>
+        <ElCol :xs="24" :sm="12" :lg="6" class="el-col2">
+          <ElButton
+            @click="showDialog('add')"
+            v-ripple
+            v-if="hasAuth('modification@add')"
+            type="primary"
+          >
+            新增改装项目
+          </ElButton>
+        </ElCol>
+      </ElRow>
+      <ArtTable
+        ref="tableRef"
+        row-key="id"
+        :loading="loading"
+        :data="tableData"
+        :currentPage="pagination.currentPage"
+        :pageSize="pagination.pageSize"
+        :total="pagination.total"
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+      >
+        <template #default>
+          <ElTableColumn label="项目编码" prop="code" min-width="120" />
+          <ElTableColumn label="项目名称" prop="name" min-width="150" />
+          <ElTableColumn label="改装类型" prop="type" width="120">
+            <template #default="scope">
+              <ElTag :type="getTypeTagType(scope.row.type)">
+                {{ getTypeLabel(scope.row.type) }}
+              </ElTag>
+            </template>
+          </ElTableColumn>
+          <ElTableColumn label="排序" prop="sort" width="80" />
+          <ElTableColumn label="状态" prop="status" width="100">
+            <template #default="scope">
+              <ElTag :type="scope.row.status ? 'success' : 'info'">
+                {{ scope.row.status ? '启用' : '停用' }}
+              </ElTag>
+            </template>
+          </ElTableColumn>
+          <ElTableColumn label="创建时间" prop="created_at" min-width="160" />
+          <ElTableColumn fixed="right" label="操作" width="200px">
+            <template #default="scope">
+              <ElRow>
+                <el-button
+                  link
+                  @click="showDialog('edit', scope.row)"
+                  v-if="hasAuth('modification@update')"
+                  >编辑</el-button
+                >
+                <el-button
+                  type="danger"
+                  link
+                  @click="deleteModification(scope.row)"
+                  v-if="hasAuth('modification@destroy')"
+                >
+                  删除
+                </el-button>
+              </ElRow>
+            </template>
+          </ElTableColumn>
+        </template>
+      </ArtTable>
+    </div>
+
+    <!-- 新增/编辑对话框 -->
+    <ElDialog
+      v-model="dialogVisible"
+      :title="dialogType === 'add' ? '新增改装项目' : '编辑改装项目'"
+      align-center
+      width="600px"
+    >
+      <ElForm ref="formRef" :model="form" :rules="rules" label-width="100px" class="form">
+        <ElFormItem label="项目编码" prop="code" v-if="dialogType === 'edit'">
+          <ElInput v-model="form.code" disabled placeholder="请输入改装项目编码" />
+        </ElFormItem>
+        <ElFormItem label="项目名称" prop="name">
+          <ElInput v-model="form.name" placeholder="请输入改装项目名称" />
+        </ElFormItem>
+        <ElFormItem label="改装类型" prop="type">
+          <el-select v-model="form.type" placeholder="请选择改装类型" style="width: 100%">
+            <el-option label="外观改装" :value="1" />
+            <el-option label="性能改装" :value="2" />
+            <el-option label="内饰改装" :value="3" />
+            <el-option label="电子设备" :value="4" />
+            <el-option label="其他" :value="5" />
+          </el-select>
+        </ElFormItem>
+        <ElFormItem label="排序" prop="sort">
+          <ElInputNumber v-model="form.sort" :min="0" :max="999" style="width: 100%" />
+        </ElFormItem>
+        <ElFormItem label="状态">
+          <ElSwitch v-model="form.status" :active-value="1" :inactive-value="0" />
+        </ElFormItem>
+      </ElForm>
+      <template #footer>
+        <div class="dialog-footer">
+          <ElButton @click="dialogVisible = false">取消</ElButton>
+          <ElButton type="primary" @click="handleSubmit(formRef)">提交</ElButton>
+        </div>
+      </template>
+    </ElDialog>
+  </div>
+</template>
+
+<script setup lang="ts">
+  import { ElMessage, ElMessageBox } from 'element-plus'
+  import type { FormInstance, FormRules } from 'element-plus'
+  import { vehicleService } from '@/api/crmpc/vehicleApi'
+  import { useAuth } from '@/composables/useAuth'
+
+  const { hasAuth } = useAuth()
+  defineOptions({ name: 'CrmVehicleModification' })
+
+  // 响应式数据
+  const loading = ref(false)
+  const dialogVisible = ref(false)
+  const dialogType = ref('add')
+  const formRef = ref<FormInstance>()
+  const keyword = ref<string>('')
+  const typeFilter = ref<number | undefined>(undefined)
+  const statusFilter = ref<number | undefined>(undefined)
+
+  // 表单数据
+  const form = reactive<any>({
+    id: '',
+    code: '',
+    name: '',
+    type: 1,
+    status: 1,
+    sort: 0
+  })
+
+  // 表单验证规则
+  const rules = reactive<FormRules>({
+    name: [{ required: true, message: '请输入改装项目名称', trigger: 'blur' }],
+    type: [{ required: true, message: '请选择改装类型', trigger: 'change' }]
+  })
+
+  // 分页数据
+  const pagination = reactive({
+    currentPage: 1,
+    pageSize: 10,
+    total: 0
+  })
+
+  // 表格数据
+  const tableData = ref<any[]>([])
+  const tableRef = ref()
+
+  // 生命周期
+  onMounted(() => {
+    getModificationList()
+  })
+
+  // 监听搜索条件变化
+  watch([keyword, typeFilter, statusFilter], () => {
+    pagination.currentPage = 1
+    getModificationList()
+  })
+
+  // 获取改装项目列表
+  const getModificationList = async () => {
+    loading.value = true
+    try {
+      const { currentPage, pageSize } = pagination
+      const params = {
+        current: currentPage,
+        size: pageSize,
+        keyword: keyword.value
+      }
+
+      const { records, current, size, total } = await vehicleService.getModificationList(params)
+      tableData.value = records || []
+      Object.assign(pagination, { currentPage: current, pageSize: size, total })
+    } catch (error) {
+      console.error('获取改装项目列表失败:', error)
+      ElMessage.error('获取改装项目列表失败')
+    } finally {
+      loading.value = false
+    }
+  }
+
+  // 处理分页变化
+  const handleSizeChange = (newPageSize: number) => {
+    pagination.pageSize = newPageSize
+    getModificationList()
+  }
+
+  const handleCurrentChange = (newCurrentPage: number) => {
+    pagination.currentPage = newCurrentPage
+    getModificationList()
+  }
+
+  // 显示对话框
+  const showDialog = (type: string, row?: any) => {
+    dialogVisible.value = true
+    dialogType.value = type
+    if (type === 'edit' && row) {
+      // 编辑模式
+      Object.assign(form, {
+        id: row.id,
+        code: row.code,
+        name: row.name,
+        type: row.type,
+        status: row.status,
+        sort: row.sort || 0
+      })
+    } else {
+      // 新增模式
+      Object.assign(form, {
+        id: '',
+        code: '',
+        name: '',
+        type: 1,
+        status: 1,
+        sort: 0
+      })
+    }
+  }
+
+  // 删除改装项目
+  const deleteModification = (row: any) => {
+    ElMessageBox.confirm('确定删除该改装项目吗？', '删除确认', {
+      confirmButtonText: '确定',
+      cancelButtonText: '取消',
+      type: 'error'
+    }).then(async () => {
+      try {
+        const { message } = await vehicleService.modificationDelete({ id: row.id })
+        ElMessage.success(message)
+        getModificationList()
+      } catch (error) {
+        console.error('删除失败:', error)
+        ElMessage.error('删除失败')
+      }
+    })
+  }
+
+  // 提交表单
+  const handleSubmit = async (formEl: FormInstance | undefined) => {
+    if (!formEl) return
+    await formEl.validate(async (valid) => {
+      if (!valid) return
+      try {
+        if (dialogType.value === 'add') {
+          // 新增
+          const { message } = await vehicleService.modificationAdd({
+            name: form.name,
+            type: form.type,
+            status: form.status,
+            sort: form.sort
+          })
+          ElMessage.success(message)
+        } else {
+          // 编辑
+          const { message } = await vehicleService.modificationEdit({
+            id: form.id,
+            name: form.name,
+            type: form.type,
+            status: form.status,
+            sort: form.sort
+          })
+          ElMessage.success(message)
+        }
+        dialogVisible.value = false
+        getModificationList()
+      } catch (error) {
+        console.error('操作失败:', error)
+        ElMessage.error('操作失败')
+      }
+    })
+  }
+
+  // 获取类型标签样式
+  const getTypeTagType = (type: number): 'primary' | 'success' | 'warning' | 'info' | 'danger' => {
+    const typeMap: Record<number, 'primary' | 'success' | 'warning' | 'info' | 'danger'> = {
+      1: 'primary', // 外观改装
+      2: 'success', // 性能改装
+      3: 'warning', // 内饰改装
+      4: 'info', // 电子设备
+      5: 'danger' // 其他
+    }
+    return typeMap[type] || 'info'
+  }
+
+  // 获取类型标签文本
+  const getTypeLabel = (type: number) => {
+    const typeMap: Record<number, string> = {
+      1: '外观改装',
+      2: '性能改装',
+      3: '内饰改装',
+      4: '电子设备',
+      5: '其他'
+    }
+    return typeMap[type] || '未知类型'
+  }
+</script>
+
+<style lang="scss" scoped>
+  :deep(.el-table__empty-block) {
+    height: 100% !important;
+    min-height: 200px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .modification-page {
+    background: var(--art-main-bg-color);
+    min-height: 100vh;
+  }
+
+  .modification-toolbar {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 16px;
+    padding: 20px 20px;
+    background: var(--art-main-bg-color);
+  }
+
+  .modification-search-group {
+    display: flex;
+    gap: 12px;
+    align-items: center;
+  }
+
+  .form {
+    padding: 20px 0;
+  }
+
+  .dialog-footer {
+    text-align: right;
+  }
+
+  .el-col2 {
+    margin-bottom: 16px;
+  }
+</style>