权益弹窗边界异常处理

src/views/insurancePolicy/modules/Equities.vue

@@ -238,8 +238,6 @@ watch(() => props.EquitiesInfo?.insFeeOrders, (newVal) => {
 // 组件挂载时获取地区数据
 onBeforeMount(async () => {
   await queryTreeQuery();
-  await getBenefitPackageList();
-  await getPrivilegeItem();
   provinceoptions.value = ['110000', '110100', '110101']
 
 });
@@ -260,8 +258,8 @@ const queryInfo = ref({
 const adjustDiscountAmountShow = ref(false)
 const availableAmount = ref('')//可用金额
 const insFeeOrders = ref(props.EquitiesInfo.insFeeOrders || {})
-const benefitPackageList = ref([]); //权益套餐列表
-const privilegeItem = ref([]); //权益单品列表
+const benefitPackageList = ref(); //权益套餐列表
+const privilegeItem = ref(); //权益单品列表
 const insOrderRightsPackageList = ref([]); //权益套餐选中列表
 const insOrderRightsList = ref([]); //权益单品选中列表
 const benefitPackageIndex = ref(null); //选中的权益套餐索引
@@ -437,18 +435,6 @@ const PackageBenefits = () => {
       .catch(() => {
       })
     return
-  }else{
-    if(benefitPackageList.value.length > 0){
-      // 有权益套餐，直接跳转到权益套餐页面
-      equitiesPageShow.value = true;
-    }else{
-      ElMessage({
-        type: 'warning',
-        message: '无权益套餐',
-        plain: true,
-      })
-      return
-    }
   }
   equitiesPageShow.value = true;
 }
@@ -472,18 +458,6 @@ const RightsBenefits = () => {
       .catch(() => {
       })
     return
-  }else{
-    if(privilegeItem.value.length > 0){
-      // 有权益单品，直接跳转到权益单品页面
-      equitiesItemShow.value = true;
-    }else{
-      ElMessage({
-        type: 'warning',
-        message: '无权益单品',
-        plain: true,
-      })
-      return
-    }
   }
   equitiesItemShow.value = true;
 }
@@ -601,29 +575,6 @@ const benefitDetail = (item: any) => {
   });
   console.log(item)
 }
-// 获取权益套餐列表
-const getBenefitPackageList = async () => {
-  queryInfo.value.maxPrice = props.EquitiesInfo.insFeeOrders.availableAmount;
-  try {
-    const response = await api.additionalApi.rightsGrantList(queryInfo.value);
-    if (response.code == '200' && response.data.records.length > 0) {
-      benefitPackageList.value = response.data.records || [];
-    } else {
-    }
-  } catch (error) {
-    console.error('获取权益套餐列表失败:', error);
-  }
-};
-// 获取权益单品列表
-const getPrivilegeItem = async () => {
-  queryInfo.value.maxPrice = props.EquitiesInfo.insFeeOrders.availableAmount;
-  try {
-    const response = await api.additionalApi.rightsList(queryInfo.value);
-    privilegeItem.value = response.data.records || [];
-  } catch (error) {
-    console.error('获取权益单品列表失败:', error);
-  }
-}
 </script>
 <!-- 样式区域 -->
 <style lang='scss' scoped>

src/views/insurancePolicy/modules/EquitiesItem.vue

@@ -159,8 +159,8 @@ const queryInfo = ref({
   pageNo: 1,
   pageSize: 20,
 });
