feature：添加服务-流量套餐界面的UI，接口

src/api/service/package.js

@@ -70,12 +70,12 @@ export function newGoodsList(type, businessType) {
 export function deviceGoodsList(type, businessType, deviceIds) {
   // /?deviceIds=${deviceIds}&businessType=${businessType}&type=${type}
   return request({
-    url: `/admin/goods/listByDevice/admin/goods/listByDevice`,
+    url: `/admin/goods/listByDevice`,
     method: 'post',
     data: {
-      deviceIds,
-      businessType,
-      type
+      "deviceIds": deviceIds,
+      "type": type,
+      "businessType": businessType,
     }
   })
 }

src/views/service/package/detail.vue

@@ -55,6 +55,14 @@
       <el-form-item label="排序：" v-if="form.businessType === 5">
         <el-input-number v-model="form.sort" :min="1" />
       </el-form-item>
+      <el-form-item label='赠送会员：'>
+        <el-switch v-model="form.isFreeFlow" />
+      </el-form-item>
+      <el-form-item v-if="form.isFreeFlow" label="关联会员套餐：">
+        <el-select v-model="form.freeOptions" placeholder="请选择会员套餐：">
+          <el-option v-for="item in form.freeOptions" :key="item.id" :label="item.name" :value="item.id" />
+        </el-select>
+      </el-form-item>
       <el-form-item>
         <el-button @click="cancel">取消</el-button>
         <el-button type="primary" @click="getSubmit">提交</el-button>
@@ -148,10 +156,15 @@ export default {
       if (val !== 5) {
         delete this.form.sort
       }
+      this.getDeviceGoodsList(this.deviceIds ?? [], val, this.form.isFreeFlow ?? false)
+
     },
     'form.platform'(val) {
       this.getDevList({ type: val })
       this.getGoodSList(val)
+    },
+    'form.isFreeFlow'(val) {
+      this.getDeviceGoodsList(this.deviceIds ?? [], this.form.businessType ?? -1, val)
     }
   },
   mounted() {
@@ -194,6 +207,21 @@ export default {
         }
       })
     },
