feat: 处理推荐管理、设备大类、唤醒音、广播电台、多添加一层谨慎操作提示

src/views/device/class/index.vue

@@ -156,7 +156,6 @@
         </template>
       </el-table-column>
     </el-table>
-
     <pagination
       v-show="total > 0"
       :total="total"

src/views/music/radio/index.vue

@@ -1,3 +1,4 @@
+<!-- 音频管理 广播电台 -->
 <template>
   <div class="app-container">
     <!-- 搜索 -->
@@ -6,82 +7,212 @@
         <el-input v-model="form.name" placeholder="请输入电台名称" clearable />
       </el-form-item>
       <el-form-item label="资源平台：">
-        <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
+          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-cascader v-model="form.list" :options="mapOptions" placeholder="请选择省市区" clearable
-          :props="{ value: 'id', label: 'name', children: 'childList', checkStrictly: true }" />
+        <el-cascader
+          v-model="form.list"
+          :options="mapOptions"
+          placeholder="请选择省市区"
+          clearable
+          :props="{
+            value: 'id',
+            label: 'name',
+            children: 'childList',
+            checkStrictly: true,
+          }"
+        />
       </el-form-item>
       <el-form-item label="地域分类：">
-        <el-select v-model="form.addressClassifyId" placeholder="请选择地域分类" clearable>
-          <el-option v-for="item in addressOptions" :key="item.value" :value="item.value" :label="item.label" />
+        <el-select
+          v-model="form.addressClassifyId"
+          placeholder="请选择地域分类"
+          clearable
+        >
+          <el-option
+            v-for="item in addressOptions"
+            :key="item.value"
+            :value="item.value"
+            :label="item.label"
+          />
         </el-select>
       </el-form-item>
       <el-form-item label="广播分类：">
-        <el-select v-model="form.contentClassifyId" placeholder="请选择广播分类" clearable>
-          <el-option v-for="item in contentOptions" :key="item.value" :value="item.value" :label="item.label" />
+        <el-select
+          v-model="form.contentClassifyId"
+          placeholder="请选择广播分类"
+          clearable
+        >
+          <el-option
+            v-for="item in contentOptions"
+            :key="item.value"
+            :value="item.value"
+            :label="item.label"
+          />
         </el-select>
       </el-form-item>
       <el-form-item label="当前状态：">
         <el-select v-model="form.status" placeholder="请选择当前状态" clearable>
-          <el-option v-for="item in onOrOffOptions" :key="item.value" :value="item.value" :label="item.label" />
+          <el-option
+            v-for="item in onOrOffOptions"
+            :key="item.value"
+            :value="item.value"
+            :label="item.label"
+          />
         </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="['music:radio:add']">新增</el-button>
-        <el-button type="primary" :disabled="obj.id === ''" @click="getChange(obj, 1)"
-          v-hasPermi="['music:radio:up']">批量上架</el-button>
-        <el-button type="primary" :disabled="obj.id === ''" @click="getChange(obj, 2)"
-          v-hasPermi="['music:radio:down']">批量下架</el-button>
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          @click="getDetail()"
+          v-hasPermi="['music:radio:add']"
+          >新增</el-button
+        >
+        <el-button
+          type="primary"
+          :disabled="obj.id === ''"
+          @click="getChange(obj, 1)"
+          v-hasPermi="['music:radio:up']"
+          >批量上架</el-button
+        >
+        <el-button
+          type="primary"
+          :disabled="obj.id === ''"
+          @click="getChange(obj, 2)"
+          v-hasPermi="['music:radio:down']"
+          >批量下架</el-button
+        >
       </el-form-item>
     </el-form>
     <!-- 列表 -->
-    <el-table :data="tableData" v-loading="loading" @selection-change="handleSelect">
+    <el-table
+      :data="tableData"
+      v-loading="loading"
+      @selection-change="handleSelect"
+    >
       <el-table-column type="selection" align="center" />
-      <el-table-column label="ID" prop="id" align="center" show-overflow-tooltip />
-      <el-table-column label="电台名称" prop="name" align="center" show-overflow-tooltip />
+      <el-table-column
+        label="ID"
+        prop="id"
+        align="center"
+        show-overflow-tooltip
+      />
+      <el-table-column
+        label="电台名称"
+        prop="name"
+        align="center"
+        show-overflow-tooltip
+      />
       <el-table-column label="电台封面" align="center" width="100px">
         <template slot-scope="scope">
           <el-image v-if="scope.row.thumb" :src="scope.row.thumb" />
         </template>
       </el-table-column>
       <el-table-column label="地区" align="center" :formatter="areaFormatter" />
-      <el-table-column label="地域分类" prop="addressClassifyId" align="center" :formatter="addressFormatter" />
-      <el-table-column label="广播分类" prop="contentClassifyName" align="center" :formatter="contentFormatter" />
-      <el-table-column label="资源平台" prop="platformId" align="center" :formatter="platformFormatter" />
-      <el-table-column label="当前状态" prop="status" align="center" :formatter="statusFormatter" />
+      <el-table-column
+        label="地域分类"
+        prop="addressClassifyId"
+        align="center"
+        :formatter="addressFormatter"
+      />
+      <el-table-column
+        label="广播分类"
+        prop="contentClassifyName"
+        align="center"
+        :formatter="contentFormatter"
+      />
+      <el-table-column
+        label="资源平台"
+        prop="platformId"
+        align="center"
+        :formatter="platformFormatter"
+      />
+      <el-table-column
+        label="当前状态"
+        prop="status"
+        align="center"
+        :formatter="statusFormatter"
+      />
       <el-table-column label="操作" align="center">
         <template slot-scope="scope">
-          <el-button type="text" @click="getDetail(scope.row.id, true)">查看</el-button>
+          <el-button type="text" @click="getDetail(scope.row.id, true)"
+            >查看</el-button
+          >
           <span v-if="scope.row.status === 2">
-            <el-button type="text" @click="getDetail(scope.row.id)" v-hasPermi="['music:radio:edit']"
-              style="margin-left: 10px">编辑</el-button>
-            <el-button type="text" @click="getChange(scope.row, 1)" v-hasPermi="['music:radio:up']">上架</el-button>
-            <el-button type="delete" @click="getDelete(scope.row)" v-hasPermi="['music:radio:delete']">删除</el-button>
+            <el-button
+              type="text"
+              @click="getDetail(scope.row.id)"
+              v-hasPermi="['music:radio:edit']"
+              style="margin-left: 10px"
+              >编辑</el-button
+            >
+            <el-button
+              type="text"
+              @click="getChange(scope.row, 1)"
+              v-hasPermi="['music:radio:up']"
+              >上架</el-button
+            >
+            <el-button
+              type="delete"
+              @click="getDelete(scope.row)"
+              v-hasPermi="['music:radio:delete']"
+              >删除</el-button
+            >
           </span>
-          <el-button v-else type="text" @click="getChange(scope.row, 2)" v-hasPermi="['music:radio:down']">下架</el-button>
+          <el-button
+            v-else
+            type="text"
+            @click="getChange(scope.row, 2)"
+            v-hasPermi="['music:radio:down']"
+            >下架</el-button
+          >
           <Audio :src="scope.row.fullUrl" style="margin-left: 10px" />
         </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>
 
