Bladeren bron

feat(system): 添加道具管理图片展示和优化表单功能

- 新增表格列显示道具图片,支持预览功能
- 激活被注释的删除按钮功能
- 移除图标上传组件的查看模式禁用限制
- 添加isGiveAway字段到表单初始化数据
- 修复编辑时effectiveType数据类型转换问题
- 更新getType接口返回类型定义,统一typeValue字段类型
- 添加effectiveType字段到ItemsVO类型定义
fugui001 1 week geleden
bovenliggende
commit
db785210e2
2 gewijzigde bestanden met toevoegingen van 24 en 12 verwijderingen
  1. 2 2
      src/api/system/business/items/types.ts
  2. 22 10
      src/views/system/business/items/index.vue

+ 2 - 2
src/api/system/business/items/types.ts

@@ -29,7 +29,7 @@ export interface ItemsVO {
    */
   updatedAt: string;
   itemUrl: string;
-
+  effectiveType: string;
   itemsPrizeList?: ItemsPrize[];
 }
 
@@ -79,7 +79,7 @@ export interface ItemsForm extends BaseEntity {
 
   itemCount?: number;
 
-  effectiveType?: number;
+  effectiveType?: string;
 
   effectiveDay?: number;
 

+ 22 - 10
src/views/system/business/items/index.vue

@@ -50,6 +50,19 @@
         <el-table-column label="主类型" align="center" prop="giftTypeParentName" />
         <el-table-column label="子类型" align="center" prop="giftTypeChildName" />
         <el-table-column label="道具名称" align="center" prop="name" />
+        <el-table-column label="图片" align="center" width="90">
+          <template #default="scope">
+            <el-image
+              v-if="scope.row.itemUrl"
+              :src="scope.row.itemUrl"
+              style="width: 40px; height: 40px; border-radius: 4px; cursor: zoom-in"
+              :preview-src-list="[scope.row.itemUrl]"
+              :preview-teleported="true"
+              fit="cover"
+            />
+            <span v-else></span>
+          </template>
+        </el-table-column>
         <el-table-column label="类型值" align="center" prop="itemType" />
         <el-table-column label="积分值" align="center" prop="itemValue" />
         <el-table-column label="道具描述" align="center" prop="itemDesc" />
@@ -66,9 +79,9 @@
             <el-tooltip content="修改" placement="top">
               <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['business:items:edit']"></el-button>
             </el-tooltip>
-            <!--            <el-tooltip content="删除" placement="top">
+            <el-tooltip content="删除" placement="top">
               <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['business:items:remove']"></el-button>
-            </el-tooltip>-->
+            </el-tooltip>
           </template>
         </el-table-column>
       </el-table>
@@ -102,10 +115,9 @@
               :file-list="iconFileList"
               :auto-upload="false"
               accept="image/*"
-              :disabled="dialog.mode === 'view'"
             >
               <template #trigger>
-                <el-button type="primary" :disabled="dialog.mode === 'view'">点击选择图标</el-button>
+                <el-button type="primary">点击选择图标</el-button>
               </template>
 
               <!-- 预览图区域 -->
@@ -148,7 +160,6 @@
         <el-form-item label="有效天数" prop="itemValue" v-if="form.effectiveType === '2'">
           <el-input v-model="form.effectiveDay" placeholder="请输入有效天数" />
         </el-form-item>
-
         <el-form-item label="过期时间" prop="expireTime" v-if="[1, 3].includes(Number(form.effectiveType))">
           <el-date-picker
             v-model="form.expireTime"
@@ -236,7 +247,8 @@ const initFormData: ItemsForm = {
   itemValue: undefined,
   createdAt: undefined,
   updatedAt: undefined,
-  itemTypeCode: '1'
+  itemTypeCode: '1',
+  isGiveAway: 0
 };
 const data = reactive<PageData<ItemsForm, ItemsQuery>>({
   form: { ...initFormData },
@@ -329,6 +341,7 @@ const handleUpdate = async (row?: ItemsVO) => {
   const _id = row?.id || ids.value[0];
   const res = await getItems(_id);
   Object.assign(form.value, res.data);
+  form.value.effectiveType = String(res.data.effectiveType);
   // 处理奖励表单数据
   const prizeItems = res.data.itemsPrizeList || [];
   if (prizeItems.length > 0) {
@@ -410,7 +423,6 @@ const submitForm = () => {
           quantity: Number(reward.quantity)
         }))
       };
-      debugger;
       if (form.value.id) {
         await updateItems(formData).finally(() => (buttonLoading.value = false));
       } else {
@@ -547,17 +559,17 @@ const onParentChange = async (parentId: number | string | null) => {
       const res2 = await getType(parentId);
       if (res2.code === 200) {
         // ✅ data2 是单个对象,不是数组!
-        const data2 = res2.data as unknown as { id: number; name: string; typeCode?: string };
+        const data2 = res2.data as unknown as { id: number; name: string; typeCode?: string; typeValue?: number };
 
         // ✅ 直接访问 typeCode 字段(注意字段名是 typeCode,不是 type_code)
         if (data2.typeCode === 'combo_package') {
-          debugger;
           form.value.itemTypeCode = '2'; // 设置为服务包类型
           await nextTick();
         } else {
           form.value.itemTypeCode = '1'; // 默认设置为普通类型
           await nextTick();
         }
+        form.value.itemType = data2.typeValue;
       }
     }
     //是否是服务包 如果他的 type_code = combo_package
@@ -572,7 +584,7 @@ const onParentChildChange = async (parentId: number | string | null) => {
     const res2 = await getType(parentId);
     if (res2.code === 200) {
       // ✅ data2 是单个对象,不是数组!
-      const data2 = res2.data as unknown as { id: number; name: string; typeValue?: string };
+      const data2 = res2.data as unknown as { id: number; name: string; typeValue?: number };
       form.value.itemType = data2.typeValue;
     }
     //是否是服务包 如果他的 type_code = combo_package