+    // 流量套餐
+    getDeviceGoodsList(deviceIds, businessType, isFreeFlow) {
+      if (this.typeList[0] != "18" || (deviceIds ?? []).length === 0 || (businessType ?? -1) < 0 || (isFreeFlow ?? false) != true) {
+        console.log('设备id或业务类型为空', this.typeList[0], deviceIds, businessType, isFreeFlow)
+        return
+      }
+      console.log('开始请求', this.typeList[0], deviceIds.join(","), businessType, isFreeFlow)
+
+      deviceGoodsList(this.typeList[0], businessType, deviceIds.join(",")).then((res) => {
+        console.log("流量套餐", JSON.stringify(res.data));
+        if (res.code === 0) {
+          this.form.freeOptions = res.data;
+        }
+      });
+    },
 
     // 提交
     getSubmit() {

src/views/service/package/index.vue

@@ -3,204 +3,73 @@
   <div class="app-container">
     <!-- 搜索 -->
     <el-form inline size="mini">
-      <el-form-item
-        :label="form.typeList[0] === '13' ? '套餐名称：' : '流量名称：'"
-      >
+      <el-form-item :label="form.typeList[0] === '13' ? '套餐名称：' : '流量名称：'">
         <el-input v-model="form.name" placeholder="请输入套餐名称" clearable />
       </el-form-item>
       <el-form-item v-if="form.typeList[0] !== '12'" label="资源平台：">
-        <el-select
-          v-model="form.platformId"
-          placeholder="请选择资源平台"
-          clearable
-        >
-          <el-option
-            v-for="item in platformOptions"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          />
+        <el-select v-model="form.platformId" placeholder="请选择资源平台" clearable>
+          <el-option v-for="item in platformOptions" :key="item.value" :label="item.label" :value="item.value" />
         </el-select>
       </el-form-item>
       <el-form-item v-else label="流量套餐：">
-        <el-select
-          v-model="form.goodsId"
-          placeholder="请选择流量套餐"
-          clearable
-        >
-          <el-option
-            v-for="(item, index) in goodsOptions"
-            :key="index"
-            :label="item"
-            :value="index"
-          />
+        <el-select v-model="form.goodsId" placeholder="请选择流量套餐" clearable>
+          <el-option v-for="(item, index) in goodsOptions" :key="index" :label="item" :value="index" />
         </el-select>
       </el-form-item>
       <el-form-item label="关联设备：">
-        <el-select
-          v-model="form.deviceIds"
-          filterable
-          placeholder="请选择关联设备"
-          clearable
-        >
-          <el-option
-            v-for="item in devOptions"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          />
+        <el-select v-model="form.deviceIds" filterable placeholder="请选择关联设备" clearable>
+          <el-option v-for="item in devOptions" :key="item.value" :label="item.label" :value="item.value" />
         </el-select>
       </el-form-item>
       <el-form-item label="当前状态：">
         <el-select v-model="form.status" placeholder="请选择当前状态" clearable>
-          <el-option
-            v-for="item in statusOptions"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          />
+          <el-option v-for="item in statusOptions" :key="item.value" :label="item.label" :value="item.value" />
         </el-select>
       </el-form-item>
       <el-form-item>
-        <el-button type="primary" icon="el-icon-search" @click="getSearch"
-          >搜索</el-button
-        >
+        <el-button type="primary" icon="el-icon-search" @click="getSearch">搜索</el-button>
         <el-button icon="el-icon-refresh" @click="getRefresh">重置</el-button>
-        <el-button
-          type="primary"
-          plain
-          icon="el-icon-plus"
-          @click="getDetail()"
-          v-hasPermi="['service:package:add']"
-          >新增</el-button
-        >
+        <el-button type="primary" plain icon="el-icon-plus" @click="getDetail()"
+          v-hasPermi="['service:package:add']">新增</el-button>
       </el-form-item>
     </el-form>
     <!-- 列表 -->
-    <el-table
-      :data="tableData"
-      v-loading="loading"
-      :default-sort="{ prop: 'sort' }"
-    >
-      <el-table-column
-        label="排序"
-        align="center"
-        prop="sort"
-        key="sort"
-        :formatter="sortFormatter"
-      />
-      <el-table-column
-        :label="form.typeList[0] === '13' ? '套餐名称' : '流量名称'"
-        align="center"
-        prop="name"
-        key="name"
-        show-overflow-tooltip
-      />
-      <el-table-column
-        label="关联设备"
-        align="center"
-        prop="deviceIds"
-        key="deviceIds"
-        :formatter="devFormatter"
-        show-overflow-tooltip
-      />
-      <el-table-column
-        label="原价/元"
-        align="center"
-        prop="price"
-        key="price"
-      />
-      <el-table-column
-        label="活动价/元"
-        align="center"
-        prop="discount"
-        key="discount"
-      />
-      <el-table-column
-        v-if="form.typeList[0] === '12'"
-        label="流量套餐"
-        align="center"
-        prop="intro"
-        key="intro"
-        show-overflow-tooltip
-      />
-      <el-table-column
-        v-if="form.typeList[0] !== '12'"
-        label="有效期"
-        align="center"
-        prop="indate"
-        key="indate"
-        :formatter="timeFormatter"
-      />
-      <el-table-column
-        v-if="form.typeList[0] !== '12'"
-        label="资源平台"
-        align="center"
-        prop="platformId"
-        key="platformId"
-        :formatter="platformFormatter"
-      />
-      <el-table-column
-        v-if="form.typeList[0] !== '12'"
-        label="栏目"
-        align="center"
-        prop="groupId"
-        key="groupId"
-        :formatter="sceneFormatter"
-      />
-      <el-table-column
-        label="当前状态"
-        align="center"
-        prop="status"
-        key="status"
-        :formatter="statusFormatter"
-      />
-      <el-table-column
-        label="是否推荐"
-        align="center"
-        prop="isRecommend"
-        key="isRecommend"
-        :formatter="recommendFormatter"
-      />
-      <el-table-column
-        label="创建时间"
-        align="center"
-        prop="createTime"
-        key="createTime"
-      />
+    <el-table :data="tableData" v-loading="loading" :default-sort="{ prop: 'sort' }">
+      <el-table-column label="排序" align="center" prop="sort" key="sort" :formatter="sortFormatter" />
+      <el-table-column :label="form.typeList[0] === '13' ? '套餐名称' : '流量名称'" align="center" prop="name" key="name"
+        show-overflow-tooltip />
+      <el-table-column label="关联设备" align="center" prop="deviceIds" key="deviceIds" :formatter="devFormatter"
+        show-overflow-tooltip />
+      <el-table-column label="原价/元" align="center" prop="price" key="price" />
+      <el-table-column label="活动价/元" align="center" prop="discount" key="discount" />
+      <el-table-column v-if="form.typeList[0] === '12'" label="流量套餐" align="center" prop="intro" key="intro"
+        show-overflow-tooltip />
+      <el-table-column v-if="form.typeList[0] !== '12'" label="有效期" align="center" prop="indate" key="indate"
+        :formatter="timeFormatter" />
+      <el-table-column v-if="form.typeList[0] !== '12'" label="资源平台" align="center" prop="platformId" key="platformId"
+        :formatter="platformFormatter" />
+      <el-table-column v-if="form.typeList[0] !== '12'" label="栏目" align="center" prop="groupId" key="groupId"
+        :formatter="sceneFormatter" />
+      <el-table-column label="当前状态" align="center" prop="status" key="status" :formatter="statusFormatter" />
+      <el-table-column label="是否推荐" align="center" prop="isRecommend" key="isRecommend"
+        :formatter="recommendFormatter" />
+      <el-table-column v-if="form.typeList[0] === '18'" label="是否赠送流量" align="center" prop="isFreeFlow" key="isFreeFlow"
+        :formatter="freeFlowFormatter" />
+      <el-table-column label="创建时间" align="center" prop="createTime" key="createTime" />
       <el-table-column label="操作" align="center">
         <template slot-scope="scope">
-          <el-button
-            type="text"
-            @click="getDetail(scope.row.id)"
-            v-hasPermi="['service:package:edit']"
-          >
+          <el-button type="text" @click="getDetail(scope.row.id)" v-hasPermi="['service:package:edit']">
             编辑
           </el-button>
-          <el-button
-            v-if="scope.row.status === 1"
-            type="text"
-            @click="getChange(scope.row)"
-            v-hasPermi="['service:package:down']"
-            >下架</el-button
-          >
-          <el-button
-            v-else
-            type="delete"
-            @click="getDelete(scope.row)"
-            v-hasPermi="['service:package:delete']"
-            >删除</el-button
-          >
+          <el-button v-if="scope.row.status === 1" type="text" @click="getChange(scope.row)"
+            v-hasPermi="['service:package:down']">下架</el-button>
+          <el-button v-else type="delete" @click="getDelete(scope.row)"
+            v-hasPermi="['service:package:delete']">删除</el-button>
         </template>
       </el-table-column>
     </el-table>
-    <pagination
-      v-show="total > 0"
-      :total="total"
-      :page.sync="form.pageNum"
-      :limit.sync="form.pageSize"
-      @pagination="getList"
-    />
+    <pagination v-show="total > 0" :total="total" :page.sync="form.pageNum" :limit.sync="form.pageSize"
+      @pagination="getList" />
   </div>
 </template>
 
@@ -360,7 +229,7 @@ export default {
               }
             });
           })