+
 <script>
-import { platformMixin, onOrOffMixin, addressMixin, contentMixin, mapMixin } from '@/mixin/index'
-import { list, change, remove } from '@/api/music/radio'
-import Audio from '@/components/Audio/index.vue'
+import { change, list, remove } from "@/api/music/radio";
+import Audio from "@/components/Audio/index.vue";
+import {
+addressMixin,
+contentMixin,
+mapMixin,
+onOrOffMixin,
+platformMixin,
+} from "@/mixin/index";
+import { dialogCallBack } from "@/utils/DialogUtil";
 export default {
   mixins: [platformMixin, onOrOffMixin, addressMixin, contentMixin, mapMixin],
   components: {
-    Audio
+    Audio,
   },
   data() {
     return {
@@ -90,7 +221,7 @@ export default {
       // 表单
       form: {
         pageNum: 1,
-        pageSize: 10
+        pageSize: 10,
       },
       // 总数据
       total: 0,
@@ -102,52 +233,52 @@ export default {
       addressOptions: [],
       // 批量上下架
       obj: {
-        id: '',
-        name: '已选数据'
-      }
-    }
+        id: "",
+        name: "已选数据",
+      },
+    };
   },
   watch: {
-    'form.list'(val) {
-      this.form.province = val[0]
-      this.form.city = val[1]
-      this.form.area = val[2]
-    }
+    "form.list"(val) {
+      this.form.province = val[0];
+      this.form.city = val[1];
+      this.form.area = val[2];
+    },
   },
   mounted() {
     // 获取资源平台
     this.getPlatform({
-      audioType: 2
-    })
-    this.getContent({ type: 1 })
-    this.getList()
+      audioType: 2,
+    });
+    this.getContent({ type: 1 });
+    this.getList();
   },
   methods: {
     // 列表
     getList() {
-      this.loading = true
-      list(this.form).then(res => {
+      this.loading = true;
+      list(this.form).then((res) => {
         if (res.code === 0) {
-          this.tableData = res.data.records
-          this.total = res.data.total
-          this.loading = false
+          this.tableData = res.data.records;
+          this.total = res.data.total;
+          this.loading = false;
         }
-      })
+      });
     },
 
     // 搜索
     getSearch() {
-      this.form.pageNum = 1
-      this.getList()
+      this.form.pageNum = 1;
+      this.getList();
     },
 
     // 重置
     getRefresh() {
       this.form = {
         pageNum: 1,
-        pageSize: 10
-      }
-      this.getList()
+        pageSize: 10,
+      };
+      this.getList();
     },
 
     // 新增 / 查看 / 编辑
@@ -156,63 +287,73 @@ export default {
         path: `/music/radio/detail`,
         query: {
           id: id,
-          disabled: boolean
-        }
-      })
+          disabled: boolean,
+        },
+      });
     },
 
     // 上下架
     getChange(row, status) {
-      let title = status === 1 ? '上架' : '下架'
-      this.$confirm(`是否${title}${row.name}?`, '提示', {
-        type: 'warning'
-      }).then(() => {
-        change(row.id, status).then(res => {
-          if (res.code === 0) {
-            this.$message.success(`${title}成功！`)
-            this.getList()
-          }
+      let title = status === 1 ? "上架" : "下架";
+      this.$confirm(`是否${title}${row.name}?`, "提示", {
+        type: "warning",
+      })
+        .then(() => {
+          change(row.id, status).then((res) => {
+            if (res.code === 0) {
+              this.$message.success(`${title}成功！`);
+              this.getList();
+            }
+          });
         })
-      }).catch(() => { })
+        .catch(() => {});
     },
 
-
     // 删除
     getDelete(row) {
-      this.$confirm(`是否删除${row.name}?`, '提示', {
-        type: 'warning'
-      }).then(() => {
-        remove(row.id).then(res => {
-          if (res.code === 0) {
-            this.$message.success('删除成功！')
-            this.getList()
-          }
-        })
-      }).catch(() => { })
+      var that = this;
+      dialogCallBack(that, function () {
+        that
+          .$confirm(`是否删除${row.name}?`, "提示", {
+            type: "warning",
+          })
+          .then(() => {
+            remove(row.id).then((res) => {
+              if (res.code === 0) {
+                that.$message.success("删除成功！");
+                that.getList();
+              }
+            });
+          })
+          .catch(() => {});
+      });
     },
 
     // 多选
     handleSelect(e) {
-      this.obj.id = ''
-      e.map((item, index) => this.obj.id += item.id + ((index + 1) < e.length ? ',' : ''))
+      this.obj.id = "";
+      e.map(
+        (item, index) =>
+          (this.obj.id += item.id + (index + 1 < e.length ? "," : ""))
+      );
     },
 
     // 字典翻译
     platformFormatter(row) {
-      return this.selectDictLabel(this.platformOptions, row.platformId)
+      return this.selectDictLabel(this.platformOptions, row.platformId);
     },
 
     statusFormatter(row) {
-      return this.selectDictLabel(this.onOrOffOptions, row.status)
+      return this.selectDictLabel(this.onOrOffOptions, row.status);
     },
 
     addressFormatter(row) {
-      return this.selectDictLabel(this.addressOptions, row.addressClassifyId)
+      return this.selectDictLabel(this.addressOptions, row.addressClassifyId);
     },
 
     contentFormatter(row) {
-      return this.selectDictLabel(this.contentOptions, row.contentClassifyId)
-    }
+      return this.selectDictLabel(this.contentOptions, row.contentClassifyId);
+    },
   },
-}
+};
 </script>

src/views/operation/recommend/index.vue

@@ -1,15 +1,30 @@
+<!-- 运营管理 首页推荐 推荐管理 -->
 <template>
   <div class="app-container">
     <!-- 列表 -->
-    <el-table :data="tableData" ref="tableData" row-key="id" :default-sort="{ prop: 'sort', order: 'ascending' }"
-      :tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
+    <el-table
+      :data="tableData"
+      ref="tableData"
+      row-key="id"
+      :default-sort="{ prop: 'sort', order: 'ascending' }"
+      :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
+    >
       <el-table-column width="80px">
         <template slot-scope="scope">
-          <el-link v-if="scope.row.hidden" :underline="false" class="el-icon-arrow-right"
-            @click="getList(scope.row, scope.row.index)" />
+          <el-link
+            v-if="scope.row.hidden"
+            :underline="false"
+            class="el-icon-arrow-right"
+            @click="getList(scope.row, scope.row.index)"
+          />
         </template>
       </el-table-column>
-      <el-table-column label="导航名称" align="center" prop="name" show-overflow-tooltip>
+      <el-table-column
+        label="导航名称"
+        align="center"
+        prop="name"
+        show-overflow-tooltip
+      >
         <template slot-scope="scope">
           <span v-if="scope.row.lv === 1">{{ scope.row.name }}</span>
         </template>
