From bd016ace8156aedf26549e2f7edd893735959895 Mon Sep 17 00:00:00 2001
From: shidongli <shidongli>
Date: Fri, 14 Jun 2024 15:35:57 +0800
Subject: [PATCH] =?UTF-8?q?=E8=AF=9D=E6=9C=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/manage/script/index.vue | 216 ++++++++++++++----------------
 1 file changed, 104 insertions(+), 112 deletions(-)

diff --git a/src/views/manage/script/index.vue b/src/views/manage/script/index.vue
index 6cff0aa..dbfee59 100644
--- a/src/views/manage/script/index.vue
+++ b/src/views/manage/script/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="app-container" ref="layout">
+  <div class="app-container">
     <el-row :gutter="20">
       <el-col :span="5">
         <div class="leftscript" ref="box">
@@ -21,82 +21,76 @@
           </div>
         </div>
       </el-col>
-      <el-col :span="19" :xs="24">
-        <div ref="form" class="form">
-          <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch"
-            label-width="68px">
-            <el-form-item label="通用话术名称" prop="commonScriptName" label-width="100px">
-              <el-input v-model="queryParams.commonScriptName" placeholder="请输入通用话术名称" clearable
-                @keyup.enter.native="handleQuery" />
-            </el-form-item>
-            <el-form-item label="话术名称" prop="scriptName">
-              <el-input v-model="queryParams.scriptName" placeholder="请输入话术名称" clearable
-                @keyup.enter.native="handleQuery" />
-            </el-form-item>
-            <el-form-item label="话术ID" prop="scriptId">
-              <el-input v-model="queryParams.scriptId" placeholder="请输入话术ID" clearable
-                @keyup.enter.native="handleQuery" />
-            </el-form-item>
-            <el-form-item label="平台ID" prop="platformId">
-              <el-input v-model="queryParams.platformId" placeholder="请输入平台ID" clearable
-                @keyup.enter.native="handleQuery" />
-            </el-form-item>
-            <el-form-item label="话术状态" prop="scriptStatus">
-              <el-select v-model="queryParams.scriptStatus" placeholder="请选择">
-                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
-                </el-option>
-              </el-select>
-            </el-form-item>
+      <el-col :span="19" :xs="24"
+        style="height:calc(100vh - 124px);display: flex;flex-wrap: wrap;flex-direction: column;justify-content: space-between;">
+        <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch"
+          label-width="68px">
+          <el-form-item label="通用话术名称" prop="commonScriptName" label-width="100px">
+            <el-input v-model="queryParams.commonScriptName" placeholder="请输入通用话术名称" clearable
+              @keyup.enter.native="handleQuery" />
+          </el-form-item>
+          <el-form-item label="话术名称" prop="scriptName">
+            <el-input v-model="queryParams.scriptName" placeholder="请输入话术名称" clearable
+              @keyup.enter.native="handleQuery" />
+          </el-form-item>
+          <el-form-item label="话术ID" prop="scriptId">
+            <el-input v-model="queryParams.scriptId" placeholder="请输入话术ID" clearable
+              @keyup.enter.native="handleQuery" />
+          </el-form-item>
+          <el-form-item label="平台ID" prop="platformId">
+            <el-input v-model="queryParams.platformId" placeholder="请输入平台ID" clearable
+              @keyup.enter.native="handleQuery" />
+          </el-form-item>
+          <el-form-item label="话术状态" prop="scriptStatus">
+            <el-select v-model="queryParams.scriptStatus" placeholder="请选择">
+              <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
+              </el-option>
+            </el-select>
+          </el-form-item>
 
-            <el-form-item>
-              <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
-              <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
-            </el-form-item>
-          </el-form>
-        </div>
-        <div ref="mb8" class="mb8">
-          <el-row :gutter="10" class="">
-            <el-col :span="1.5">
-              <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
-                v-hasPermi="['manage:script:add']">新增</el-button>
-            </el-col>
-            <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
-          </el-row>
-        </div>
-        <div ref="table">
-          <el-table :max-height="maxTableHeight" v-loading="loading" :data="scriptList"
-            @selection-change="handleSelectionChange">
-            <el-table-column label="序号" align="center" prop="sort" type="index" />
+          <el-form-item>
+            <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+            <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+          </el-form-item>
+        </el-form>
+        <el-row :gutter="10" class="mb8">
+          <el-col :span="1.5">
+            <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
+              v-hasPermi="['manage:script:add']">新增</el-button>
+          </el-col>
+          <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+        </el-row>
+        <el-table v-loading="loading" :data="scriptList" @selection-change="handleSelectionChange">
+          <el-table-column label="序号" align="center" prop="sort" type="index" />
 
