管理系统PC前端
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
dm-manage-web/src/views/zs/clue/components/SkillDialog.vue

70 lines
1.6 KiB

<!--
* @Author: riverQiu
* @Date: 2023-10-14 13:21:37
* @LastEditors: riverQiu
* @LastEditTime: 2023-10-15 00:55:44
* @Description:
-->
<template>
<el-dialog title="话术" :close-on-click-modal="false" append-to-body :visible.sync="visible" width="700px" height="700">
<div>
<!-- 搜索框 -->
<el-select v-model="skillId" placeholder="请选择关键词" filterable style="width: 90%;" @change="selectKey">
<el-option v-for="item in keyOptions" :key="item.skillId" :label="item.skillKey" :value="item.skillId" />
</el-select> <!-- 常用关键词 -->
<!-- 话术内容 -->
<el-card class="box-card">
<div class="text item">
<span v-html="content" />
</div>
</el-card>
</div>
</el-dialog>
</template>
<script>
import { getSkillKey, getSkill } from '@/api/system/skill';
export default {
name: 'SkillDialog',
data () {
return {
visible: false,
loading: true,
keyOptions: [],
content: undefined,
skillId: undefined
};
},
methods: {
init () {
this.visible = true;
this.getSkillKeyOption();
},
getSkillKeyOption () {
getSkillKey().then((resp) => {
if (resp && resp.code === 200) {
this.keyOptions = resp.data;
}
});
},
selectKey (item) {
if (item) {
getSkill(item).then((resp) => {
if (resp && resp.code === 200) {
this.content = resp.data.content;
}
});
}
}
}
};
</script>
<style lang="scss" scoped>
.box-card {
width: 500px;
min-height: 100px;
}
</style>