@@ -19,10 +34,26 @@
           <span v-if="scope.row.lv === 2">{{ scope.row.sort }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="模块类型" align="center" prop="moduleTypeId" show-overflow-tooltip :formatter="typeFormatter" />
-      <el-table-column label="模块名称" align="center" prop="moduleName" show-overflow-tooltip />
+      <el-table-column
+        label="模块类型"
+        align="center"
+        prop="moduleTypeId"
+        show-overflow-tooltip
+        :formatter="typeFormatter"
+      />
+      <el-table-column
+        label="模块名称"
+        align="center"
+        prop="moduleName"
+        show-overflow-tooltip
+      />
       <el-table-column label="模块数量" align="center" prop="moduleNum" />
-      <el-table-column label="创建时间" align="center" prop="createTime" show-overflow-tooltip />
+      <el-table-column
+        label="创建时间"
+        align="center"
+        prop="createTime"
+        show-overflow-tooltip
+      />
       <el-table-column label="有效时间" align="center" width="380px">
         <template slot-scope="scope">
           <span v-if="scope.row.lv === 3">
@@ -30,39 +61,101 @@
           </span>
         </template>
       </el-table-column>
-      <el-table-column label="当前状态" align="center" prop="isProgressStatus" :formatter="statusFormatter" />
+      <el-table-column
+        label="当前状态"
+        align="center"
+        prop="isProgressStatus"
+        :formatter="statusFormatter"
+      />
       <el-table-column label="操作" align="center">
         <template slot-scope="scope">
           <span v-if="scope.row.lv === 1">
-            <el-button type="text" @click="getDialog('新增', scope.row)"
-              v-hasPermi="['operation:recommend:add']">新增</el-button>
-            <el-button type="text" @click="getHistoryDialog(scope.row.id)">历史记录</el-button>
+            <el-button
+              type="text"
+              @click="getDialog('新增', scope.row)"
+              v-hasPermi="['operation:recommend:add']"
+              >新增</el-button
+            >
+            <el-button type="text" @click="getHistoryDialog(scope.row.id)"
+              >历史记录</el-button
+            >
           </span>
           <span v-else-if="scope.row.lv === 2">
-            <el-button type="text" @click="getDetail(scope.row)" v-hasPermi="['operation:recommend:add']">新增</el-button>
-            <el-button type="text" @click="getDialog('查看', scope.row)">查看</el-button>
-            <el-button type="text" @click="getDialog('编辑', scope.row)"
-              v-hasPermi="['operation:recommend:edit']">编辑</el-button>
-            <el-button type="delete" @click="getDelete(scope.row)"
-              v-hasPermi="['operation:recommend:delete']">删除</el-button>
+            <el-button
+              type="text"
+              @click="getDetail(scope.row)"
+              v-hasPermi="['operation:recommend:add']"
+              >新增</el-button
+            >
+            <el-button type="text" @click="getDialog('查看', scope.row)"
+              >查看</el-button
+            >
+            <el-button
+              type="text"
+              @click="getDialog('编辑', scope.row)"
+              v-hasPermi="['operation:recommend:edit']"
+              >编辑</el-button
+            >
+            <el-button
+              type="delete"
+              @click="getDelete(scope.row)"
+              v-hasPermi="['operation:recommend:delete']"
+              >删除</el-button
+            >
           </span>
           <span v-else>
-            <el-button type="text" @click="getDetail(scope.row, true)">查看</el-button>
-            <el-button type="text" @click="getDetail(scope.row)" v-hasPermi="['operation:recommend:edit']">编辑</el-button>
-            <el-button type="delete" @click="getDelete(scope.row)"
-              v-hasPermi="['operation:recommend:delete']">删除</el-button>
-            <el-button type="text" @click="getCopy(scope.row)" v-hasPermi="['operation:recommend:copy']">复制</el-button>
+            <el-button type="text" @click="getDetail(scope.row, true)"
+              >查看</el-button
+            >
+            <el-button
+              type="text"
+              @click="getDetail(scope.row)"
+              v-hasPermi="['operation:recommend:edit']"
+              >编辑</el-button
+            >
+            <el-button
+              type="delete"
+              @click="getDelete(scope.row)"
+              v-hasPermi="['operation:recommend:delete']"
+              >删除</el-button
+            >
+            <el-button
+              type="text"
+              @click="getCopy(scope.row)"
+              v-hasPermi="['operation:recommend:copy']"
+              >复制</el-button
+            >
           </span>
         </template>
       </el-table-column>
     </el-table>
 
     <!-- 弹窗 -->
-    <el-dialog :visible.sync="dialogVisible" :title="title" width="500px" :before-close="cancel">
-      <el-form :model="dialogForm" :rules="rules" ref="dialogForm" label-width="100px" :disabled="title === '查看'">
+    <el-dialog
+      :visible.sync="dialogVisible"
+      :title="title"
+      width="500px"
+      :before-close="cancel"
+    >
+      <el-form
+        :model="dialogForm"
+        :rules="rules"
+        ref="dialogForm"
+        label-width="100px"
+        :disabled="title === '查看'"
+      >
         <el-form-item label="模块类型：" prop="moduleTypeId">
-          <el-select v-model="dialogForm.moduleTypeId" placeholder="请选择模块类型" :disabled="title === '编辑'">
-            <el-option v-for="item in typeOptions" :key="item.typeId" :value="item.typeId" :label="item.typeName" />
+          <el-select
+            v-model="dialogForm.moduleTypeId"
+            placeholder="请选择模块类型"
+            :disabled="title === '编辑'"
+          >
+            <el-option
+              v-for="item in typeOptions"
+              :key="item.typeId"
+              :value="item.typeId"
+              :label="item.typeName"
+            />
           </el-select>
         </el-form-item>
         <el-form-item label="排序：" prop="sort">
@@ -71,50 +164,105 @@
       </el-form>
       <div slot="footer">
         <el-button @click="cancel">取消</el-button>
-        <el-button v-if="title !== '查看'" type="primary" @click="getSubmit">确定</el-button>
+        <el-button v-if="title !== '查看'" type="primary" @click="getSubmit"
+          >确定</el-button
+        >
       </div>
     </el-dialog>
 
     <!-- 历史记录 -->
-    <el-dialog :visible.sync="dialogVisible_list" title="历史记录" width="1200px">
+    <el-dialog
+      :visible.sync="dialogVisible_list"
+      title="历史记录"
+      width="1200px"
+    >
       <el-form inline size="mini">
         <el-form-item label="创建时间：">
-          <el-date-picker v-model="dialogForm_list.rsDates" type="datetimerange" start-placeholder="开始日期"
-            end-placeholder="结束日期" value-format="yyyy-MM-dd HH:mm:ss" format="yyyy-MM-dd HH:mm:ss" />
+          <el-date-picker
+            v-model="dialogForm_list.rsDates"
+            type="datetimerange"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            format="yyyy-MM-dd HH:mm:ss"
+          />
         </el-form-item>
         <el-form-item label="模块名称：">
-          <el-input v-model="dialogForm_list.moduleName" placeholder="请输入模块名称" clearable />
+          <el-input
+            v-model="dialogForm_list.moduleName"
+            placeholder="请输入模块名称"
+            clearable
+          />
         </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-form-item>
       </el-form>
       <el-table :data="dialogTableData" v-loading="loading">
-        <el-table-column label="模块名称" prop="moduleName" align="center" show-overflow-tooltip />
-        <el-table-column label="模块类型" prop="moduleTypeId" align="center" :formatter="typeFormatter" />
+        <el-table-column
+          label="模块名称"
+          prop="moduleName"
+          align="center"
+          show-overflow-tooltip
+        />
+        <el-table-column
+          label="模块类型"
+          prop="moduleTypeId"
+          align="center"
+          :formatter="typeFormatter"
+        />
         <el-table-column label="模块数量" prop="moduleNum" align="center" />
         <el-table-column label="有效时间" align="center" width="380px">
           <template slot-scope="scope">
             <span>{{ scope.row.rsDates[0] }} - {{ scope.row.rsDates[1] }}</span>
           </template>
         </el-table-column>
-        <el-table-column label="当前状态" prop="isProgressStatus" align="center" :formatter="statusFormatter" />
-        <el-table-column label="创建时间" prop="createTime" align="center" show-overflow-tooltip />
+        <el-table-column
+          label="当前状态"
+          prop="isProgressStatus"
+          align="center"
+          :formatter="statusFormatter"
+        />
+        <el-table-column
+          label="创建时间"
+          prop="createTime"
+          align="center"
+          show-overflow-tooltip
+        />
         <el-table-column label="操作" align="center">
           <template slot-scope="scope">
-            <el-button type="text" @click="getDetail(scope.row, true)">查看</el-button>
+            <el-button type="text" @click="getDetail(scope.row, true)"
+              >查看</el-button
+            >
           </template>
         </el-table-column>
       </el-table>
-      <pagination v-show="total > 0" :total="total" :page.sync="dialogForm_list.pageNum"
-        :limit.sync="dialogForm_list.pageSize" @pagination="getHistoryList" />
+      <pagination
+        v-show="total > 0"
+        :total="total"
+        :page.sync="dialogForm_list.pageNum"
+        :limit.sync="dialogForm_list.pageSize"
+        @pagination="getHistoryList"
+      />
     </el-dialog>
   </div>
 </template>
 
 <script>
-import { tabList, typeList, list, submit, listDetail, remove, history, timeChange } from '@/api/operation/recommend'
+import {
+history,
+list,
+listDetail,
+remove,
+submit,
+tabList,
+timeChange,
+typeList,
+} from "@/api/operation/recommend";
+import { dialogCallBack } from "@/utils/DialogUtil";
 export default {
   data() {
     return {
@@ -129,10 +277,10 @@ export default {
       dialogForm: {},
       dialogForm_list: {
         pageNum: 1,
-        pageSize: 10
+        pageSize: 10,
       },
       // 弹窗title
-      title: '新增',
+      title: "新增",
       // 弹窗列表
       dialogTableData: [],
       // 总数据
@@ -143,117 +291,135 @@ export default {
       typeOptions: [],
       // 校验
       rules: {
-        categoryId: [{
-          required: true, message: '请选择导航', tigger: 'change'
-        }],
-        moduleTypeId: [{
-          required: true, message: '请选择模块类型', tigger: 'change'
-        }],
-        sort: [{
-          required: true, type: 'number', message: '请选择排序', tirgger: 'blur, change'
-        }]
+        categoryId: [
+          {
+            required: true,
+            message: "请选择导航",
+            tigger: "change",
+          },
+        ],
+        moduleTypeId: [
+          {
+            required: true,
+            message: "请选择模块类型",
+            tigger: "change",
+          },
+        ],
+        sort: [
+          {
+            required: true,
+            type: "number",
+            message: "请选择排序",
+            tirgger: "blur, change",
+          },
+        ],
       },
       // 当前状态
-      statusOptions: [{
-        value: 0,
-        label: '生效中'
-      }, {
-        value: 1,
-        label: '未生效'
-      }, {
-        value: 2,
-        label: '未配置时间'
-      }, {
-        value: 3,
-        label: '已失效'
-      }],
+      statusOptions: [
+        {
+          value: 0,
+          label: "生效中",
+        },
+        {
+          value: 1,
+          label: "未生效",
+        },
+        {
+          value: 2,
+          label: "未配置时间",
+        },
+        {
+          value: 3,
+          label: "已失效",
+        },
+      ],
       // 当前数据缓存
-      index: null
-    }
+      index: null,
+    };
   },
   mounted() {
-    this.getTabList()
-    this.getTypeList()
+    this.getTabList();
+    this.getTypeList();
   },
   methods: {
     // 导航列表
     getTabList() {
-      tabList().then(res => {
+      tabList().then((res) => {
         if (res.code === 0) {
           res.data.map((i, index) => {
-            i.index = index
-            i.hidden = true
-            i.children = []
-          })
-          this.tabOptions = res.data
-          this.tableData = res.data
+            i.index = index;
+            i.hidden = true;
+            i.children = [];
+          });
+          this.tabOptions = res.data;
+          this.tableData = res.data;
         }
-      })
+      });
     },
 
     // 模块列表
     getTypeList() {
-      typeList().then(res => {
+      typeList().then((res) => {
         if (res.code === 0) {
-          this.typeOptions = res.data
+          this.typeOptions = res.data;
         }
-      })
+      });
     },
 
     // 首次获取二级列表
     getList(row, index) {
-      let e = this.tableData[index]
-      list(row.id).then(res => {
+      let e = this.tableData[index];
+      list(row.id).then((res) => {
         if (res.code === 0) {
           if (res.data.length > 0) {
-            e.children = res.data
-            e.hidden = false
+            e.children = res.data;
+            e.hidden = false;
             this.$nextTick(() => {
-              this.$refs.tableData.toggleRowExpansion(row, true)
-            })
+              this.$refs.tableData.toggleRowExpansion(row, true);
+            });
           } else {
-            this.$message.warning('暂无模块！')
+            this.$message.warning("暂无模块！");
           }
         }
-      })
+      });
     },
 
     // 提交二级
     getSubmit() {
       this.$refs.dialogForm.validate((valid) => {
         if (valid) {
-          submit(this.dialogForm).then(res => {
+          submit(this.dialogForm).then((res) => {
             if (res.code === 0) {
-              this.$message.success('提交成功')
-              this.cancel()
-              this.getList(this.tableData[this.index], this.index)
+              this.$message.success("提交成功");
+              this.cancel();
+              this.getList(this.tableData[this.index], this.index);
             }
-          })
+          });
         } else {
-          return false
+          return false;
         }
-      })
+      });
     },
 
     // 取消
     cancel() {
-      this.dialogVisible = false
-      this.$refs.dialogForm.resetFields()
-      this.dialogForm = {}
+      this.dialogVisible = false;
+      this.$refs.dialogForm.resetFields();
+      this.dialogForm = {};
     },
 
     // 弹窗
     getDialog(title, row) {
-      this.index = this.tableData.findIndex(i => i.id == row.id)
-      this.title = title
-      this.dialogVisible = true
-      this.dialogForm.categoryId = row.id
+      this.index = this.tableData.findIndex((i) => i.id == row.id);
+      this.title = title;
+      this.dialogVisible = true;
+      this.dialogForm.categoryId = row.id;
       if (row.lv === 2) {
-        listDetail(row.id).then(res => {
+        listDetail(row.id).then((res) => {
           if (res.code === 0) {
-            this.dialogForm = res.data
+            this.dialogForm = res.data;
           }
-        })
+        });
       }
     },
 