-            <el-table-column label="通用话术名称" align="center" prop="commonScriptName" :show-overflow-tooltip="true" />
-            <el-table-column label="话术名称" align="center" prop="scriptName" :show-overflow-tooltip="true" />
-            <el-table-column label="话术ID" align="center" prop="scriptId" :show-overflow-tooltip="true" />
-            <el-table-column label="平台ID" align="center" prop="platformId" :show-overflow-tooltip="true" />
-            <el-table-column label="话术状态" align="center" prop="scriptStatus">
-              <template slot-scope="scope">
-                {{ scope.row.scriptStatus == "NORMAL" ? "正常" : "" }}
-                {{ scope.row.scriptStatus == "OFF_SHELF" ? "下架" : "" }}
-                {{ scope.row.scriptStatus == "SUSPEND" ? "暂停" : "" }}
-              </template>
-            </el-table-column>
-            <el-table-column label="话术简介" align="center" prop="scriptIntroduction" :show-overflow-tooltip="true" />
-            <el-table-column label="病种名称" align="center" prop="diseaseTypeName" :show-overflow-tooltip="true" />
-            <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
-              <template slot-scope="scope">
-                <el-button size="mini" type="text" icon="el-icon-search" @click="handlesee(scope.row)">预览</el-button>
-                <el-button size="mini" type="text" icon="el-icon-zoom-in" @click="see(scope.row)">话术</el-button>
-                <el-button size="mini" type="text" icon="el-icon-picture-outline"
-                  @click="seescript(scope.row)">话术预览</el-button>
-
-
-                <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
-                  v-hasPermi="['manage:script:edit']">修改</el-button>
-                <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
-                  v-hasPermi="['manage:script:remove']">删除</el-button>
-              </template>
-            </el-table-column>
-          </el-table>
-        </div>
+          <el-table-column label="通用话术名称" align="center" prop="commonScriptName" :show-overflow-tooltip="true" />
+          <el-table-column label="话术名称" align="center" prop="scriptName" :show-overflow-tooltip="true" />
+          <el-table-column label="话术ID" align="center" prop="scriptId" :show-overflow-tooltip="true" />
+          <el-table-column label="平台ID" align="center" prop="platformId" :show-overflow-tooltip="true" />
+          <el-table-column label="话术状态" align="center" prop="scriptStatus">
+            <template slot-scope="scope">
+              {{ scope.row.scriptStatus == "NORMAL" ? "正常" : "" }}
+              {{ scope.row.scriptStatus == "OFF_SHELF" ? "下架" : "" }}
+              {{ scope.row.scriptStatus == "SUSPEND" ? "暂停" : "" }}
+            </template>
+          </el-table-column>
+          <el-table-column label="话术简介" align="center" prop="scriptIntroduction" :show-overflow-tooltip="true" />
+          <el-table-column label="病种名称" align="center" prop="diseaseTypeName" :show-overflow-tooltip="true" />
+          <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="200">
+            <template slot-scope="scope">
+              <el-button size="mini" type="text"  icon="el-icon-folder-delete" v-if="scope.row.releaseStatus == 'PUBLISHED'"
+                @click="norelease(scope.row)">取消发布</el-button>
+              <el-button size="mini" icon="el-icon-folder-checked" type="text" v-else @click="release(scope.row)">发布</el-button>
+              <el-button size="mini" type="text" icon="el-icon-search" @click="handlesee(scope.row)">预览</el-button>
+              <el-button size="mini" type="text" icon="el-icon-zoom-in" @click="see(scope.row)">话术</el-button>
+              <el-button size="mini" type="text" icon="el-icon-picture-outline" @click="seescript(scope.row)">话术预览</el-button>
+              <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
+                v-hasPermi="['manage:script:edit']">修改</el-button>
+              <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
+                v-hasPermi="['manage:script:remove']">删除</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
         <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
           :limit.sync="queryParams.pageSize" @pagination="getList" />
       </el-col>
@@ -252,7 +246,6 @@ export default {
   name: "Script",
   data() {
     return {
-      maxTableHeight: undefined,
       obj: null,
       itemname: null,
       departmentName: null,
@@ -448,10 +441,6 @@ export default {
     this.Departmentlist();
 
   },
-  mounted() {
-    this.getMaxTableHeight()
-    this.screenChange()
-  },
   watch: {
     name(val) {
       this.querydepartmen.departmentName = val
@@ -513,6 +502,40 @@ export default {
 
       }
 
+    },
+     //发布
+     release(item) {
+      this.$confirm('是否发布此话术?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+      }).then(() => {
+        var obj = { ...item }
+        obj.releaseStatus = 'PUBLISHED'
+        editReleaseStatus(obj).then(response => {
+          this.$message({
+            type: 'success',
+            message: '发布成功!'
+          });
+          this.getList();
+        });
+      })
+    },
+    //取消发布
+    norelease(item) {
+      this.$confirm('是否取消发布此话术?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+      }).then(() => {
+        var obj = { ...item }
+        obj.releaseStatus = 'REVOKE'
+        editReleaseStatus(obj).then(response => {
+          this.$message({
+            type: 'success',
+            message: '取消发布成功!'
+          });
+          this.getList();
+        });
+      })
     },
 
     // 预览关闭
@@ -834,30 +857,7 @@ export default {
       this.download('manage/script/export', {
         ...this.queryParams
       }, `script_${new Date().getTime()}.xlsx`)
-    },
-    // 获取表格最高高度
-    getMaxTableHeight() {
-      const windowInnerHeight = window.innerHeight // 屏幕可视高度
-      const layoutDiv = this.$refs.layout
-      const formDiv = this.$refs.form
-      const mb8Div = this.$refs.mb8
-      this.maxTableHeight =
-        windowInnerHeight - 134 -
-        this.getBoxPadding(layoutDiv) -
-        this.getBoxHeight(mb8Div) -
-        this.getBoxHeight(formDiv)
-    },
-    // 屏幕resize监听
-    screenChange() {
-      // 屏幕resize监听事件：一旦屏幕宽高发生变化，就会执行resize
-      window.addEventListener('resize', this.getMaxTableHeight, true)
-      // 将屏幕监听事件移除
-      // 这步是必须的。离开页面时不移除，再返回，或者进入到别的有相同元素的页面会报错
-      // 或者将这里的方法直接写在beforeDestroy函数中也可以
-      this.$once('hook:beforeDestroy', () => {
-        window.removeEventListener('resize', this.getMaxTableHeight, true)
-      })
-    },
+    }
   }
 };
 </script>
@@ -921,12 +921,4 @@ export default {
   left: 20px;
   top: -11px;
 }
-
-.app-container {
-  padding: 20px 0 0 20px !important;
-}
-
-::v-deep .el-row {
-  height: 100% !important;
-}
 </style>