自定义卡券文案及新增卡券页面相关修改

src/views/agent/addCustomCoupon.vue

@@ -2,13 +2,13 @@
     <div class="main-content12 ">
         <div class="flex-common">
             <el-tabs v-model="curAddTab" class="">
-                <el-tab-pane :label="'新增'+item.name" v-for="item in numsList" :name="item.type" :key="item.name"></el-tab-pane>
+                <el-tab-pane :label="'新增'+item.name" v-for="(item,index) in numsList" :name="item.type" :key="index"></el-tab-pane>
             </el-tabs>
-            <div class="beforeNotice">
+            <div class="beforeNotice" v-if="curTabInfo">
-                <p class="noticeTop flex"><img src="@/assets/site/siteSemInfo_Icon.svg" alt=""> 时间卡使用说明</p>
+                <p class="noticeTop flex"><img src="@/assets/site/siteSemInfo_Icon.svg" alt=""> {{curTabInfo.name}}使用说明</p>
                 <div class="noticeBot column">
-                    <p>1. 使用规则：领卡用户在规定时间范围内，每天有免费次数，用完后当天不可再用，但第二天次数会重置。适用于名下所有站点。</p>
+                    <p>1. {{ curTabInfo.desc1 }}</p>
-                    <p>2. 开放范围：仅开放给图尼丁、CopyCheck、Grammarly、AI智能降重、AI范文、AI论文工具、AI校园写作、AI职业写作下的检测服务类型</p>
+                    <p>2. {{ curTabInfo.desc2 }}</p>
                 </div>
             </div>
             <el-form class="baseRule_wrap">
@@ -55,9 +55,10 @@
                     </div>
                   <div class="flex gap8">
                     <GuipSelect 
-
                     width="238px"
-                    :options="firstOptions" 
+                    :options="allData" 
+                    labelKey="name"
+                    valueKey="id"
                     v-model="firstSelected" 
                     label="适用服务类型"
                     @change="handleFirstChange"
@@ -66,6 +67,8 @@
                     <GuipSelect 
                     width="238px"
                     v-if="showSecondSelect"
+                    labelKey="name"
+                    valueKey="id"
                     :options="secondOptions" 
                     v-model="secondSelected"
                     ></GuipSelect>