@@ -261,55 +427,64 @@ export default {
     getDetail(row, boolean) {
       this.$router.push({
         path: `/operation/homePage/recommend/detail`,
-        query: row.lv === 2 ? {
-          secondId: row.id,
-          moduleTypeId: row.moduleTypeId
-        } : {
-          threeId: row.id,
-          moduleTypeId: row.moduleTypeId,
-          boolean: boolean
-        }
-      })
+        query:
+          row.lv === 2
+            ? {
+                secondId: row.id,
+                moduleTypeId: row.moduleTypeId,
+              }
+            : {
+                threeId: row.id,
+                moduleTypeId: row.moduleTypeId,
+                boolean: boolean,
+              },
+      });
     },
 
     // 删除
     getDelete(row) {
-      this.$confirm(`是否删除?`, '提醒', {
-        type: 'warning'
-      }).then(() => {
-        let index = this.tableData.findIndex(i => i.id == row.categoryId)
-        remove(row.lv, row.id).then(res => {
-          if (res.code === 0) {
-            this.$message.success('删除成功！')
-            this.getList(this.tableData[index], index)
-          }
-        })
-      }).catch(() => { })
+      var that = this;
+      dialogCallBack(that, function () {
+        that
+          .$confirm(`是否有删除?`, "提醒", {
+            type: "warning",
+          })
+          .then(() => {
+            let index = that.tableData.findIndex((i) => i.id == row.categoryId);
+            remove(row.lv, row.id).then((res) => {
+              if (res.code === 0) {
+                that.$message.success("删除成功！");
+                that.getList(that.tableData[index], index);
+              }
+            });
+          })
+          .catch(() => {});
+      });
     },
 
     // 历史记录
     getHistoryDialog(id) {
-      this.dialogVisible_list = true
-      this.loading = true
-      this.dialogForm_list.categoryId = id
-      this.getHistoryList()
+      this.dialogVisible_list = true;
+      this.loading = true;
+      this.dialogForm_list.categoryId = id;
+      this.getHistoryList();
     },
 
     // 历史记录列表
     getHistoryList() {
-      history(this.dialogForm_list).then(res => {
+      history(this.dialogForm_list).then((res) => {
         if (res.code === 0) {
-          this.dialogTableData = res.data.records
-          this.total = res.data.total
-          this.loading = false
+          this.dialogTableData = res.data.records;
+          this.total = res.data.total;
+          this.loading = false;
         }
-      })
+      });
     },
 
     // 搜索
     getSearch() {
-      this.dialogForm_list.pageNum = 1
-      this.getHistoryList()
+      this.dialogForm_list.pageNum = 1;
+      this.getHistoryList();
     },
 
     // 重置
