更新礼物标签页面

src/views/gift/giftClassif/form.vue

@@ -36,15 +36,15 @@ defineExpose({ getRef });
 
 <template>
   <el-form ref="ruleFormRef" :model="newFormInline" :rules="formRules" label-width="120px">
-    <el-form-item label="分类" prop="tid">
+    <el-form-item label="礼物分类" prop="tid">
-      <el-select v-model="newFormInline.tid" placeholder="请选择分类">
+      <el-select v-model="newFormInline.tid" placeholder="请选择礼物分类">
         <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
         </el-option>
       </el-select>
     </el-form-item>
 
-    <el-form-item label="分类名称" prop="name">
+    <el-form-item label="标签名称" prop="name">
-      <el-input v-model="newFormInline.name" clearable placeholder="请输入分类名称" />
+      <el-input v-model="newFormInline.name" clearable placeholder="请输入标签名称" />
     </el-form-item>
     <el-form-item label="排序" prop="sort">
       <el-input-number v-model="newFormInline.sort"></el-input-number>

src/views/gift/giftClassif/hook.tsx

@@ -17,7 +17,7 @@ export function useData() {
     name: ""
   });
   const searchLabel = ref([
-    { label: "分类名称", prop: "name", type: "input" }
+    { label: "标签名称", prop: "name", type: "input" }
   ]);
   const pagination = ref({
     total: 0,
@@ -32,10 +32,15 @@ export function useData() {
     },
     {
       label: "排序",
-      prop: "sort"
+      prop: "sort",
+      width: 100
     },
     {
-      label: "分类名称",
+      label: "礼物分类",
+      prop: "type"
+    },
+    {
+      label: "标签名称",
       prop: "name"
     },
     {
@@ -75,7 +80,7 @@ export function useData() {
   const handleDelete = async rowData => {
     const { code } = await removeClassifyData({ id: rowData.id });
     if (code) {
-      message(`您删除了分类名称为${rowData.name}的这条数据`, {
+      message(`您删除了标签名称为${rowData.name}的这条数据`, {
         type: "success"
       });
       onSearch(searchForm.value);
@@ -84,7 +89,7 @@ export function useData() {
   // 新增
   const openDialog = (title = "新增", rowData: any) => {
     addDialog({
-      title: `${title}礼物分类`,
+      title: `${title}礼物标签`,
       props: {
         formInline: {
           sort: rowData?.sort ?? 0,

src/views/gift/giftClassif/index.vue

@@ -33,11 +33,11 @@ onMounted(() => {
   <div class="main">
     <SearchForm class="pb-2" :LabelList="searchLabel" :formData="searchForm" @handleSearch="onSearch" />
     <div ref="contentRef" :class="['flex', deviceDetection() ? 'flex-wrap' : '']">
-      <PureTableBar title="分类列表" :class="[isShow && !deviceDetection() ? '!w-[60vw]' : 'w-full']" :columns="tableLabel"
+      <PureTableBar title="标签列表" :class="[isShow && !deviceDetection() ? '!w-[60vw]' : 'w-full']" :columns="tableLabel"
         @refresh="onSearch">
         <template #buttons>
           <el-button type="primary" :icon="useRenderIcon(AddFill)" @click="openDialog('新增', {})">
-            新增分类
+            新增礼物标签
           </el-button>
         </template>
         <template v-slot="{ size, dynamicColumns }">
@@ -51,7 +51,7 @@ onMounted(() => {
               <el-button link type="primary" :size="size" @click="openDialog('编辑', row)">
                 编辑
               </el-button>
-              <el-popconfirm :title="`是否确认删除分类名称为${row.name}的这条数据`" @confirm="handleDelete(row)">
+              <el-popconfirm :title="`是否确认删除标签名称为${row.name}的这条数据`" @confirm="handleDelete(row)">
                 <template #reference>
                   <el-button link type="primary" :size="size"> 删除 </el-button>
                 </template>

src/views/gift/giftList/form.vue

@@ -54,9 +54,12 @@ const getTypeList = async () => {
   typeList.value = code ? data : []
 }
 const getLableList = async () => {
-  const { data, code } = await getGiftTypeOrLabel({ type: 2 })
+  const { data, code } = await getGiftTypeOrLabel({ type: 2, type_id: newFormInline.value.type || '' })
   labelList.value = code ? data : []
 }
+const changeType = () => {
+  getLableList()
+}
 onMounted(() => {
   getTypeList()
   getLableList()
@@ -70,12 +73,12 @@ defineExpose({ getRef });
       <el-input v-model="newFormInline.gift_name" clearable placeholder="请输入礼物名称" />
     </el-form-item>
     <el-form-item label="礼物类型" prop="type">
-      <el-select v-model="newFormInline.type" placeholder="请选择礼物类型">
+      <el-select v-model="newFormInline.type" placeholder="请选择礼物类型" @change="changeType">
         <el-option v-for="item in typeList" :key="item.id" :label="item.name" :value="item.id">
         </el-option>
       </el-select>
     </el-form-item>
-    <el-form-item label="礼物标签" prop="label" v-if="newFormInline.type === 1">
+    <el-form-item label="礼物标签" prop="label">
       <el-select v-model="newFormInline.label" placeholder="请选择礼物标签">
         <el-option v-for="item in labelList" :key="item.id" :label="item.name" :value="item.id">
         </el-option>

src/views/gift/giftList/hook.tsx

@@ -1,6 +1,7 @@
 import { ref, h } from "vue";
 import editForm from "./form.vue";
 import { message } from "@/utils/message";
+import { getGiftTypeOrLabel } from '@/api/modules/gift';
 import {
   queryGiftList,
   addGiftData,
@@ -9,7 +10,15 @@ import {
   getGiftInfo
 } from "@/api/modules/gift";
 import { addDialog } from "@/components/ReDialog";
+
 export function useData() {
+  const getLableList = async () => {
+    const { data, code } = await getGiftTypeOrLabel({ type: 2 })
+    searchLabel.value[searchLabel.value.length - 1].optionList = code ? data.map(ele => {
+      return { ...ele, label: ele.name, value: ele.id }
+    }) : []
+  }
+  getLableList()
   const formRef = ref();
   const loading = ref(true);
   const tableList = ref([]);
@@ -22,7 +31,22 @@ export function useData() {
   });
   const searchLabel = ref([
     { label: "礼物ID", prop: "search_gift_id", type: "input" },
-    { label: "礼物名称", prop: "search_gift_name", type: "input" }
+    { label: "礼物名称", prop: "search_gift_name", type: "input" },
+    {
+      label: "礼物分类", prop: "search_gift_type", type: "select", optionList: [
+        {
+          value: 1,
+          label: '普通礼物'
+        }, {
+          value: 2,
+          label: '盲盒礼物'
+        }, {
+          value: 3,
+          label: '礼包礼物'
+        }
+      ]
+    },
+    { label: "礼物标签", prop: "search_gift_label", type: "select", optionList: [] }
   ]);
   const pagination = ref({
     total: 0,