-          .catch(() => {});
+          .catch(() => { });
       });
     },
 
@@ -377,7 +246,7 @@ export default {
             }
           });
         })
-        .catch(() => {});
+        .catch(() => { });
     },
 
     // 字典翻译
@@ -400,13 +269,17 @@ export default {
     recommendFormatter(row) {
       return this.selectDictLabel(this.recommendOptions, row.isRecommend);
     },
+    // 是否推荐
+    freeFlowFormatter(row) {
+      return this.selectDictLabel(this.recommendOptions, row.isFreeFlow == 1 ? 0 : 1);
+    },
     // 关联设备
     devFormatter(row) {
       return row.deviceIds
         ? row.deviceIds
-            .split(",")
-            .map((i) => this.selectDictLabel(this.devOptions, i))
-            .join(",")
+          .split(",")
+          .map((i) => this.selectDictLabel(this.devOptions, i))
+          .join(",")
         : "";
     },
     // 栏目

src/views/vippackage/list/detail.vue

@@ -61,7 +61,7 @@
       </el-form-item>
       <el-form-item v-if="form.isFreeContentVip" label="关联流量套餐：">
         <el-select v-model="form.freeOptions" placeholder="请选择流量套餐：">
-          <el-option v-for="item in form.freeOptions" :key="item.value" :label="item.label" :value="item.value" />
+          <el-option v-for="item in form.freeOptions" :key="item.id" :label="item.name" :value="item.id" />
         </el-select>
       </el-form-item>
       <el-form-item>
@@ -165,16 +165,20 @@ export default {
       if (val !== 5) {
         delete this.form.sort
       }
-      this.getDeviceGoodsList()
+      this.getDeviceGoodsList(this.deviceIds ?? [], val, this.form.isFreeContentVip ?? false)
     },
     'form.platform'(val) {
       this.getDevList({ type: val })
-      this.getDeviceGoodsList()
-
+    },
+    'form.isFreeContentVip'(val) {
+      if (val === true) {
+        this.getDeviceGoodsList(this.deviceIds ?? [], this.form.businessType ?? -1, val)
+      }
     }
   },
   mounted() {
-    this.typeList = this.$route.query.typeList.split(',')
+    this.typeList = this.$route.query.typeList
+    console.log(this.typeList)
     console.log(this.$route.query)
     if (this.$route.query.id) {
       this.form.id = this.$route.query.id
@@ -189,20 +193,23 @@ export default {
         if (res.code === 0) {
           this.form = res.data
           this.deviceIds = res.data.deviceIds.split(',')
+          console.log("请求到设备：", this.deviceIds.length)
         }
       })
     },
 
     // 流量套餐
-    getDeviceGoodsList() {
-      if (this.form.deviceIds.length === 0 || (this.form.businessType ?? 0) <= 0) {
+    getDeviceGoodsList(deviceIds, businessType, isFreeContentVip) {
+      if ((deviceIds ?? []).length === 0 || (businessType ?? -1) < 0 || (isFreeContentVip ?? false) != true) {
+        console.log('设备id或业务类型为空', deviceIds, businessType, isFreeContentVip)
         return
       }
+      console.log('开始请求', this.typeList[0], deviceIds.join(","), businessType, isFreeContentVip)
 
-      deviceGoodsList(this.form.typeList[0], this.form.businessType, this.form.deviceIds).then((res) => {
+      deviceGoodsList(this.typeList[0], businessType, deviceIds.join(",")).then((res) => {
+        console.log("流量套餐", JSON.stringify(res.data));
         if (res.code === 0) {
-          console.log(res.data)
-          this.freeOptions = res.data;
+          this.form.freeOptions = res.data;
         }
       });
     },