|  |  | 
 |  |  |   <div class="Questionnairemanagement"> | 
 |  |  |     <!-- 左侧栏 --> | 
 |  |  |     <div class="sidecolumn"> | 
 |  |  |       <div class="notebuttom"><i class="el-icon-chat-dot-square" />发短信</div> | 
 |  |  |       <div class="notebuttom" @click="handleAdd"> | 
 |  |  |         <i class="el-icon-chat-dot-square" />发短信 | 
 |  |  |       </div> | 
 |  |  |       <el-divider></el-divider> | 
 |  |  |       <div class="notestate"> | 
 |  |  |         <div class="state-text">短信状态</div> | 
 |  |  |         <div class="state-line"> | 
 |  |  |           <div class="value-left"> | 
 |  |  |             <i class="el-icon-chat-dot-square" />全部 | 
 |  |  |           </div> | 
 |  |  |         <div | 
 |  |  |           :class="classestag == 1 ? 'state-lines' : 'state-line'" | 
 |  |  |           @click="completefn" | 
 |  |  |         > | 
 |  |  |           <div class="value-left"><i class="el-icon-menu" />全部</div> | 
 |  |  |           <div class="quantityq">22</div> | 
 |  |  |         </div> | 
 |  |  |         <div class="state-line"> | 
 |  |  |         <div | 
 |  |  |           :class="classestag == 2 ? 'state-lines' : 'state-line'" | 
 |  |  |           @click="succeedfn" | 
 |  |  |         > | 
 |  |  |           <div class="value-left"> | 
 |  |  |             <i class="el-icon-chat-dot-square" />发送成功 | 
 |  |  |             <i class="el-icon-circle-check" />发送成功 | 
 |  |  |           </div> | 
 |  |  |           <div class="quantitycg">22</div> | 
 |  |  |         </div> | 
 |  |  |         <div class="state-line"> | 
 |  |  |         <div | 
 |  |  |           :class="classestag == 3 ? 'state-lines' : 'state-line'" | 
 |  |  |           @click="losefn" | 
 |  |  |         > | 
 |  |  |           <div class="value-left"> | 
 |  |  |             <i class="el-icon-chat-dot-square" />发送失败 | 
 |  |  |             <i class="el-icon-warning-outline" />发送失败 | 
 |  |  |           </div> | 
 |  |  |           <div class="quantitysb">22</div> | 
 |  |  |         </div> | 
 |  |  |         <div class="state-line"> | 
 |  |  |           <div class="value-left"> | 
 |  |  |             <i class="el-icon-chat-dot-square" />待发送 | 
 |  |  |           </div> | 
 |  |  |         <div | 
 |  |  |           :class="classestag == 4 ? 'state-lines' : 'state-line'" | 
 |  |  |           @click="awaitfn" | 
 |  |  |         > | 
 |  |  |           <div class="value-left"><i class="el-icon-s-help" />待随访</div> | 
 |  |  |           <div class="quantityd">22</div> | 
 |  |  |         </div> | 
 |  |  |       </div> | 
 |  |  |     </div> | 
 |  |  |     <!-- 右侧数据 --> | 
 |  |  |     <div class="leftvlue"> | 
 |  |  |       <div class="leftvlue-top">短信详情</div> | 
 |  |  |       <div class="leftvlue-top">短信详情({{ total }})</div> | 
 |  |  |       <div class="leftvlue-bg"> | 
 |  |  |         <el-row :gutter="20"> | 
 |  |  |           <!--用户数据--> | 
 |  |  | 
 |  |  |                   @keyup.enter.native="handleQuery" | 
 |  |  |                 /> | 
 |  |  |               </el-form-item> | 
 |  |  |               <el-form-item label="创建时间"> | 
 |  |  |               <el-form-item label="上传日期"> | 
 |  |  |                 <el-date-picker | 
 |  |  |                   v-model="dateRange" | 
 |  |  |                   style="width: 240px" | 
 |  |  | 
 |  |  |                 prop="userId" | 
 |  |  |               /> | 
 |  |  |               <el-table-column | 
 |  |  |                 label="主旨" | 
 |  |  |                 label="手机号码" | 
 |  |  |                 align="center" | 
 |  |  |                 key="userName" | 
 |  |  |                 prop="userName" | 
 |  |  |                 :show-overflow-tooltip="true" | 
 |  |  |               /> | 
 |  |  |               <el-table-column | 
 |  |  |                 label="问题文本" | 
 |  |  |                 label="类型" | 
 |  |  |                 align="center" | 
 |  |  |                 key="nickName" | 
 |  |  |                 prop="nickName" | 
 |  |  |                 width="400" | 
 |  |  |                 :show-overflow-tooltip="true" | 
 |  |  |               /> | 
 |  |  |  | 
 |  |  |               <el-table-column | 
 |  |  |                 label="问题语音" | 
 |  |  |                 label="发送人" | 
 |  |  |                 align="center" | 
 |  |  |                 key="aphonenumber" | 
 |  |  |                 prop="aphonenumber" | 
 |  |  |                 width="400" | 
 |  |  |                 key="transmitleg" | 
 |  |  |                 prop="transmitleg" | 
 |  |  |               /><el-table-column | 
 |  |  |                 label="关联指标" | 
 |  |  |                 label="接收人" | 
 |  |  |                 align="center" | 
 |  |  |                 key="bphonenumber" | 
 |  |  |                 prop="bphonenumber" | 
 |  |  |                 width="120" | 
 |  |  |               /> | 
 |  |  |               <el-table-column | 
 |  |  |                 label="指标选项" | 
 |  |  |                 label="上传时间" | 
 |  |  |                 align="center" | 
 |  |  |                 key="bphonenumber" | 
 |  |  |                 prop="bphonenumber" | 
 |  |  |                 width="120" | 
 |  |  |               /> | 
 |  |  |               <el-table-column | 
 |  |  |                 label="语言" | 
 |  |  |                 align="center" | 
 |  |  |                 key="indicator" | 
 |  |  |                 prop="indicator" | 
 |  |  |                 width="120" | 
 |  |  |               /> | 
 |  |  |               <el-table-column label="是否启用" align="center" key="status"> | 
 |  |  |                 prop="createTime" | 
 |  |  |                 width="160" | 
 |  |  |               > | 
 |  |  |                 <template slot-scope="scope"> | 
 |  |  |                   <el-switch | 
 |  |  |                     v-model="scope.row.status" | 
 |  |  |                     active-value="0" | 
 |  |  |                     inactive-value="1" | 
 |  |  |                     @change="handleStatusChange(scope.row)" | 
 |  |  |                   ></el-switch> | 
 |  |  |                   <span>{{ formatTime(scope.row.createTime) }}</span> | 
 |  |  |                 </template> </el-table-column | 
 |  |  |               ><el-table-column | 
 |  |  |                 label="发送时间" | 
 |  |  |                 align="center" | 
 |  |  |                 prop="createTime" | 
 |  |  |                 width="160" | 
 |  |  |               > | 
 |  |  |                 <template slot-scope="scope"> | 
 |  |  |                   <span>{{ formatTime(scope.row.createTime) }}</span> | 
 |  |  |                 </template> | 
 |  |  |               </el-table-column> | 
 |  |  |               <el-table-column | 
 |  |  |                 label="发送内容" | 
 |  |  |                 align="center" | 
 |  |  |                 key="sendvalue" | 
 |  |  |                 prop="sendvalue" | 
 |  |  |                 width="300" | 
 |  |  |                 :show-overflow-tooltip="true" | 
 |  |  |               /> | 
 |  |  |               <el-table-column | 
 |  |  |                 label="发送状态" | 
 |  |  |                 align="center" | 
 |  |  |                 key="state" | 
 |  |  |                 prop="state" | 
 |  |  |               > | 
 |  |  |                 <template slot-scope="scope"> | 
 |  |  |                   <div | 
 |  |  |                     v-if="scope.row.state == 1" | 
 |  |  |                     style="color: rgb(58, 250, 144)" | 
 |  |  |                   > | 
 |  |  |                     <i class="el-icon-check"></i> | 
 |  |  |                   </div> | 
 |  |  |                   <div | 
 |  |  |                     v-else-if="scope.row.state == 2" | 
 |  |  |                     style="color: rgb(250, 96, 58)" | 
 |  |  |                   > | 
 |  |  |                     <i class="el-icon-check"></i> | 
 |  |  |                   </div> | 
 |  |  |                 </template> | 
 |  |  |               </el-table-column> | 
 |  |  |  | 
 |  |  |               <el-table-column | 
 |  |  |                 label="操作" | 
 |  |  |                 align="center" | 
 |  |  |                 width="200" | 
 |  |  |                 class-name="small-padding fixed-width" | 
 |  |  |               > | 
 |  |  |                 <template slot-scope="scope"> | 
 |  |  | 
 |  |  |                     @click="handleUpdate(scope.row)" | 
 |  |  |                     v-hasPermi="['system:user:edit']" | 
 |  |  |                     ><span class="button-textxg" | 
 |  |  |                       ><i class="el-icon-edit-outline"></i>修改</span | 
 |  |  |                     ></el-button | 
 |  |  |                   > | 
 |  |  |                   <el-button | 
 |  |  |                     size="medium" | 
 |  |  |                     type="text" | 
 |  |  |                     @click="compileUpdate(scope.row)" | 
 |  |  |                     v-hasPermi="['system:user:edit']" | 
 |  |  |                     ><span class="button-bji" | 
 |  |  |                       ><i class="el-icon-edit"></i>编辑短信</span | 
 |  |  |                     ></el-button | 
 |  |  |                   > | 
 |  |  |                   <el-button | 
 |  |  |                     size="medium" | 
 |  |  |                     type="text" | 
 |  |  |                     @click="handleDelete(scope.row)" | 
 |  |  |                     v-hasPermi="['system:user:remove']" | 
 |  |  |                     ><span class="button-textsc" | 
 |  |  |                       ><i class="el-icon-delete-solid"></i>删除</span | 
 |  |  |                       ><i class="el-icon-edit-outline"></i>再次发送</span | 
 |  |  |                     ></el-button | 
 |  |  |                   > | 
 |  |  |                 </template> | 
 |  |  | 
 |  |  |   components: { Treeselect }, | 
 |  |  |   data() { | 
 |  |  |     return { | 
 |  |  |       topactiveName: "Local", //顶部选择 | 
 |  |  |       // 遮罩层 | 
 |  |  |       loading: false, | 
 |  |  |       // 选中数组 | 
 |  |  | 
 |  |  |       showSearch: true, | 
 |  |  |       // 总条数 | 
 |  |  |       total: 0, | 
 |  |  |       classestag: 1, //类别标识 | 
 |  |  |       namequestionnaire: "", | 
 |  |  |       haoquestionnaire: "", | 
 |  |  |       idds: "", | 
 |  |  | 
 |  |  |         console.log(this.userList); | 
 |  |  |       }); | 
 |  |  |     }, | 
 |  |  |     // 添加、修改类别 | 
 |  |  |     submitsidecolumn() { | 
 |  |  |       if (this.amendtag) { | 
 |  |  |         this.classifyform.tagcategoryid = this.idds; | 
 |  |  |         // toamendtagcategory(this.addDateRange(this.classifyform)).then( | 
 |  |  |         //   (response) => { | 
 |  |  |         //     console.log(response); | 
 |  |  |         //     this.gitclasify(); | 
 |  |  |         //   } | 
 |  |  |         // ); | 
 |  |  |       } else { | 
 |  |  |         // addtagcategory(this.addDateRange(this.classifyform)).then( | 
 |  |  |         //   (response) => { | 
 |  |  |         //     console.log(response); | 
 |  |  |         //     this.gitclasify(); | 
 |  |  |         //   } | 
 |  |  |         // ); | 
 |  |  |       } | 
 |  |  |       this.classifyform = { | 
 |  |  |         categoryname: "", | 
 |  |  |       }; | 
 |  |  |       this.idds = ""; | 
 |  |  |       this.dialogFormVisible = false; | 
 |  |  |     }, | 
 |  |  |     //删除分类 | 
 |  |  |     deletefenlei(row) { | 
 |  |  |       if (this.deleteVisible) { | 
 |  |  |         // deletetagcategory(this.idds).then((response) => { | 
 |  |  |         //   console.log(response); | 
 |  |  |         //   this.gitclasify(); | 
 |  |  |         // }); | 
 |  |  |         this.deleteVisible = false; | 
 |  |  |         this.idds = ""; | 
 |  |  |       } else { | 
 |  |  |         this.deleteVisible = true; | 
 |  |  |         this.idds = row.tagcategoryid; | 
 |  |  |         this.deletefenl = row.title; | 
 |  |  |       } | 
 |  |  |     }, | 
 |  |  |     compileUpdate(row) { | 
 |  |  |       this.$router.push({ | 
 |  |  |         path: "/repositoryai/verbaltrick/particulars/", | 
 |  |  |         query: { id: "1" }, | 
 |  |  |       }); | 
 |  |  |     }, | 
 |  |  |     // 题目状态修改 | 
 |  |  |     handleStatusChange(row) { | 
 |  |  |       let text = row.status === "0" ? "启用" : "停用"; | 
 |  |  |       this.$modal | 
 |  |  |         .confirm('确认要"' + text + '""' + row.userName + '"用户吗?') | 
 |  |  |         .then(function () { | 
 |  |  |           return changeUserStatus(row.userId, row.status); | 
 |  |  |         }) | 
 |  |  |         .then(() => { | 
 |  |  |           this.$modal.msgSuccess(text + "成功"); | 
 |  |  |         }) | 
 |  |  |         .catch(function () { | 
 |  |  |           row.status = row.status === "0" ? "1" : "0"; | 
 |  |  |         }); | 
 |  |  |     }, | 
 |  |  |     //搜索类别 | 
 |  |  |     sidecolumnss() {}, | 
 |  |  |     // const { pageNum, pageSize, ...params } = this.queryParams; | 
 |  |  |     submitsidecolumn() {}, | 
 |  |  |     deletefenlei() {}, | 
 |  |  |     // 便捷标签 | 
 |  |  |     tsgnameto() {}, | 
 |  |  |     // 切换共享/本地 | 
 |  |  | 
 |  |  |     }, | 
 |  |  |     /** 新增按钮操作 */ | 
 |  |  |     handleAdd() { | 
 |  |  |       this.reset(); | 
 |  |  |       this.title = "新增短信"; | 
 |  |  |       this.indexopen = true; | 
 |  |  |       this.$router.push("/shortmessage/messagebank/compile/"); | 
 |  |  |     }, | 
 |  |  |     /** 修改按钮操作 */ | 
 |  |  |     handleUpdate(row) { | 
 |  |  | 
 |  |  |         }) | 
 |  |  |         .catch(() => {}); | 
 |  |  |     }, | 
 |  |  |     // 切换全部类别 | 
 |  |  |     completefn() { | 
 |  |  |       this.classestag = 1; | 
 |  |  |     }, | 
 |  |  |     // 切换成功类别 | 
 |  |  |     succeedfn() { | 
 |  |  |       this.classestag = 2; | 
 |  |  |     }, | 
 |  |  |     // 切换失败类别 | 
 |  |  |     losefn() { | 
 |  |  |       this.classestag = 3; | 
 |  |  |     }, | 
 |  |  |     // 切换待随访类别 | 
 |  |  |     awaitfn() { | 
 |  |  |       this.classestag = 4; | 
 |  |  |     }, | 
 |  |  |   }, | 
 |  |  | }; | 
 |  |  | </script> | 
 |  |  | 
 |  |  |   display: flex; | 
 |  |  | } | 
 |  |  | .sidecolumn { | 
 |  |  |   width: 300px; | 
 |  |  |   width: 350px; | 
 |  |  |   min-height: 100vh; | 
 |  |  |   text-align: center; | 
 |  |  |   //   display: flex; | 
 |  |  |   margin-top: 20px; | 
 |  |  |   margin: 20px; | 
 |  |  |   padding: 30px; | 
 |  |  |   background: #edf1f7; | 
 |  |  |   padding: 10px; | 
 |  |  |   padding-top: 20px; | 
 |  |  |   text-align: center; | 
 |  |  |   background: #dfeffd; | 
 |  |  |   border: 1px solid #dcdfe6; | 
 |  |  |   -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12), | 
 |  |  |     0 0 6px 0 rgba(0, 0, 0, 0.04); | 
 |  |  |   .sidecolumn-top { | 
 |  |  |     display: flex; | 
 |  |  |     justify-content: space-between; | 
 |  |  |     .top-wj { | 
 |  |  |       font-size: 20px; | 
 |  |  |   .notebuttom { | 
 |  |  |     height: 35px; | 
 |  |  |     background: #85c046; | 
 |  |  |     color: #ffff; | 
 |  |  |     font-size: 20px; | 
 |  |  |     line-height: 35px; | 
 |  |  |     cursor: pointer; | 
 |  |  |     border-radius: 3px; | 
 |  |  |   } | 
 |  |  |   .notestate { | 
 |  |  |     font-size: 20px; | 
 |  |  |     .state-text { | 
 |  |  |       height: 40px; | 
 |  |  |     } | 
 |  |  |     .top-tj { | 
 |  |  |       font-size: 18px; | 
 |  |  |  | 
 |  |  |       color: rgb(0, 89, 255); | 
 |  |  |     .state-line { | 
 |  |  |       display: flex; | 
 |  |  |       height: 40px; | 
 |  |  |       align-items: center; | 
 |  |  |       padding: 10px 10px; | 
 |  |  |       cursor: pointer; | 
 |  |  |       justify-content: space-between; | 
 |  |  |     } | 
 |  |  |   } | 
 |  |  |   .center-ss { | 
 |  |  |     margin-top: 30px; | 
 |  |  |     .input-with-select { | 
 |  |  |       height: 40px !important; | 
 |  |  |     .state-lines { | 
 |  |  |       display: flex; | 
 |  |  |       height: 40px; | 
 |  |  |       align-items: center; | 
 |  |  |       padding: 10px 10px; | 
 |  |  |       background: #88abfc; | 
 |  |  |       color: #fff; | 
 |  |  |       cursor: pointer; | 
 |  |  |       justify-content: space-between; | 
 |  |  |     } | 
 |  |  |   } | 
 |  |  |   .bottom-fl { | 
 |  |  |     margin-top: 30px; | 
 |  |  |     display: center !important; | 
 |  |  |     .state-line:hover { | 
 |  |  |       background: #88abfc; | 
 |  |  |     } | 
 |  |  |     .quantityq { | 
 |  |  |       height: 30px; | 
 |  |  |       line-height: 30px; | 
 |  |  |       padding: 0 5px; | 
 |  |  |       border-radius: 10px; | 
 |  |  |       color: #fff; | 
 |  |  |       background: #9eb8ff; | 
 |  |  |     } | 
 |  |  |     .quantitycg { | 
 |  |  |       height: 30px; | 
 |  |  |       line-height: 30px; | 
 |  |  |       padding: 0 5px; | 
 |  |  |       border-radius: 10px; | 
 |  |  |       color: #fff; | 
 |  |  |  | 
 |  |  |       background: #48cf2d; | 
 |  |  |     } | 
 |  |  |     .quantitysb { | 
 |  |  |       height: 30px; | 
 |  |  |       line-height: 30px; | 
 |  |  |       padding: 0 5px; | 
 |  |  |       border-radius: 10px; | 
 |  |  |       color: #fff; | 
 |  |  |  | 
 |  |  |       background: #ce513b; | 
 |  |  |     } | 
 |  |  |     .quantityd { | 
 |  |  |       height: 30px; | 
 |  |  |       line-height: 30px; | 
 |  |  |       padding: 0 5px; | 
 |  |  |       border-radius: 10px; | 
 |  |  |       color: #fff; | 
 |  |  |  | 
 |  |  |       background: #3fbff1; | 
 |  |  |     } | 
 |  |  |   } | 
 |  |  | } | 
 |  |  | .qrcode-dialo { | 
 |  |  |   text-align: center; | 
 |  |  |   //   display: flex; | 
 |  |  |   margin: 20px; | 
 |  |  |   padding: 30px; | 
 |  |  |   background: #edf1f7; | 
 |  |  |   border: 1px solid #dcdfe6; | 
 |  |  |   -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12), | 
 |  |  |     0 0 6px 0 rgba(0, 0, 0, 0.04); | 
 |  |  |   .qrcode-text { | 
 |  |  |     font-size: 20px; | 
 |  |  |     span { | 
 |  |  |       margin-left: 20px; | 
 |  |  |     } | 
 |  |  |   } | 
 |  |  |   .qrcode-img { | 
 |  |  |     width: 300px; | 
 |  |  |     height: 400px; | 
 |  |  |   } | 
 |  |  | [class^="el-icon-"], | 
 |  |  | [class*=" el-icon-"] { | 
 |  |  |   font-weight: 600; | 
 |  |  |   font-size: 20px; | 
 |  |  | } | 
 |  |  | .tsgname { | 
 |  |  |   width: 90px; |