@@ -317,22 +492,22 @@ export default {
       this.dialogForm_list = {
         pageNum: 1,
         pageSize: 10,
-        categoryId: this.dialogForm_list.categoryId
-      }
-      this.getHistoryList()
+        categoryId: this.dialogForm_list.categoryId,
+      };
+      this.getHistoryList();
     },
 
     // 有效时间
     getChange(row) {
       timeChange({
         moduleId: row.id,
-        timeList: row.rsDates
-      }).then(res => {
+        timeList: row.rsDates,
+      }).then((res) => {
         if (res.code === 0) {
-          this.$message.success('修改成功！')
-          this.getTabList()
+          this.$message.success("修改成功！");
+          this.getTabList();
         }
-      })
+      });
     },
 
     // 复制
@@ -341,21 +516,23 @@ export default {
         path: `/operation/homePage/recommend/detail`,
         query: {
           copyId: row.id,
-          moduleTypeId: row.moduleTypeId
-        }
-      })
+          moduleTypeId: row.moduleTypeId,
+        },
+      });
     },
 
     // 字典翻译
     statusFormatter(row) {
-      return this.selectDictLabel(this.statusOptions, row.isProgressStatus)
+      return this.selectDictLabel(this.statusOptions, row.isProgressStatus);
     },
 
     typeFormatter(row) {
-      return row.lv !== 1 ? this.typeOptions.find(i => i.typeId === row.moduleTypeId).typeName : ''
-    }
-  }
-}
+      return row.lv !== 1
+        ? this.typeOptions.find((i) => i.typeId === row.moduleTypeId).typeName
+        : "";
+    },
+  },
+};
 </script>
 
 <style lang="scss">

src/views/operation/waken/detail.vue

@@ -1,55 +1,120 @@
 <template>
   <div class="app-container">
-    <el-form :model="form" ref="form" :rules="rules" label-width="110px" :disabled="disabled">
+    <el-form
+      :model="form"
+      ref="form"
+      :rules="rules"
+      label-width="110px"
+      :disabled="disabled"
+    >
       <el-form-item label="唤醒音名称：" prop="name">
         <el-input v-model="form.name" placeholder="请输入唤醒音名称" />
       </el-form-item>
       <el-form-item label="频道属性：" prop="attributeType">
         <el-select v-model="form.attributeType" placeholder="请选择频道属性">
-          <el-option v-for="item in channelOptions" :key="item.value" :value="item.value" :label="item.label" />
+          <el-option
+            v-for="item in channelOptions"
+            :key="item.value"
+            :value="item.value"
+            :label="item.label"
+          />
         </el-select>
       </el-form-item>
       <el-form-item label="关联设备：" prop="deviceIds">
-        <el-select v-model="form.deviceIds" filterable multiple placeholder="请选择关联设备">
-          <el-option v-for="item in deviceOptions" :key="item.clientTypeId" :value="item.clientTypeId.toString()"
-            :label="item.name" />
+        <el-select
+          v-model="form.deviceIds"
+          filterable
+          multiple
+          placeholder="请选择关联设备"
+        >
+          <el-option
+            v-for="item in deviceOptions"
+            :key="item.clientTypeId"
+            :value="item.clientTypeId.toString()"
+            :label="item.name"
+          />
         </el-select>
       </el-form-item>
       <el-form-item label="唤醒音封面：" prop="pic">
-        <Upload listType="picture-card" :url="form.pic" @upload="upload" :disabled="disabled" />
+        <Upload
+          listType="picture-card"
+          :url="form.pic"
+          @upload="upload"
+          :disabled="disabled"
+        />
       </el-form-item>
       <el-form-item label="唤醒音内容:" style="width: 1000px">
-        <el-button type="primary" icon="el-icon-plus" :disabled="!form.attributeType" @click="getDialog">
+        <el-button
+          type="primary"
+          icon="el-icon-plus"
+          :disabled="!form.attributeType"
+          @click="getDialog"
+        >
           关联内容
         </el-button>
         <el-table :data="form.audioDefaultResp">
-          <el-table-column label="音频ID" align="center" prop="audioId" show-overflow-tooltip />
-          <el-table-column label="音频名称" align="center" prop="audioName" show-overflow-tooltip />
+          <el-table-column
+            label="音频ID"
+            align="center"
+            prop="audioId"
+            show-overflow-tooltip
+          />
+          <el-table-column
+            label="音频名称"
+            align="center"
+            prop="audioName"
+            show-overflow-tooltip
+          />
           <el-table-column label="音频封面" align="center" width="100px">
             <template slot-scope="scope">
               <el-image :src="scope.row.audioPic" />
             </template>
           </el-table-column>