-const benefitPackageList = ref(); //权益套餐列表
-const privilegeItem = ref(); //权益单品列表
+const benefitPackageList = ref([]); //权益套餐列表
+const privilegeItem = ref([]); //权益单品列表
 const totalPriceCount = computed(() => {
   // 计算权益单品的总价
   const itemTotal = privilegeItem.value?.reduce((sum: Decimal, item: any) => {
@@ -334,6 +334,14 @@ const benefitDetail = (item: any) => {
 const save = () => {
   console.log(privilegeItem.value)
   const selectedItems = privilegeItem.value?.filter((item: any) => item.rightsCount > 0) || []
+  if(selectedItems.length == 0){
+    ElMessage({
+      type: 'warning',
+      message: '请选择后再提交，不能直接提交',
+      plain: true,
+    })
+    return
+  }
   // 发送表单数据
   emits("save", selectedItems)
   emits('update:show', false);

src/views/insurancePolicy/modules/EquitiesPage.vue

@@ -47,12 +47,12 @@
       </div>
       <div class="flex mt-4  tab-btn">
         <div class="content flex  f-c ">
-          <div class="PackageselectedList mt-[16px] flex ">
+          <div class="PackageselectedList mt-[16px] flex " v-if="benefitPackageList.length > 0">
             <div class="view-card mr-[20px]">
               <div class="view-item mb-[10px] " :class="index == benefitPackageIndex ? 'view-card-item-active' : ''"
                 v-for="(item, index) in benefitPackageList" :key="item.id" @click="rightsDetails(item, index)">
                 <div class="flex f-c ">
-                  <span class="equityPackageName text-[14px] text-[#333]">权益名称权益名称权益名称权益名称益名称益名称
+                  <span class="equityPackageName text-[14px] text-[#333]">{{ item.packageName }}
                   </span>
                   <el-input-number size="small" :model-value="item.rightsCount" class="custom-input-number"
                     @update:model-value="val => onRightsCountChange(val, index, 'benefitPackageList', 'packagePrice')"
@@ -79,8 +79,8 @@
                 </div>
               </div>
             </div>
-            <el-table class="details" :data="selectedPackageDetail.rightsDetailsList" max-height="300px"  :header-cell-style="{ color: '#333333' }"
-              style="flex: 1;" border>
+            <el-table class="details" :data="selectedPackageDetail.rightsDetailsList" max-height="300px"
+              :header-cell-style="{ color: '#333333' }" style="flex: 1;" border>
               <el-table-column prop="rightsName" label="权益名称" width="180" align="center">
                 <template #default="scope">
                   <el-popover placement="right" trigger="hover" :width="324">
@@ -103,99 +103,11 @@
               <el-table-column prop="shareableStoreNum" label="适用门店" align="center"></el-table-column>
             </el-table>
           </div>
+          <div class="flex f-c a-c ">
+            <img src="@/assets/images/empty.png" alt="">
+            <span style="font-size: 14px;color: #909399;">暂无数据</span>
+          </div>
         </div>
-        <!-- <div class="tab-content">
-          <template >
-            <div class="flex ">
-              <div class="flex f-c a-c benefit">
-                <div class="benefitList flex f-c">
-                  <span class="item " v-for="(item, index) in benefitPackageList"
-                    :class="{ 'active': item.id == selectedPackageDetail.id }" :key="item.id"
-                    @click="rightsDetails(item, index)">{{
-                      item.equityPackageName }}</span>
-                </div>
-              </div>
-              <div class="benefitDetails" v-if="selectedPackageDetail.id">
-                <div class="header">
-                  <span class="title">套餐明细</span>
-                  <div class="configuration flex a-c j-s ">
-                    <span>数量：{{ selectedPackageDetail.totalNumber }}张</span>
-                    <span>价格：{{ selectedPackageDetail.packagePrice }}元</span>
-                    <el-input-number :model-value="selectedPackageDetail.rightsCount" :min="0"
-                      @update:model-value="val => onRightsCountChange(val, benefitPackageIndex, 'benefitPackageList', 'packagePrice')">
-                      <template #decrease-icon>
-                        <el-icon>
-                          <Remove />
-                        </el-icon>
-                      </template>
-<template #increase-icon>
-                        <el-icon>
-                          <CirclePlus />
-                        </el-icon>
-                      </template>
-</el-input-number>
-</div>
-</div>
-<div style="overflow-y: auto; max-height: 250px;"
-  v-if="selectedPackageDetail.rightsDetailsList && selectedPackageDetail.rightsDetailsList.length > 0">
-  <div class="Details-list">
-    <div class="view flex a-c  " v-for="item in selectedPackageDetail.rightsDetailsList">
-      <div class="item">{{ item.rightsName }}</div>
-      <div class="item">￥{{ item.contractRate }}元</div>
-    </div>
-  </div>
-</div>
-</div>
-</div>
-</template>
-<template>
-            <el-table :data="privilegeItem" style="width: 100%" max-height="300px" overflow="auto">
-              <el-table-column prop="rightsName" label="权益名称" width="180" align="center" />
-              <el-table-column prop="contractRate" label="单价" width="180" align="center" />
-              <el-table-column prop="rightsCount" label="发放数量" align="center">
-                <template #default="scope">
-                  <el-input-number size="small" :model-value="scope.row.rightsCount"
-                    @update:model-value="val => onRightsCountChange(val, scope.$index, 'privilegeItem', 'contractRate')"
-                    :min="0" />
-                </template>
-</el-table-column>
-<el-table-column prop="totalsum" label="总价" align="center">
-  <template #default="scope">
-                  <span>{{ scope.row.contractRate * scope.row.rightsCount }}</span>
-                </template>
-</el-table-column>
-</el-table>
-</template>
-
-</div>
-<div class="displaySelected ">
-  <span>可用金额：{{ props.availableAmount }}元</span>
-  <div class="header-sum flex a-c j-s ">
-    <span>已选{{ selectedRights.length }}个，共计{{ totalPriceCount }}元</span>
-    <el-button type="primary" size="small" link @click="clearSelectedRights">
-      <el-icon>
-        <Delete />
-      </el-icon>
-      清空</el-button>
-  </div>
-  <div class="selectedList flex f-c">
-    <div v-for="item in selectedRights" :key="item.rightsId" class="item">
-      <div class="flex f-c ">
-        <div class="flex a-c j-s">
-          <span class="equityPackageName">{{ item.equityPackageName || item.rightsName }}</span>
-          <span class="rightsCount">x{{ item.rightsCount }}</span>
-        </div>
-        <div class="mt-5 flex a-c j-s">
-          <span v-if="item.totalNumber">数量：{{ item.totalNumber }}张</span>
-          <span>价格：{{ item.packagePrice || item.contractRate }}元</span>
-          <el-icon @click="removeSelectedRight(item)">
-            <Delete />
-          </el-icon>
-        </div>
-      </div>
-    </div>
-  </div>
-</div> -->
       </div>
       <template #footer>
         <div class="dialog-footer flex a-c j-c ">
@@ -243,8 +155,8 @@ const queryInfo = ref({
   pageNo: 1,
   pageSize: 20,
 });
-const benefitPackageList = ref(); //权益套餐列表
-const privilegeItem = ref(); //权益单品列表
+const benefitPackageList = ref([]); //权益套餐列表
+const privilegeItem = ref([]); //权益单品列表
 const insOrderRightsPackageList = ref([]); //权益套餐选中列表
 const insOrderRightsList = ref([]); //权益单品选中列表
 const benefitPackageIndex = ref(0); //选中的权益套餐索引
@@ -361,7 +273,7 @@ const getBenefitPackageList = async () => {
       rightsDetails(response.data.records[0], 0);
     } else {
       ElMessage({
-        type: 'warning',
+        type: 'error',
         message: '暂无权益套餐',
         plain: true,
       })
@@ -451,7 +363,16 @@ const benefitDetail = (item: any) => {
   console.log(item)
 }
 const save = () => {
+
   const packageItems = benefitPackageList.value?.filter((item: any) => item.rightsCount > 0) || []
+  if (packageItems.length == 0) {
+    ElMessage({
+      type: 'warning',
+      message: '请选择后再提交，不能直接提交',
+      plain: true,
+    })
+    return
+  }
   // 发送表单数据
   emits("save", packageItems)
   emits('update:show', false);
@@ -639,6 +560,7 @@ const save = () => {
     color: #0083FF;
     border-left: 0;
   }
+
   :deep(.el-input__wrapper) {
     border: none;
     background: transparent;