签到管理 内容配置 资源平台和音频管理搜索配置

src/views/registration/content/index.vue

@@ -3,23 +3,22 @@
     <!-- 搜索 -->
     <el-form inline size="mini">
       <el-form-item label="资源平台：">
-        <el-select v-model="form.platformId" placeholder="请选择资源平台">
+        <el-select v-model="form.platformId" placeholder="请选择资源平台" clearable>
           <el-option v-for="item in platformOptions" :key="item.value" :value="item.value"
             :label="item.label" />
         </el-select>
       </el-form-item>
       <el-form-item label="音频类型：">
-        <el-select v-model="form.audioType" placeholder="请选择音频类型">
-          <el-option
-            v-for="item in audioOptions.filter(i => i.value !== 9 && i.value !== 12 && i.value !== 15)"
-            :key="item.value" :value="item.value" :label="item.label" />
+        <el-select v-model="form.audioType" placeholder="请选择音频类型" clearable>
+          <el-option v-for="item in form.platformId === '' ? audioOptions : audioTypeOptions" :key="item.value" :value="item.value"
+            :label="item.label" />
         </el-select>
       </el-form-item>
       <el-form-item label="内容标题：">
-        <el-input v-model="form.audioName" placeholder="请输入内容标题" />
+        <el-input v-model="form.audioName" placeholder="请输入内容标题" clearable />
       </el-form-item>
       <el-form-item label="当前状态：">
-        <el-select v-model="form.status" placeholder="请选择当前状态">
+        <el-select v-model="form.status" placeholder="请选择当前状态" clearable>
           <el-option v-for="item in disabledOptions" :key="item.value" :value="item.value"
             :label="item.label" />
         </el-select>
@@ -27,7 +26,8 @@
       <el-form-item>
         <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="['registration:content:add']">新增</el-button>
+        <el-button type="primary" plain icon="el-icon-plus" @click="getDetail()"
+          v-hasPermi="['registration:content:add']">新增</el-button>
       </el-form-item>
     </el-form>
     <!-- 列表 -->
@@ -52,11 +52,15 @@
         <template slot-scope="scope">
           <el-button type="text" @click="getDetail(scope.row.id, true)">查看</el-button>
           <span v-if="scope.row.status === 1">
-            <el-button type="text" @click="getDetail(scope.row.id)" v-hasPermi="['registration:content:edit']" style="margin-left: 10px">编辑</el-button>
-            <el-button type="text" @click="getChange(scope.row, 0)" v-hasPermi="['registration:content:up']">启用</el-button>
-            <el-button type="delete" @click="getDelete(scope.row)" v-hasPermi="['registration:content:delete']">删除</el-button>
+            <el-button type="text" @click="getDetail(scope.row.id)" v-hasPermi="['registration:content:edit']"
+              style="margin-left: 10px">编辑</el-button>
+            <el-button type="text" @click="getChange(scope.row, 0)" v-hasPermi="['registration:content:up']">
+              启用</el-button>
+            <el-button type="delete" @click="getDelete(scope.row)"
+              v-hasPermi="['registration:content:delete']">删除</el-button>
           </span>
-          <el-button v-else type="delete" @click="getChange(scope.row, 1)" v-hasPermi="['registration:content:down']">禁用</el-button>
+          <el-button v-else type="delete" @click="getChange(scope.row, 1)"
+            v-hasPermi="['registration:content:down']">禁用</el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -77,7 +81,9 @@ export default {
       // 表单
       form: {
         pageNum: 1,
-        pageSize: 10
+        pageSize: 10,
+        audioType: '',
+        platformId: ''
       },
       // 列表
       tableData: [],
@@ -85,6 +91,30 @@ export default {
       total: 0
     }
   },
+  watch: {
+    'form.platformId': {
+      handler(val) {
+        if(val && this.form.audioType == '') {
+          this.form.audioType = ''
+          this.getAudioType(val)
+        }
+        this.getList()
+      },
+      deep: true
+    },
+    'form.audioType': {
+      handler(val) {
+        if(val && this.form.platformId == '') {
+          this.form.platformId = ''
+          this.getPlatform({
+            audioType: val
+          })
+        }
+        this.getList()
+      },
+      deep: true
+    }
+  },
   mounted() {
     this.getList()
   },
@@ -111,7 +141,9 @@ export default {
     getRefresh() {
       this.form = {
         pageNum: 1,
-        pageSize: 10
+        pageSize: 10,
+        platformId: '',
+        audioType: ''
       }
       this.getList()
     },