-          <el-table-column label="音频作者" align="center" show-overflow-tooltip>
+          <el-table-column
+            label="音频作者"
+            align="center"
+            show-overflow-tooltip
+          >
             <template slot-scope="scope">
               <span>
-                {{ scope.row.singerName ? scope.row.singerName : '-' }}
+                {{ scope.row.singerName ? scope.row.singerName : "-" }}
               </span>
             </template>
           </el-table-column>
-          <el-table-column label="专辑名称" prop="songName" align="center" show-overflow-tooltip>
+          <el-table-column
+            label="专辑名称"
+            prop="songName"
+            align="center"
+            show-overflow-tooltip
+          >
             <template slot-scope="scope">
               <span>
-                {{ scope.row.songName ? scope.row.songName : '-' }}
+                {{ scope.row.songName ? scope.row.songName : "-" }}
               </span>
             </template>
           </el-table-column>
-          <el-table-column label="付费类型" align="center" prop="isFree" :formatter="freeFormatter" />
-          <el-table-column label="资源平台" align="center" prop="platformId" :formatter="platfromFormatter" />
-          <el-table-column label="当前状态" align="center" :formatter="statusFormatter" />
+          <el-table-column
+            label="付费类型"
+            align="center"
+            prop="isFree"
+            :formatter="freeFormatter"
+          />
+          <el-table-column
+            label="资源平台"
+            align="center"
+            prop="platformId"
+            :formatter="platfromFormatter"
+          />
+          <el-table-column
+            label="当前状态"
+            align="center"
+            :formatter="statusFormatter"
+          />
           <el-table-column label="操作" align="center">
             <template slot-scope="scope">
-              <el-button type="delete" @click="getDelete(scope.row)">删除</el-button>
+              <el-button type="delete" @click="getDelete(scope.row)"
+                >删除</el-button
+              >
             </template>
           </el-table-column>
         </el-table>
@@ -57,35 +122,76 @@
     </el-form>
     <div style="margin-left: 110px">
       <el-button @click="cancel">取消</el-button>
-      <el-button v-if="!disabled" type="primary" @click="getSubmit">确定</el-button>
+      <el-button v-if="!disabled" type="primary" @click="getSubmit"
+        >确定</el-button
+      >
     </div>
 
     <!-- 弹窗 -->
     <el-dialog :visible.sync="dialogVisible" title="关联内容" width="1100px">
-      <el-form inline size="mini" style="width:100%">
+      <el-form inline size="mini" style="width: 100%">
         <el-form-item label="音频类型：">
-          <el-select v-if="form.attributeType" v-model="dialogForm.audioType" placeholder="请选择音频类型">
-            <el-option v-for="item in channelOptions.find(i => i.value === form.attributeType).children" :key="item.value"
-              :value="item.value" :label="item.label" />
+          <el-select
+            v-if="form.attributeType"
+            v-model="dialogForm.audioType"
+            placeholder="请选择音频类型"
+          >
+            <el-option
+              v-for="item in channelOptions.find(
+                (i) => i.value === form.attributeType
+              ).children"
+              :key="item.value"
+              :value="item.value"
+              :label="item.label"
+            />
           </el-select>
         </el-form-item>
         <el-form-item label="资源平台：">
-          <el-select v-model="dialogForm.platformId" placeholder="请选择资源平台">
-            <el-option v-for="item in platformOptions" :key="item.value" :value="item.value" :label="item.label" />
+          <el-select
+            v-model="dialogForm.platformId"
+            placeholder="请选择资源平台"
+          >
+            <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-input v-model="dialogForm.keyword" placeholder="请输入内容名称" />
         </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-refrash" @click="getRefrash">重置</el-button>
         </el-form-item>
       </el-form>
-      <el-table :data="tableData" ref="table" :row-key="getRowKey" @selection-change="getChange">
-        <el-table-column type="selection" align="center" :reserve-selection="true" />
-        <el-table-column label="音频ID" align="center" prop="audioId" show-overflow-tooltip />
-        <el-table-column label="音频名称" align="center" prop="audioName" show-overflow-tooltip />
+      <el-table
+        :data="tableData"
+        ref="table"
+        :row-key="getRowKey"
+        @selection-change="getChange"
+      >
+        <el-table-column
+          type="selection"
+          align="center"
+          :reserve-selection="true"
+        />
+        <el-table-column
+          label="音频ID"
+          align="center"
+          prop="audioId"
+          show-overflow-tooltip
+        />
+        <el-table-column
+          label="音频名称"
+          align="center"
+          prop="audioName"
+          show-overflow-tooltip
+        />
         <el-table-column label="音频封面" align="center" width="100px">
           <template slot-scope="scope">
             <el-image :src="scope.row.audioPic" />
@@ -94,32 +200,52 @@
         <el-table-column label="音频作者" align="center" show-overflow-tooltip>
           <template slot-scope="scope">
             <span>
-              {{ scope.row.singerName ? scope.row.singerName : '-' }}
+              {{ scope.row.singerName ? scope.row.singerName : "-" }}
             </span>
           </template>
         </el-table-column>
-        <el-table-column label="专辑名称" prop="songName" align="center" show-overflow-tooltip>
+        <el-table-column
+          label="专辑名称"
+          prop="songName"
+          align="center"
+          show-overflow-tooltip
+        >
           <template slot-scope="scope">
             <span>
-              {{ scope.row.songName ? scope.row.songName : '-' }}
+              {{ scope.row.songName ? scope.row.songName : "-" }}
             </span>
           </template>
         </el-table-column>
-        <el-table-column label="付费类型" align="center" prop="isFree" :formatter="freeFormatter" />
-        <el-table-column label="资源平台" align="center" prop="platformId" :formatter="platfromFormatter" />
+        <el-table-column
+          label="付费类型"
+          align="center"
+          prop="isFree"
+          :formatter="freeFormatter"
+        />
+        <el-table-column
+          label="资源平台"
+          align="center"
+          prop="platformId"
+          :formatter="platfromFormatter"
+        />
       </el-table>
       <div slot="footer">
-        <pagination v-show="total > 0" :total="total" :page.sync="dialogForm.pageNum" :limit.sync="dialogForm.pageSize"
-          @pagination="getList" />
+        <pagination
+          v-show="total > 0"
+          :total="total"
+          :page.sync="dialogForm.pageNum"
+          :limit.sync="dialogForm.pageSize"
+          @pagination="getList"
+        />
       </div>
     </el-dialog>
   </div>
 </template>
 
 <script>
