{"remainingRequest":"D:\\front\\item\\zyAdmin\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\front\\item\\zyAdmin\\src\\pages\\kefu\\components\\words.vue?vue&type=style&index=1&id=67b11d42&lang=css","dependencies":[{"path":"D:\\front\\item\\zyAdmin\\src\\pages\\kefu\\components\\words.vue","mtime":1761614939021},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\css-loader\\index.js","mtime":1761614929364},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":1761614937403},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\postcss-loader\\src\\index.js","mtime":1761614935133},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\cache-loader\\dist\\cjs.js","mtime":1761614927801},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\vue-loader\\lib\\index.js","mtime":1761614937402}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:DQoua2ZfbW9iaWxlIC5pdnUtbW9kYWwtd3JhcCB7DQogIGRpc3BsYXk6IGZsZXg7DQogIGFsaWduLWl0ZW1zOiBjZW50ZXI7DQogIGp1c3RpZnktY29udGVudDogY2VudGVyOw0KfQ0KLnZlcnRpY2FsLWNlbnRlci1tb2RhbCB7DQogIGRpc3BsYXk6IGZsZXg7DQogIGFsaWduLWl0ZW1zOiBjZW50ZXI7DQogIGp1c3RpZnktY29udGVudDogY2VudGVyOw0KfQ0KLml2dS1tb2RhbCB7DQogIHRvcDogMDsNCn0NCi5ub2lucHV0IGlucHV0LA0KLm5vaW5wdXQgdGV4dGFyZWEgew0KICBib3JkZXItY29sb3I6IHRyYW5zcGFyZW50ICFpbXBvcnRhbnQ7DQogIGJhY2tncm91bmQ6IHRyYW5zcGFyZW50ICFpbXBvcnRhbnQ7DQogIHJlc2l6ZTogbm9uZTsNCn0NCi5ub2lucHV0IGlucHV0OmhvdmVyLA0KLm5vaW5wdXQgaW5wdXQ6Zm9jdXMsDQoubm9pbnB1dCB0ZXh0YXJlYTpob3ZlciwNCi5ub2lucHV0IHRleHRhcmVhOmZvY3VzIHsNCiAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudCAhaW1wb3J0YW50Ow0KICBib3gtc2hhZG93OiBub25lICFpbXBvcnRhbnQ7DQp9DQo="},{"version":3,"sources":["words.vue"],"names":[],"mappings":";AAu1BA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"words.vue","sourceRoot":"src/pages/kefu/components","sourcesContent":["<template>\r\n  <div>\r\n    <!-- 常用语 -->\r\n    <div class=\"words-mask\" v-if=\"isWords\">\r\n      <div class=\"content\">\r\n        <div class=\"title-box\">\r\n          <div class=\"tab-box\">\r\n            <div\r\n              class=\"tan-item\"\r\n              :class=\"{ on: item.key == wordsTabCur }\"\r\n              v-for=\"(item, index) in wordsTab\"\r\n              v-db-click\r\n              @click.stop=\"bindTab(item)\"\r\n            >\r\n              {{ item.title }}\r\n            </div>\r\n            <div class=\"right-icon\">\r\n              <span class=\"iconfont iconbianji2\" v-db-click @click.stop=\"isWordShow = true\"></span>\r\n              <span class=\"iconfont iconcha\" v-db-click @click.stop=\"closeBox\"></span>\r\n            </div>\r\n          </div>\r\n          <div class=\"input-box\">\r\n            <el-input v-model=\"wordsData.searchTxt\" placeholder=\"搜索快捷回复\" :search=\"true\" @on-search=\"bindSearch\" />\r\n          </div>\r\n        </div>\r\n        <div class=\"scroll-box\">\r\n          <div class=\"scroll-left\">\r\n            <div class=\"left-item add_cate\" v-db-click @click.stop=\"openCate(0)\" v-if=\"wordsTabCur\">\r\n              <span class=\"iconfont iconjiahao\"></span> 分组\r\n            </div>\r\n            <div\r\n              class=\"left-item\"\r\n              :class=\"{ active: wordsData.cateId == item.id }\"\r\n              v-for=\"item in wordsData.cate\"\r\n              v-db-click\r\n              @click.stop=\"changeCate(item)\"\r\n            >\r\n              {{ item.name }}\r\n            </div>\r\n          </div>\r\n          <div class=\"right-box\">\r\n            <vue-scroll :ops=\"wordsData.ops\" @load-before-deactivate=\"handleWordsScroll\">\r\n              <div class=\"slot-load\" slot=\"load-deactive\"></div>\r\n              <div class=\"slot-load\" slot=\"load-beforeDeactive\"></div>\r\n              <div class=\"slot-load\" slot=\"load-active\">下滑加载更多</div>\r\n              <div class=\"msg-item add-mg\" v-show=\"wordsTabCur\" v-db-click @click.stop=\"addMsg\">\r\n                <span class=\"iconfont icontianjia11\"></span>添加话术\r\n              </div>\r\n              <div\r\n                class=\"msg-item\"\r\n                v-for=\"(item, index) in wordsList\"\r\n                :key=\"index\"\r\n                v-db-click\r\n                @click.stop=\"selectWords(item)\"\r\n              >\r\n                <span class=\"title\">{{ item.title }}</span\r\n                >{{ item.message }}\r\n              </div>\r\n            </vue-scroll>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n    <!-- 添加分组  -->\r\n    <el-dialog\r\n      :visible.sync=\"cateData.isCate\"\r\n      width=\"470px\"\r\n      :show-close=\"true\"\r\n      custom-class=\"vertical-center-modal\"\r\n      class=\"words-box\"\r\n    >\r\n      <div class=\"mask-title\">\r\n        {{ cateData.status ? '编辑分组' : '新增分组' }}\r\n        <span class=\"iconfont iconcha\" v-db-click @click.stop=\"closeCate\"></span>\r\n      </div>\r\n      <div class=\"input-box\">\r\n        <el-input class=\"noinput\" v-model=\"cateData.name\" placeholder=\"请输入分组名称\" />\r\n      </div>\r\n      <div class=\"input-box\">\r\n        <el-input class=\"noinput\" v-model=\"cateData.sort\" placeholder=\"请输入分组排序\" />\r\n      </div>\r\n      <el-button v-db-click @click.stop=\"cateConfirm\" class=\"subBtn\" type=\"primary\" :disabled=\"cateStatus\"\r\n        >确定</el-button\r\n      >\r\n    </el-dialog>\r\n    <!-- 添加话术  -->\r\n    <el-dialog\r\n      :visible.sync=\"msgData.isCateMeg\"\r\n      width=\"470px\"\r\n      :show-close=\"true\"\r\n      custom-class=\"vertical-center-modal\"\r\n      class=\"words-box\"\r\n    >\r\n      <div class=\"mask-title\">\r\n        {{ msgData.status ? '修改话术' : '添加话术' }}\r\n        <span class=\"iconfont iconcha\" v-db-click @click.stop=\"closeMsgBox\"></span>\r\n      </div>\r\n      <div class=\"input-box\">\r\n        <el-input class=\"noinput\" v-model=\"msgData.title\" placeholder=\"请输入标题名称 (选填)\" />\r\n      </div>\r\n      <div class=\"input-box text-area\">\r\n        <el-input class=\"noinput\" :rows=\"4\" type=\"textarea\" v-model=\"msgData.message\" placeholder=\"请输入您的话术\" />\r\n      </div>\r\n      <div class=\"input-box\">\r\n        <el-select v-model=\"msgData.msgCateId\">\r\n          <el-option v-for=\"item in selectData\" :value=\"item.id\" :key=\"item.value\" :label=\"item.name\"></el-option>\r\n        </el-select>\r\n      </div>\r\n      <el-button v-db-click @click.stop=\"msgConfirm\" class=\"subBtn\" type=\"primary\" :disabled=\"msgStatus\"\r\n        >确定</el-button\r\n      >\r\n    </el-dialog>\r\n    <!-- 编辑弹窗  -->\r\n    <div class=\"edit-box\" v-if=\"isWordShow\">\r\n      <div class=\"head\">\r\n        <div class=\"tit-bar\">\r\n          {{ wordsTabCur ? '个人库' : '公共库' }}<span v-db-click @click.stop=\"isWordShow = false\">完成</span>\r\n        </div>\r\n        <div class=\"input-box noinput\">\r\n          <el-input v-model=\"wordsData.searchTxt\" placeholder=\"搜索快捷回复\" :search=\"true\" @on-search=\"bindSearch\" />\r\n        </div>\r\n      </div>\r\n      <div class=\"scroll-box\">\r\n        <div class=\"scroll-left\">\r\n          <div class=\"top\">\r\n            <div class=\"left-item add_cate\" v-db-click @click.stop=\"openCate(0)\" v-if=\"wordsTabCur\">\r\n              <span class=\"iconfont iconjiahao\"></span> 分组\r\n            </div>\r\n            <div\r\n              class=\"left-item\"\r\n              :class=\"{ active: wordsData.cateId == item.id }\"\r\n              v-for=\"item in wordsData.cate\"\r\n              v-db-click\r\n              @click.stop=\"changeCate(item)\"\r\n            >\r\n              {{ item.name }}\r\n            </div>\r\n          </div>\r\n          <div class=\"bom\" v-if=\"wordsTabCur\">\r\n            <div class=\"left-item edits-box\" v-db-click @click.stop=\"editList.status = true\">编辑分组</div>\r\n          </div>\r\n        </div>\r\n        <div class=\"right-box\">\r\n          <vue-scroll :ops=\"wordsData.ops\" @load-before-deactivate=\"handleWordsScroll\">\r\n            <div class=\"slot-load\" slot=\"load-deactive\"></div>\r\n            <div class=\"slot-load\" slot=\"load-beforeDeactive\"></div>\r\n            <div class=\"slot-load\" slot=\"load-active\">下滑加载更多</div>\r\n            <div class=\"msg-item\" v-for=\"(item, index) in wordsList\" :key=\"index\">\r\n              <span class=\"title\">{{ item.title }}</span\r\n              >{{ item.message }}\r\n              <div class=\"edit-bar\" v-if=\"wordsTabCur\">\r\n                <span class=\"iconfont iconbianji1\" v-db-click @click.stop=\"bindEdit(item)\"></span>\r\n                <span class=\"iconfont iconshanchu1\" v-db-click @click.stop=\"delMsg(item, '删除话术', index)\"></span>\r\n              </div>\r\n            </div>\r\n          </vue-scroll>\r\n        </div>\r\n      </div>\r\n    </div>\r\n    <!-- 编辑分组列表 -->\r\n    <el-dialog\r\n      :visible.sync=\"editList.status\"\r\n      width=\"470px\"\r\n      :show-close=\"true\"\r\n      custom-class=\"vertical-center-modal\"\r\n      class=\"words-box cate-list\"\r\n    >\r\n      <div class=\"mask-title\">\r\n        编辑分组\r\n        <span class=\"iconfont iconcha\" v-db-click @click.stop=\"editList.status = false\"></span>\r\n      </div>\r\n      <div class=\"list-box\">\r\n        <div class=\"item\" v-for=\"(item, index) in wordsData.cate\" :index=\"index\">\r\n          <span>{{ item.name }}</span>\r\n          <div class=\"right-box\">\r\n            <span class=\"iconfont iconbianji1\" v-if=\"index > 0\" v-db-click @click.stop=\"openCate(1, item)\"></span>\r\n            <span\r\n              class=\"iconfont iconshanchu1\"\r\n              v-if=\"index > 0\"\r\n              v-db-click\r\n              @click.stop=\"delCate(item, '删除分组', index)\"\r\n            ></span>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </el-dialog>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport {\r\n  speeChcraft,\r\n  serviceCate,\r\n  addServiceCate,\r\n  addSpeeChcraft,\r\n  serviceCateUpdate,\r\n  editServiceCate,\r\n} from '@/api/kefu';\r\nexport default {\r\n  name: 'words',\r\n  props: {\r\n    isWords: {\r\n      type: Boolean,\r\n      default: false,\r\n    },\r\n  },\r\n  computed: {\r\n    cateStatus() {\r\n      if (this.cateData.name && this.cateData.sort) {\r\n        return false;\r\n      } else {\r\n        return true;\r\n      }\r\n    },\r\n    msgStatus() {\r\n      if (this.msgData.message) {\r\n        return false;\r\n      } else {\r\n        return true;\r\n      }\r\n    },\r\n  },\r\n  data() {\r\n    return {\r\n      isWordShow: false, // 编辑窗\r\n      wordsList: [],\r\n      wordsTab: [\r\n        {\r\n          title: '个人库',\r\n          key: 1,\r\n        },\r\n        {\r\n          title: '公共库',\r\n          key: 0,\r\n        },\r\n      ],\r\n      wordsTabCur: 1,\r\n      wordsData: {\r\n        isScroll: true,\r\n        ops: {\r\n          vuescroll: {\r\n            mode: 'slide',\r\n            enable: false,\r\n            tips: {\r\n              deactive: 'Push to Load',\r\n              active: 'Release to Load',\r\n              start: 'Loading...',\r\n              beforeDeactive: 'Load Successfully!',\r\n            },\r\n            auto: false,\r\n            autoLoadDistance: 0,\r\n            pullRefresh: {\r\n              enable: false,\r\n            },\r\n            pushLoad: {\r\n              enable: true,\r\n              auto: true,\r\n              autoLoadDistance: 10,\r\n            },\r\n          },\r\n          bar: {\r\n            background: '#393232',\r\n            opacity: '.5',\r\n            size: '2px',\r\n          },\r\n        },\r\n        page: 1,\r\n        limit: 15,\r\n        searchTxt: '',\r\n        cate: [], // 分类\r\n        cateId: '', // 分类id\r\n      },\r\n      // 分组数据\r\n      cateData: {\r\n        status: 0, // 0 新增 1编辑\r\n        name: '',\r\n        sort: '',\r\n        isCate: false, // 分组状态开关\r\n        id: '',\r\n      },\r\n      // 编辑分组列表\r\n      editList: {\r\n        status: false,\r\n      },\r\n      // 话术添加数据\r\n      msgData: {\r\n        isCateMeg: false,\r\n        msgCateId: '',\r\n        message: '',\r\n        title: '',\r\n        status: 0, // 0 新增 1修改\r\n        editId: '',\r\n      },\r\n      selectData: '',\r\n    };\r\n  },\r\n  mounted() {\r\n    Promise.all([this.getServiceCate()]);\r\n  },\r\n  methods: {\r\n    // 关闭添加话术弹窗\r\n    closeMsgBox() {\r\n      this.msgData.isCateMeg = false;\r\n    },\r\n    // 选择话术\r\n    selectWords(item) {\r\n      this.$emit('selectMsg', item.message);\r\n    },\r\n    // 关闭弹窗\r\n    closeBox() {\r\n      this.$emit('closeBox');\r\n    },\r\n    // 搜索\r\n    bindSearch() {\r\n      this.wordsData.page = 1;\r\n      this.wordsData.isScroll = true;\r\n      this.wordsList = [];\r\n      this.getWordsList();\r\n    },\r\n    // 顶部切换\r\n    bindTab(item) {\r\n      console.log('111');\r\n      this.wordsTabCur = item.key;\r\n      this.wordsData.isScroll = true;\r\n      this.wordsData.page = 1;\r\n      this.wordsData.cate = [];\r\n      this.wordsList = [];\r\n      this.getServiceCate();\r\n    },\r\n    // 选择话术分类\r\n    changeCate(item) {\r\n      this.wordsData.isScroll = true;\r\n      this.wordsList = [];\r\n      this.wordsData.page = 1;\r\n      this.wordsData.cateId = item.id;\r\n      this.msgData.msgCateId = item.id;\r\n      this.getWordsList();\r\n    },\r\n    // 获取话术分类\r\n    getServiceCate() {\r\n      serviceCate({\r\n        type: this.wordsTabCur,\r\n      }).then((res) => {\r\n        let tempArr = JSON.parse(JSON.stringify(res.data.data));\r\n        this.wordsData.cateId = res.data.data.length ? res.data.data[0].id : '';\r\n        this.msgData.msgCateId = this.wordsData.cateId;\r\n        this.wordsData.cate = res.data.data;\r\n        this.selectData = tempArr;\r\n        this.getWordsList();\r\n      });\r\n    },\r\n    // 话术滚动到底部\r\n    handleWordsScroll(vm, refreshDom, done) {\r\n      this.getWordsList();\r\n      done();\r\n    },\r\n    // 常用语\r\n    getWordsList() {\r\n      speeChcraft({\r\n        page: this.wordsData.page,\r\n        limit: this.wordsData.limit,\r\n        title: this.wordsData.searchTxt,\r\n        cate_id: this.wordsData.cateId,\r\n        type: this.wordsTabCur,\r\n      }).then((res) => {\r\n        this.wordsData.isScroll = res.data.length >= this.wordsData.limit;\r\n        this.wordsList = this.wordsList.concat(res.data);\r\n        this.wordsData.page++;\r\n      });\r\n    },\r\n    // 打开分组弹窗\r\n    openCate(key, item) {\r\n      this.cateData.status = key;\r\n      this.cateData.isCate = true;\r\n      if (key == 1) {\r\n        this.cateData.name = item.name;\r\n        this.cateData.id = item.id;\r\n      }\r\n    },\r\n    // 关闭分组弹窗\r\n    closeCate() {\r\n      this.cateData.isCate = false;\r\n      this.cateData.name = '';\r\n      this.cateData.sort = '';\r\n    },\r\n    // 分组添加\r\n    cateConfirm() {\r\n      if (!this.cateData.status) {\r\n        addServiceCate({\r\n          name: this.cateData.name,\r\n          sort: this.cateData.sort,\r\n        })\r\n          .then((res) => {\r\n            this.cateData.isCate = false;\r\n            this.cateData.name = '';\r\n            this.cateData.sort = '';\r\n            this.page = 1;\r\n            this.wordsData.isScroll = true;\r\n            this.wordsList = [];\r\n            this.$message.success(res.msg);\r\n            this.getServiceCate();\r\n          })\r\n          .catch((error) => {\r\n            this.$message.error(error.msg);\r\n          });\r\n      } else {\r\n        editServiceCate(this.cateData.id, {\r\n          name: this.cateData.name,\r\n          sort: this.cateData.sort,\r\n        }).then((res) => {\r\n          this.cateData.isCate = false;\r\n          this.cateData.name = '';\r\n          this.cateData.sort = '';\r\n          this.cateData.id = '';\r\n          this.page = 1;\r\n          this.wordsData.isScroll = true;\r\n          this.wordsList = [];\r\n          this.$message.success(res.msg);\r\n          this.getServiceCate();\r\n        });\r\n      }\r\n    },\r\n    // 话术打开\r\n    addMsg() {\r\n      this.msgData.isCateMeg = true;\r\n      this.msgData.status = 0;\r\n    },\r\n    // 话术添加\r\n    msgConfirm() {\r\n      if (!this.msgData.status) {\r\n        addSpeeChcraft({\r\n          title: this.msgData.title,\r\n          cate_id: this.msgData.msgCateId,\r\n          message: this.msgData.message,\r\n        })\r\n          .then((res) => {\r\n            this.msgData.isCateMeg = false;\r\n            this.msgData.title = '';\r\n            this.msgData.message = '';\r\n            this.msgData.msgCateId = this.wordsData.cateId;\r\n            this.$message.success(res.msg);\r\n            this.wordsData.isScroll = true;\r\n            this.wordsData.page = 1;\r\n            this.wordsList = [];\r\n            this.getWordsList();\r\n          })\r\n          .catch((error) => {\r\n            this.$message.error(error.msg);\r\n          });\r\n      } else {\r\n        serviceCateUpdate(this.msgData.editId, {\r\n          title: this.msgData.title,\r\n          cate_id: this.msgData.msgCateId,\r\n          message: this.msgData.message,\r\n        }).then((res) => {\r\n          this.msgData.isCateMeg = false;\r\n          this.msgData.title = '';\r\n          this.msgData.message = '';\r\n          this.msgData.msgCateId = this.wordsData.cateId;\r\n          this.$message.success(res.msg);\r\n          this.wordsData.isScroll = true;\r\n          this.wordsData.page = 1;\r\n          this.wordsList = [];\r\n          this.getWordsList();\r\n        });\r\n      }\r\n    },\r\n    // 编辑话术\r\n    bindEdit(item) {\r\n      this.msgData.status = 1;\r\n      this.msgData.isCateMeg = true;\r\n      this.msgData.message = item.message;\r\n      this.msgData.title = item.title;\r\n      this.msgData.editId = item.id;\r\n    },\r\n    // 删除话术\r\n    delMsg(row, tit, num) {\r\n      let delfromData = {\r\n        title: tit,\r\n        num: num,\r\n        url: `/service/speechcraft/${row.id}`,\r\n        method: 'DELETE',\r\n        ids: '',\r\n        kefu: true,\r\n      };\r\n      this.$modalSure(delfromData)\r\n        .then((res) => {\r\n          this.wordsList.splice(num, 1);\r\n          this.$message.success(res.msg);\r\n        })\r\n        .catch((res) => {\r\n          this.$message.error(res.msg);\r\n        });\r\n    },\r\n    delCate(row, tit, num) {\r\n      let delfromData = {\r\n        title: tit,\r\n        num: num,\r\n        url: `/service/cate/${row.id}`,\r\n        method: 'DELETE',\r\n        ids: '',\r\n        kefu: true,\r\n      };\r\n      this.$modalSure(delfromData)\r\n        .then((res) => {\r\n          this.wordsData.cate.splice(num, 1);\r\n          this.page = 1;\r\n          this.wordsData.isScroll = true;\r\n          this.wordsList = [];\r\n          this.$message.success(res.msg);\r\n          this.getServiceCate();\r\n        })\r\n        .catch((res) => {\r\n          this.$message.error(res.msg);\r\n        });\r\n    },\r\n  },\r\n};\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.words-mask {\r\n  z-index: 50;\r\n  position: fixed;\r\n  left: 0;\r\n  top: 0;\r\n  right: 0;\r\n  bottom: 0;\r\n  background: rgba(0, 0, 0, 0.5);\r\n  .content {\r\n    position: absolute;\r\n    left: 0;\r\n    right: 0;\r\n    top: 1.14rem;\r\n    bottom: 0;\r\n    display: flex;\r\n    flex-direction: column;\r\n    background: #fff;\r\n    border-radius: 0.06rem 0.06rem 0px 0px;\r\n    .title-box {\r\n      padding: 0 0.3rem 0.3rem;\r\n      position: relative;\r\n      border-bottom: 1px solid #f5f6f9;\r\n      .tab-box {\r\n        position: relative;\r\n        display: flex;\r\n        justify-content: space-between;\r\n        padding: 0.4rem 2.2rem 0.3rem;\r\n        font-size: 0.32rem;\r\n        color: #9f9f9f;\r\n        .on {\r\n          color: #3875ea;\r\n          font-weight: bold;\r\n        }\r\n        .right-icon {\r\n          position: absolute;\r\n          right: 0;\r\n          top: 50%;\r\n          transform: translateY(-50%);\r\n          .iconfont {\r\n            margin-left: 0.2rem;\r\n            font-size: 0.48rem;\r\n            color: #c8cad0;\r\n          }\r\n        }\r\n      }\r\n      .input-box {\r\n        display: flex;\r\n        align-items: center;\r\n        width: 6.9rem;\r\n        height: 0.64rem;\r\n        padding-right: 0.05rem;\r\n        margin-left: 0.18rem;\r\n        border-radius: 0.32rem;\r\n        overflow: hidden;\r\n        ::v-deep .el-input__inner {\r\n          background: #f5f6f9;\r\n        }\r\n        ::v-deep .el-input__inner,\r\n        .el-input__inner:hover,\r\n        .el-input__inner:focus {\r\n          border: transparent;\r\n          box-shadow: none;\r\n        }\r\n      }\r\n      .icon-cha1 {\r\n        position: absolute;\r\n        right: 0;\r\n        top: 50%;\r\n        transform: translateY(-50%);\r\n      }\r\n    }\r\n    .scroll-box {\r\n      flex: 1;\r\n      display: flex;\r\n      overflow: hidden;\r\n      .scroll-left {\r\n        width: 1.76rem;\r\n        height: 100%;\r\n        overflow-y: scroll;\r\n        -webkit-overflow-scrolling: touch;\r\n        background: #f5f6f9;\r\n        .left-item {\r\n          position: relative;\r\n          display: flex;\r\n          align-items: center;\r\n          justify-content: center;\r\n          width: 100%;\r\n          height: 1.09rem;\r\n          color: #282828;\r\n          font-size: 0.26rem;\r\n          &.active {\r\n            color: #3875ea;\r\n            background: #fff;\r\n            &:after {\r\n              content: ' ';\r\n              position: absolute;\r\n              left: 0;\r\n              top: 50%;\r\n              transform: translateY(-50%);\r\n              width: 0.06rem;\r\n              height: 0.46rem;\r\n              background: #3875ea;\r\n            }\r\n          }\r\n          &.add_cate {\r\n            color: #9f9f9f;\r\n            font-size: 0.26rem;\r\n            .iconfont {\r\n              margin-right: 0.1rem;\r\n              font-size: 0.24rem;\r\n            }\r\n          }\r\n        }\r\n      }\r\n      .right-box {\r\n        flex: 1;\r\n        overflow: scroll;\r\n        -webkit-overflow-scrolling: touch;\r\n      }\r\n      .msg-item {\r\n        padding: 0.25rem 0.3rem;\r\n        color: #888888;\r\n        font-size: 0.28rem;\r\n        .title {\r\n          margin-right: 0.2rem;\r\n          color: #282828;\r\n        }\r\n        &.add-mg {\r\n          display: flex;\r\n          align-items: center;\r\n          justify-content: flex-end;\r\n          font-size: 0.28rem;\r\n          padding: 0.15rem 0.3rem;\r\n          .iconfont {\r\n            font-size: 0.36rem;\r\n            margin-right: 0.1rem;\r\n          }\r\n        }\r\n      }\r\n    }\r\n  }\r\n}\r\n.words-box {\r\n  .mask-title {\r\n    position: relative;\r\n    text-align: center;\r\n    margin-bottom: 0.5rem;\r\n    color: #282828;\r\n    font-size: 0.32rem;\r\n    font-weight: bold;\r\n    .iconfont {\r\n      position: absolute;\r\n      right: 0;\r\n      top: 50%;\r\n      transform: translateY(-50%);\r\n      color: #c8cad0;\r\n      font-size: 0.44rem;\r\n      font-weight: normal;\r\n    }\r\n  }\r\n  .input-box {\r\n    height: 0.68rem;\r\n    margin-top: 0.32rem;\r\n    background: #f5f5f5;\r\n    border-radius: 0.14rem;\r\n    &.text-area {\r\n      height: 1.92rem;\r\n      textarea {\r\n        display: block;\r\n        height: 100%;\r\n      }\r\n    }\r\n  }\r\n  .subBtn {\r\n    width: 100%;\r\n    height: 0.86rem;\r\n    margin-top: 0.6rem;\r\n    margin-bottom: 0.3rem;\r\n    font-size: 0.3rem !important;\r\n    border-radius: 0.43rem;\r\n    &[disabled] {\r\n      background: #c8cad0;\r\n      color: #fff;\r\n      font-size: 0.3rem !important;\r\n    }\r\n  }\r\n}\r\n.edit-box {\r\n  z-index: 99;\r\n  position: fixed;\r\n  left: 0;\r\n  right: 0;\r\n  top: 0;\r\n  bottom: 0;\r\n  display: flex;\r\n  flex-direction: column;\r\n  background: #fff;\r\n  .head {\r\n    padding: 0.4rem 0.3rem 0.3rem;\r\n    .tit-bar {\r\n      position: relative;\r\n      text-align: center;\r\n      font-size: 0.32rem;\r\n      color: #282828;\r\n      font-weight: bold;\r\n      span {\r\n        position: absolute;\r\n        right: 0;\r\n        top: 50%;\r\n        transform: translateY(-50%);\r\n        color: #3875ea;\r\n        font-size: 0.28rem;\r\n        font-weight: normal;\r\n      }\r\n    }\r\n    .input-box {\r\n      margin-top: 0.3rem;\r\n      background: #f5f6f9;\r\n      border-radius: 0.39rem;\r\n    }\r\n  }\r\n  .scroll-box {\r\n    flex: 1;\r\n    display: flex;\r\n    overflow: hidden;\r\n    .scroll-left {\r\n      display: flex;\r\n      flex-direction: column;\r\n      position: relative;\r\n      width: 1.76rem;\r\n      height: 100%;\r\n      background: #f5f6f9;\r\n      .top {\r\n        flex: 1;\r\n        overflow-y: scroll;\r\n        -webkit-overflow-scrolling: touch;\r\n      }\r\n      .left-item {\r\n        position: relative;\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        width: 100%;\r\n        height: 1.09rem;\r\n        color: #282828;\r\n        font-size: 0.26rem;\r\n        &.active {\r\n          color: #3875ea;\r\n          background: #fff;\r\n          &:after {\r\n            content: ' ';\r\n            position: absolute;\r\n            left: 0;\r\n            top: 50%;\r\n            transform: translateY(-50%);\r\n            width: 0.06rem;\r\n            height: 0.46rem;\r\n            background: #3875ea;\r\n          }\r\n        }\r\n        &.add_cate {\r\n          color: #9f9f9f;\r\n          font-size: 0.26rem;\r\n          .iconfont {\r\n            margin-right: 0.1rem;\r\n            font-size: 0.24rem;\r\n          }\r\n        }\r\n        &.edits-box {\r\n          color: #3875ea;\r\n        }\r\n      }\r\n    }\r\n    .right-box {\r\n      flex: 1;\r\n      padding-left: 0.3rem;\r\n    }\r\n    .msg-item {\r\n      padding: 0.25rem 0.3rem 0.25rem 0;\r\n      color: #888888;\r\n      font-size: 0.28rem;\r\n      .title {\r\n        margin-right: 0.2rem;\r\n        color: #282828;\r\n      }\r\n      &.add-mg {\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: flex-end;\r\n        font-size: 0.28rem;\r\n        padding: 0.15rem 0.3rem;\r\n        .iconfont {\r\n          font-size: 0.36rem;\r\n          margin-right: 0.1rem;\r\n        }\r\n      }\r\n      .edit-bar {\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: flex-end;\r\n        margin-top: 0.25rem;\r\n        padding-bottom: 0.1rem;\r\n        border-bottom: 1px solid #f0f2f7;\r\n        .iconfont {\r\n          margin-left: 0.3rem;\r\n          font-size: 0.32rem;\r\n        }\r\n      }\r\n    }\r\n  }\r\n}\r\n.cate-list {\r\n  .list-box {\r\n    max-height: 7.5rem;\r\n    overflow-y: scroll;\r\n    -webkit-overflow-scrolling: touch;\r\n    .item {\r\n      display: flex;\r\n      align-items: center;\r\n      justify-content: space-between;\r\n      height: 1rem;\r\n      border-bottom: 1px solid #f0f2f7;\r\n      color: #282828;\r\n      font-size: 0.28rem;\r\n      .iconfont {\r\n        color: #9f9f9f;\r\n        font-size: 0.32rem;\r\n        margin-left: 0.4rem;\r\n      }\r\n    }\r\n  }\r\n}\r\n</style>\r\n<style>\r\n.kf_mobile .ivu-modal-wrap {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n.vertical-center-modal {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n.ivu-modal {\r\n  top: 0;\r\n}\r\n.noinput input,\r\n.noinput textarea {\r\n  border-color: transparent !important;\r\n  background: transparent !important;\r\n  resize: none;\r\n}\r\n.noinput input:hover,\r\n.noinput input:focus,\r\n.noinput textarea:hover,\r\n.noinput textarea:focus {\r\n  border-color: transparent !important;\r\n  box-shadow: none !important;\r\n}\r\n</style>\r\n"]}]}