@@ -118,29 +121,44 @@ export default {
     data() {
         return {
             searchDate:[],
-            curAddTab:'1',
+            curAddTab: this.$route.query.type || '1',
+            // curTabInfo:null,
             numsList:[
                 {
-                    name:'时间卡',
+                    name:'满减卡',
                     type:'1',
+                    desc1:'使用规则：领卡用户消费满额立减，永久有效。一张卡券只能使用一次，适用于名下所有站点。',
+                    desc2:'资金冻结：发卡即冻结面额资金；用户使用或卡券过期，资金解冻。CopyCheck不冻结资金，按单独约定结算。'
+                },
+
+                {
+                    name:'现金卡',
+                    type:'2',
+                    desc1:'使用规则：领卡用户使用无门槛、永久有效，每订单限用1张',
+                    desc2:'资金冻结：发卡即冻结面额资金；用户使用或卡券过期，资金解冻。CopyCheck不冻结资金，按单独约定结算。'
                 },
                 {
                     name:'次数卡',
-                    type:'2'
+                    type:'3',
+                    desc1:'使用规则：领卡用户使用无门槛、永久有效，每订单限用1张',
+                    desc2:'资金冻结：发卡即冻结面额资金；用户使用或卡券过期，资金解冻。CopyCheck不冻结资金，按单独约定结算。'
                 },
                 {
                     name:'折扣卡',
-                    type:'3'
+                    type:'4',
+                    title:'满减卡使用说明',
+                    desc1:'使用规则：领卡用户付款时按比例打折，每订单限用1张，每张检测卡限用1次。',
+                    desc2:'资金冻结：发卡即冻结面额资金；用户使用或卡券过期，资金解冻。CopyCheck不冻结资金，按单独约定结算。'
                 },
                 {
-                    name:'满减卡',
+                    name:'时间卡',
-                    type:'4'
+                    type:'5',
+                    title:'满减卡使用说明',
+                    desc1:'使用规则：领卡用户在规定时间范围内，每天有免费次数，用完后当天不可再用，但第二天次数会重置。适用于名下所有站点。',
+                    desc2:'开放范围：仅开放给图尼丁、CopyCheck、Grammarly、AI智能降重、AI范文、AI论文工具、AI校园写作、AI职业写作下的检测服务类型'
                 },
-                {
-                    name:'现金卡',
-                    type:'5'
-                }
             ],
+
             createType:1,
             createTypeList: [
                 {
@@ -244,17 +262,30 @@ export default {
         }
     },
     mounted() {
-        const { type } = this.$route.query;
+        // this.firstOptions = this.allData.map(item => ({
-        if (type) {
+        //     value: item.id,
-            this.curAddTab = type;
+        //     label: item.name
+        // }));
+    },
+    computed: {
+        // 计算当前tab的信息
+        curTabInfo() {
+            const tab = this.numsList.find(item => item.type == this.curAddTab);
+            return tab || this.numsList[0]; // 如果找不到，返回第一个
         }
-        this.firstOptions = this.allData.map(item => ({
-            value: item.id,
-            label: item.name
-        }));
     },
     watch: {
-       
+        '$route.query.type': function(newVal) {
+            if (newVal && newVal !== this.curAddTab) {
+                this.curAddTab = newVal;
+            }
+        },
+        curAddTab: {
+            handler(newVal) {
+                console.log('curAddTab变化:', newVal, '类型:', typeof newVal);
+            },
+            immediate: true
+        }
     },
     methods: {
         handleFirstChange(value) {
@@ -266,18 +297,19 @@ export default {
                 this.showSecondSelect = true;
                 
                 // 动态赋值二级选项
-                this.secondOptions = selectedItem.children.map(child => ({
+                this.secondOptions = selectedItem.children
-                value: child.id,
+                // .map(child => ({
-                label: child.name
+                // value: child.id,
-                }));
+                // label: child.name
+                // }));
                 
                 // 设置默认值为"不限服务"
                 const hasUnlimited = selectedItem.children.some(child => child.id === '0');
                 if (hasUnlimited) {
-                this.secondSelected = '0';
+                    this.secondSelected = '0';
                 } else if (this.secondOptions.length > 0) {
                 // 如果没有"不限服务"选项，默认选择第一个
-                this.secondSelected = this.secondOptions[0].value;
+                    this.secondSelected = this.secondOptions[0].value;
                 }
             } else {
                 // 没有二级数据，隐藏二级选择框并重置

src/views/agent/checkCardList.vue

@@ -18,15 +18,15 @@
                         :class="{ active: activeIndex === index }"
                         @mouseenter="handleMouseEnter(index)"
                         @mouseleave="handleMouseLeave"
-                        @click="handleClickItem(item)"
+                        >
-                    >
+                        <!-- @click="handleClickItem(item)" -->
-                        <span class="posFree">中一个亿</span>
+                        <span class="posFree">{{ item.tip }}</span>
                         <div class="flex gap8">
                             <img :src="item.img" alt="">
                             <span class="cardTitle">{{ item.name }}</span>
                         </div>
-                        <p>每天有免费使用次数，用完后当天不可再用，但第二天次数会重置</p>
+                        <p>{{ item.desc }}</p>
-                        <GuipButton :type="activeIndex === index ? 'primary' : 'often'" :btnstyle="{'width': '254px'}"  @click="addTimeNums" >立即新增</GuipButton>
+                        <GuipButton :type="activeIndex === index ? 'primary' : 'often'" :btnstyle="{'width': '254px'}"  @click="addTimeNums(item)" >立即新增</GuipButton>
                     </div>
                    
                 </div>
@@ -193,30 +193,41 @@ export default {
             activeIndex:-1,
             numsList1:[
                 {
-                    name:'时间卡',
+                    name:'满减卡',
+                    img:require('@/assets/shortNum.png'),
                     type:1,
-                    img:require('@/assets/timesNum.png')
+                    tip:'满额立减',
+                    desc:'消费达到指定金额（如100元），就能减免固定金额（如10元），每张卡只能用一次。',
+                },
+
+                {
+                    name:'现金卡',
+                    img:require('@/assets/cashNum.png'),
+                    type:2,
+                    tip:'直接抵现',
+                    desc:'可以把它当作现金直接使用，无最低消费要求。',
                 },
                 {
                     name:'次数卡',
+                    tip:'按次使用',
+                    desc:'卡内包含固定的使用次数，用完即止。',
                     img:require('@/assets/usageNum.png'),
-                    type:2
+                    type:3
                 },
                 {
                     name:'折扣卡',
+                    tip:'直接打折',
+                    desc:'付款时按一定比例（如9折）打折，每张卡在有效期内可多次使用。',
                     img:require('@/assets/discountNum.png'),
-                    type:3
-                },
-                {
-                    name:'满减卡',
-                    img:require('@/assets/shortNum.png'),
                     type:4
                 },
                 {
-                    name:'现金卡',
+                    name:'时间卡',
-                    img:require('@/assets/cashNum.png'),
+                    type:5,
-                    type:5
+                    tip:'次日焕新',
-                }
+                    desc:'每天有使用次数限制，用完后当天不可再用，但第二天会恢复次数。',
+                    img:require('@/assets/timesNum.png')
+                },
             ],
             walletList:[
                 {
@@ -289,11 +300,11 @@ export default {
             })
         },
         // 
-        addTimeNums() {
+        addTimeNums(item) {
             this.$router.push({
                 path: '/agent/addCustomCoupon',
                 query: {
-                    type: 1,
+                    type: item.type,
                 }
             })
         },