-import { list } from '@/api/operation/channel'
-import { detail, devices, submit } from '@/api/operation/waken'
-import { platformMixin, isFreeMixin, disabledMixin } from '@/mixin/index'
+import { list } from "@/api/operation/channel";
+import { detail, devices, submit } from "@/api/operation/waken";
+import { disabledMixin, isFreeMixin, platformMixin } from "@/mixin/index";
 export default {
   mixins: [platformMixin, isFreeMixin, disabledMixin],
   data() {
@@ -127,30 +253,38 @@ export default {
       // 表单
       form: {
         deviceIds: [],
-        pic: '',
-        audioDefaultResp: []
+        pic: "",
+        audioDefaultResp: [],
       },
       // 列表
       tableData: [],
       // 频道属性
-      channelOptions: [{
-        value: 1,
-        label: '广播',
-        children: [{
-          value: 2,
-          label: '广播电台'
-        }]
-      }, {
-        value: 3,
-        label: '节目',
-        children: [{
-          value: 6,
-          label: '节目'
-        }, {
-          value: 11,
-          label: '歌曲'
-        }]
-      }],
+      channelOptions: [
+        {
+          value: 1,
+          label: "广播",
+          children: [
+            {
+              value: 2,
+              label: "广播电台",
+            },
+          ],
+        },
+        {
+          value: 3,
+          label: "节目",
+          children: [
+            {
+              value: 6,
+              label: "节目",
+            },
+            {
+              value: 11,
+              label: "歌曲",
+            },
+          ],
+        },
+      ],
       // 关联设备
       deviceOptions: [],
       // 弹窗
@@ -161,7 +295,7 @@ export default {
         pageSize: 10,
         platformId: null,
         audioType: null,
-        status: 1
+        status: 1,
       },
       // 总数
       total: 0,
@@ -169,114 +303,137 @@ export default {
       tableData: [],
       // 校验
       rules: {
-        name: [{
-          required: true, message: '请输入唤醒音名称', trigger: 'blur'
-        }],
-        attributeType: [{
-          required: true, message: '请选择频道属性', trigger: 'change'
-        }],
-        deviceIds: [{
-          required: true, message: '请选择关联设备', trigger: 'change'
-        }],
-        pic: [{
-          required: true, message: '请上传封面', trigger: 'change'
-        }]
+        name: [
+          {
+            required: true,
+            message: "请输入唤醒音名称",
+            trigger: "blur",
+          },
+        ],
+        attributeType: [
+          {
+            required: true,
+            message: "请选择频道属性",
+            trigger: "change",
+          },
+        ],
+        deviceIds: [
+          {
+            required: true,
+            message: "请选择关联设备",
+            trigger: "change",
+          },
+        ],
+        pic: [
+          {
+            required: true,
+            message: "请上传封面",
+            trigger: "change",
+          },
+        ],
       },
       // 只读
-      disabled: Boolean(this.$route.query.boolean)
-    }
+      disabled: Boolean(this.$route.query.boolean),
+    };
   },
   watch: {
-    'form.attributeType'(val) {
+    "form.attributeType"(val) {
       if (val) {
-        this.dialogForm.audioType = this.channelOptions.find(i => i.value === val).children[0].value
+        this.dialogForm.audioType = this.channelOptions.find(
+          (i) => i.value === val
+        ).children[0].value;
         this.getPlatform({
           audioType: this.dialogForm.audioType,
-          joinType: 3
-        })
+          joinType: 3,
+        });
       }
     },
-    async 'dialogForm.audioType'(val) {
+    async "dialogForm.audioType"(val) {
       if (this.dialogVisible) {
         await this.getPlatform({
           audioType: val,
-          joinType: 3
-        })
-        this.getRefrash()
+          joinType: 3,
+        });
+        this.getRefrash();
       }
-    }
+    },
   },
   mounted() {
-    this.getDevices()
-    this.getPlatform({})
+    this.getDevices();
+    this.getPlatform({});
     if (this.$route.query.id) {
-      this.form.id = this.$route.query.id
+      this.form.id = this.$route.query.id;
     }
   },
   methods: {
     // 关联设备
     getDevices() {
-      devices(2).then(res => {
+      devices(2).then((res) => {
         if (res.code === 0) {
-          this.deviceOptions = res.data
+          this.deviceOptions = res.data;
           if (this.form.id) {
-            this.getDetail()
+            this.getDetail();
           }
         }
-      })
+      });
     },
 
     // 详情
     getDetail() {
-      detail(this.form.id).then(res => {
+      detail(this.form.id).then((res) => {
         if (res.code === 0) {
-          this.form = res.data
-          this.form.deviceIds = res.data.deviceIds.split(',')
-          this.deviceOptions.unshift.apply(this.deviceOptions, res.data.deviceList)
+          this.form = res.data;
+          this.form.deviceIds = res.data.deviceIds.split(",");
+          this.deviceOptions.unshift.apply(
+            this.deviceOptions,
+            res.data.deviceList
+          );
         }
-      })
+      });
     },
 
     // 上传
     upload(e) {
-      this.form.pic = e.file
+      this.form.pic = e.file;
     },
 
     // 删除
     getDelete(row) {
-      this.form.audioDefaultResp = this.form.audioDefaultResp.filter(i => i.audioId !== row.audioId)
+      this.form.audioDefaultResp = this.form.audioDefaultResp.filter(
+        (i) => i.audioId !== row.audioId
+      );
     },
 
     // 弹窗
     getDialog() {
-      this.dialogForm.platformId = this.platformOptions[0].value
-      this.dialogVisible = true
-      this.getList()
+      this.dialogForm.platformId = this.platformOptions[0].value;
+      this.dialogVisible = true;
+      this.getList();
     },
 
     // 音频列表
     getList() {
-      list(this.dialogForm).then(res => {
+      list(this.dialogForm).then((res) => {
         if (res.code === 0) {
-          this.tableData = res.data.records
-          this.total = res.data.total
-          this.$refs.table.clearSelection()
+          this.tableData = res.data.records;
+          this.total = res.data.total;
+          this.$refs.table.clearSelection();
           if (this.form.audioDefaultResp.length > 0) {
-            this.form.audioDefaultResp.map(i => {
-              let row = this.tableData.find(j => j.audioId === i.audioId)
+            this.form.audioDefaultResp.map((i) => {
+              let row = this.tableData.find((j) => j.audioId === i.audioId);
               if (row) {
-                this.$refs.table.toggleRowSelection(row, true)
+                this.$refs.table.toggleRowSelection(row, true);
               }
-            })
+            });
           }
         }
-      })
+      });
     },
 
     // 搜索
     getSearch() {
-      this.dialogForm.pageNum = 1
-      this.getList()
+      this.dialogForm.pageNum = 1;
+      this.getList();
     },
 
     // 重置
@@ -286,70 +443,76 @@ export default {
         pageSize: 10,
         platformId: this.platformOptions[0].value,
         audioType: this.dialogForm.audioType,
-        status: 1
-      }
-      this.getList()
+        status: 1,
+      };
+      this.getList();
     },
 
     getRowKey(row) {
-      return row.audioId
+      return row.audioId;
     },
 
     // 表格多选
     getChange(row) {
-      this.form.audioList = []
+      this.form.audioList = [];
       if (row.length > 0) {
-        row.map(i => {
-          if (this.form.audioDefaultResp.findIndex(j => j.audioId === i.audioId) === -1) {
-            this.form.audioDefaultResp.push(i)
+        row.map((i) => {
+          if (
+            this.form.audioDefaultResp.findIndex(
+              (j) => j.audioId === i.audioId
+            ) === -1
+          ) {
+            this.form.audioDefaultResp.push(i);
           }
-        })
+        });
       }
     },
 
     // 取消
     cancel() {
-      this.$tab.closeOpenPage('/operation/waken')
+      this.$tab.closeOpenPage("/operation/waken");
     },
 
     // 提交
     getSubmit() {
       this.$refs.form.validate((valid) => {
         if (valid) {
-          this.form.deviceIds = this.form.deviceIds.join(',')
-          this.form.audioList = []
-          this.form.audioDefaultResp.map(i => {
+          this.form.deviceIds = this.form.deviceIds.join(",");
+          this.form.audioList = [];
+          this.form.audioDefaultResp.map((i) => {
             this.form.audioList.push({
               audioId: i.audioId,
-              audioType: i.audioType
+              audioType: i.audioType,
+            });
+          });
+          submit(this.form)
+            .then((res) => {
+              if (res.code === 0) {
+                this.$message.success("提交成功！");
+                this.form.id ? this.getDevices() : this.cancel();
+              }
             })
-          })
-          submit(this.form).then(res => {
-            if (res.code === 0) {
-              this.$message.success('提交成功！')
-              this.form.id ? this.getDevices() : this.cancel()
-            }
-          }).catch(err => {
-            this.form.deviceIds = this.form.deviceIds.split(',')
-          })
+            .catch((err) => {
+              this.form.deviceIds = this.form.deviceIds.split(",");
+            });
         } else {
-          return false
+          return false;
         }
-      })
+      });
     },
 
     // 字典翻译
     platfromFormatter(row) {
-      return this.selectDictLabel(this.platformTypeOptions, row.platformId)
+      return this.selectDictLabel(this.platformTypeOptions, row.platformId);
     },
     freeFormatter(row) {
-      return this.selectDictLabel(this.freeOptions, row.isFree)
+      return this.selectDictLabel(this.freeOptions, row.isFree);
     },
     statusFormatter(row) {
-      return this.selectDictLabel(this.disabledOptions, row.status)
-    }
-  }
-}
+      return this.selectDictLabel(this.disabledOptions, row.status);
+    },
+  },
+};
 </script>
 
 <style lang="scss" scoped>

src/views/operation/waken/index.vue

@@ -1,25 +1,52 @@
+<!-- 运营管理 唤醒音 -->
 <template>
   <div class="app-container">
-    <el-button type="primary" icon="el-icon-plus" size="mini" @click="getDetail()"
-      v-hasPermi="['operation:waken:add']">新增换醒音</el-button>
+    <el-button
+      type="primary"
+      icon="el-icon-plus"
+      size="mini"
+      @click="getDetail()"
+      v-hasPermi="['operation:waken:add']"
+      >新增换醒音</el-button
+    >
     <!-- 列表 -->
     <el-table :data="tableData" v-loading="loading">
       <el-table-column type="index" label="序号" align="center" />
-      <el-table-column label="唤醒音名称" align="center" prop="name" show-overflow-tooltip />
+      <el-table-column
+        label="唤醒音名称"
+        align="center"
+        prop="name"
+        show-overflow-tooltip
+      />
       <el-table-column label="唤醒音封面" align="center" width="100px">
         <template slot-scope="scope">
           <el-image :src="scope.row.pic" />
         </template>
       </el-table-column>
-      <el-table-column label="关联设备" align="center" :formatter="devFormatter" show-overflow-tooltip />
+      <el-table-column
+        label="关联设备"
+        align="center"
+        :formatter="devFormatter"
+        show-overflow-tooltip
+      />
       <el-table-column label="关联内容数" align="center" prop="num" />
       <el-table-column label="操作" align="center">
         <template slot-scope="scope">
-          <el-button type="text" @click="getDetail(scope.row.id, true)">查看</el-button>
-          <el-button type="text" @click="getDetail(scope.row.id)" v-hasPermi="['operation:waken:edit']">
+          <el-button type="text" @click="getDetail(scope.row.id, true)"
+            >查看</el-button
+          >
+          <el-button
+            type="text"
+            @click="getDetail(scope.row.id)"
+            v-hasPermi="['operation:waken:edit']"
+          >
             编辑
           </el-button>
-          <el-button type="delete" @click="getDelete(scope.row)" v-hasPermi="['operation:waken:delete']">
+          <el-button
+            type="delete"
+            @click="getDelete(scope.row)"
+            v-hasPermi="['operation:waken:delete']"
+          >
             删除
           </el-button>
         </template>
@@ -29,7 +56,8 @@
 </template>
 
 <script>
-import { list, devices, remove } from '@/api/operation/waken'
+import { devices, list, remove } from "@/api/operation/waken";
+import { dialogCallBack } from "@/utils/DialogUtil";
 export default {
   data() {
     return {
@@ -38,34 +66,34 @@ export default {
       // 列表
       tableData: [],
       // 设备列表
-      deviceOptions: []
-    }
+      deviceOptions: [],
+    };
   },
   mounted() {
-    this.getList()
-    this.getDevices()
+    this.getList();
+    this.getDevices();
   },
   methods: {
     // 列表
     getList() {
-      this.loading = true
-      list().then(res => {
+      this.loading = true;
+      list().then((res) => {
         if (res.code === 0) {
-          this.tableData = res.data
-          this.loading = false
+          this.tableData = res.data;
+          this.loading = false;
         }
-      })
+      });
     },
 
     // 设备列表
     getDevices() {
       this.$nextTick(() => {
-        devices(1).then(res => {
+        devices(1).then((res) => {
           if (res.code === 0) {
-            this.deviceOptions = res.data
+            this.deviceOptions = res.data;
           }
-        })
-      })
+        });
+      });
     },
 
     // 详情
@@ -74,31 +102,43 @@ export default {
         path: `/operation/waken/detail`,
         query: {
           id: id,
-          boolean: boolean
-        }
-      })
+          boolean: boolean,
+        },
+      });
     },
 
     // 删除
     getDelete(row) {
-      this.$confirm(`是否删除${row.name}?`, `提示`, {
-        type: 'warning'
-      }).then(() => {
-        remove(row.id).then(res => {
-          if (res.code === 0) {
-            this.$message.success('删除成功！')
-            this.getList()
-          }
-        })
-      })
+      var that = this;
+      dialogCallBack(that, function () {
+        that
+          .$confirm(`是否有删除${row.name}?`, `提示`, {
+            type: "warning",
+          })
+          .then(() => {
+            remove(row.id).then((res) => {
+              if (res.code === 0) {
+                that.$message.success("删除成功！");
+                that.getList();
+              }
+            });
+          });
+      });
     },
 
     // 字典翻译
     devFormatter(row) {
-      return this.deviceOptions.length > 0 ? row.deviceIds.split(',').map(i => this.deviceOptions.find(j => j.clientTypeId == i).name).join('，') : ''
-    }
-  }
-}
+      return this.deviceOptions.length > 0
+        ? row.deviceIds
+            .split(",")
+            .map(
+              (i) => this.deviceOptions.find((j) => j.clientTypeId == i).name
+            )
+            .join("，")
+        : "";
+    },
+  },
+};
 </script>
 
 <style lang="scss" scoped></style>