diff --git a/src/views/Template/Pinspeakwords.vue b/src/views/Template/Pinspeakwords.vue index 5219397..fc408a6 100644 --- a/src/views/Template/Pinspeakwords.vue +++ b/src/views/Template/Pinspeakwords.vue @@ -4,126 +4,303 @@ <div class="content-left"> <div v-if="orgType != 3"> <span style="color: red">*</span> 项目选择: - <el-select v-model="houseId" size="mini" @change="selectChange" clearable :disabled="disabledcet" - placeholder="请选择"> - <el-option v-for="item in houseList" :key="item.value" :label="item.label" :value="item.value"> + <el-select + v-model="houseId" + size="mini" + @change="selectChange" + clearable + :disabled="disabledcet" + placeholder="请选择" + > + <el-option + v-for="item in houseList" + :key="item.value" + :label="item.label" + :value="item.value" + > </el-option> </el-select> </div> - <div class="select" style="display: flex;margin-top: 40px;"> - <div style="font-size:18px;font-weight: bold;">添加模板</div> + <div class="select" style="display: flex; margin-top: 40px"> + <div style="font-size: 18px; font-weight: bold">添加模板</div> <el-row> <el-col :offset="18" :span="6"> - <el-button size="mini" type="primary" @click="addBigNode">添加大类</el-button> + <el-button size="mini" type="primary" @click="addBigNode" + >添加大类</el-button + > </el-col> </el-row> - </div> - <input ref="input" style="display:none" value='${tempId}' /> + <input ref="input" style="display: none" value="${tempId}" /> - <el-tree ref="tree" :data="treeList" :default-checked-keys="defaultCheck" show-checkbox node-key="id" - default-expand-all :check-on-click-node="true" :expand-on-click-node="false" draggable :allow-drop="allowDrop" - :allow-drag="allowDrag" @node-drop="Peerdrag"> + <el-tree + ref="tree" + :data="treeList" + :default-checked-keys="defaultCheck" + show-checkbox + node-key="id" + default-expand-all + :check-on-click-node="true" + :expand-on-click-node="false" + draggable + :allow-drop="allowDrop" + :allow-drag="allowDrag" + @node-drop="Peerdrag" + > <span class="custom-tree-node" slot-scope="{ node, data }"> - <span> <b v-if="data.sign == 0 && data.houseId == null" style="color: red">*</b> {{ node.label }}</span> <span> - <el-button style="color:red;" v-if="node.level == 1" type="text" size="mini" - @click.stop="() => append(node, data)">添加子类</el-button> + <b + v-if="data.sign == 0 && data.houseId == null" + style="color: red" + >*</b + > + {{ node.label }}</span + > + <span> + <el-button + style="color: red" + v-if="node.level == 1" + type="text" + size="mini" + @click.stop="() => append(node, data)" + >添加子类</el-button + > <span v-if="data.houseId != null"> - <el-button v-if="node.level == 2" type="text" size="mini" @click.stop="() => append1(node, data)"> 添加子类 + <el-button + v-if="node.level == 2" + type="text" + size="mini" + @click.stop="() => append1(node, data)" + > + 添加子类 + </el-button> + <el-button + type="text" + size="mini" + @click.stop="() => remove(node, data)" + > + 删除 + </el-button> + <el-button + type="text" + size="mini" + @click.stop="() => ddeditor(node, data)" + > + 编辑 </el-button> - <el-button type="text" size="mini" @click.stop="() => remove(node, data)"> 删除 </el-button> - <el-button type="text" size="mini" @click.stop="() => ddeditor(node, data)"> 编辑 </el-button> </span> - <el-button v-if="data.sign != 1" type="text"> </el-button> + <el-button v-if="data.sign != 1" type="text" + > </el-button + > </span> </span> </el-tree> - <div class="update-btn"> - <el-button type="primary" size="mini" @click="getCheckedNode">获取选中节点</el-button> + <el-button type="primary" size="mini" @click="getCheckedNode" + >获取选中节点</el-button + > </div> <!-- 新增弹框 --> - <el-dialog title="新增" :visible.sync="dialogFormVisible" :center="true" width="400px"> + <el-dialog + title="新增" + :visible.sync="dialogFormVisible" + :center="true" + width="400px" + > <el-form :model="addForm"> <el-row :gutter="24"> <el-col :span="24"> - <el-form-item label="一级大类名称:" v-if="level == 0" :label-width="formLabelWidth"> - <el-input v-model="addForm.name" placeholder="一级大类名称" maxlength="8" autocomplete="off"></el-input> + <el-form-item + label="一级大类名称:" + v-if="level == 0" + :label-width="formLabelWidth" + > + <el-input + v-model="addForm.name" + placeholder="一级大类名称" + maxlength="8" + autocomplete="off" + ></el-input> </el-form-item> - <el-form-item label="二级小类名称:" v-if="level == 1" :label-width="formLabelWidth"> - <el-input v-model="addForm.name" placeholder="二级小类名称" maxlength="8" autocomplete="off"></el-input> + <el-form-item + label="二级小类名称:" + v-if="level == 1" + :label-width="formLabelWidth" + > + <el-input + v-model="addForm.name" + placeholder="二级小类名称" + maxlength="8" + autocomplete="off" + ></el-input> </el-form-item> - <el-form-item label="三级小类名称:" v-if="level == 2" :label-width="formLabelWidth"> - <el-input v-model="addForm.name" placeholder="三级小类名称" maxlength="8" autocomplete="off"></el-input> + <el-form-item + label="三级小类名称:" + v-if="level == 2" + :label-width="formLabelWidth" + > + <el-input + v-model="addForm.name" + placeholder="三级小类名称" + maxlength="8" + autocomplete="off" + ></el-input> </el-form-item> </el-col> </el-row> </el-form> - <div slot="footer" class="dialog-footer" - style="border-top:1px solid #eee;padding-top: 20px;display: flex;justify-content: end;"> + <div + slot="footer" + class="dialog-footer" + style=" + border-top: 1px solid #eee; + padding-top: 20px; + display: flex; + justify-content: end; + " + > <el-button @click="dialogFormVisible = false">取 消</el-button> - <el-button type="primary" :loading="loadingFlag" @click="addSubmit">确 定</el-button> + <el-button type="primary" :loading="loadingFlag" @click="addSubmit" + >确 定</el-button + > </div> </el-dialog> - - - <!-- 删除确认弹框 --> - <el-dialog title="提示" :visible.sync="dialogVisible" width="30%" :center="true"> + <el-dialog + title="提示" + :visible.sync="dialogVisible" + width="30%" + :center="true" + > <span>确定删除该条内容吗</span> - <span slot="footer" class="dialog-footer" - style="border-top:1px solid #eee;padding-top: 20px;display: flex;justify-content: end;"> + <span + slot="footer" + class="dialog-footer" + style=" + border-top: 1px solid #eee; + padding-top: 20px; + display: flex; + justify-content: end; + " + > <el-button @click="dialogVisible = false">取 消</el-button> <el-button type="primary" @click="checkDelete">确 定</el-button> </span> </el-dialog> - </div> <!-- 评分 --> <div class="content-right"> <el-row> - <el-col :span="20"> - (提示:拖拽大类可以排序) + <el-col :span="10"> + <div style="display: flex; align-items: center"> + <span style="width: 120px">话术名称</span> + + <el-input + placeholder="请输入话术名称" + v-model="inparams.templateName" + maxlength="16" + show-word-limit + clearable + > + </el-input> + </div> + <div style="display: flex; align-items: center; height: 40px"> + <span style="width: 120px">默认话术</span> + + <el-radio-group v-model="inparams.defaultTemplate"> + <el-radio :label="0">是</el-radio> + <el-radio :label="1">否</el-radio> + </el-radio-group> + </div> </el-col> + <el-col :span="20"> (提示:拖拽大类可以排序) </el-col> </el-row> - <draggable class="list-group" tag="ul" v-model="newlist" v-bind="dragOptions" @start="drag = true" - @end="drag = false" @change="onDragCallback"> - <div style="border: 2px dashed #CCCCCC;margin-top: 30px;padding:6px;border-radius: 6px;font-size: 14px;" - v-for="(item, index) in newlist" :key="item.id"> - <div style="display: flex;align-items: center;height: 40px;"> - <div>{{ item.name || '' }}:</div> + <draggable + class="list-group" + tag="ul" + v-model="newlist" + v-bind="dragOptions" + @start="drag = true" + @end="drag = false" + @change="onDragCallback" + > + <div + style=" + border: 2px dashed #cccccc; + margin-top: 30px; + padding: 6px; + border-radius: 6px; + font-size: 14px; + " + v-for="(item, index) in newlist" + :key="item.id" + > + <div style="display: flex; align-items: center; height: 40px"> + <div>{{ item.name || "" }}:</div> <div> - <el-input @input="inputYiji($event, index)" style="width: 100px;" v-model.number="item.fraction" - type="number" size="mini"></el-input> + <el-input + @input="inputYiji($event, index)" + style="width: 100px" + v-model.number="item.fraction" + type="number" + size="mini" + ></el-input> </div> - <div style="margin-left: 10px;"> - <el-button type="danger" size="mini" @click="Deletecategories(item, index)">删除</el-button> + <div style="margin-left: 10px"> + <el-button + type="danger" + size="mini" + @click="Deletecategories(item, index)" + >删除</el-button + > </div> </div> - <div class="erji" style="margin-left: 30px;" v-for="(asd, idx) in item.children" :key="idx"> - <div style="display: flex;align-items: center;height: 40px;"> - <div>{{ asd.name || '' }}:</div> + <div + class="erji" + style="margin-left: 30px" + v-for="(asd, idx) in item.children" + :key="idx" + > + <div style="display: flex; align-items: center; height: 40px"> + <div>{{ asd.name || "" }}:</div> <div> - - <el-input @input="inputBlur($event, index, idx)" style="width: 100px;" v-model.number="asd.fraction" - type="number" size="mini"></el-input> - + <el-input + @input="inputBlur($event, index, idx)" + style="width: 100px" + v-model.number="asd.fraction" + type="number" + size="mini" + ></el-input> </div> - <div style="margin-left: 10px;"> - <el-button type="primary" size="mini" @click="Removethesecondary(index, idx, asd)">删除</el-button> + <div style="margin-left: 10px"> + <el-button + type="primary" + size="mini" + @click="Removethesecondary(index, idx, asd)" + >删除</el-button + > </div> </div> - <div class="sanji" style="width:90%;"> - <div style="display: flex;align-items: center;height: 40px;" v-for="(sanji, indx) in asd.children" - :key="indx"> - <div style="width:85% ;margin-left: 30px;">{{ sanji.name || '' }}</div> - <div style="margin-left: 10px;"> - <el-button type="info" size="mini" @click="Deletethelevel(index, idx, indx, sanji)">删除</el-button> + <div class="sanji" style="width: 90%"> + <div + style="display: flex; align-items: center; height: 40px" + v-for="(sanji, indx) in asd.children" + :key="indx" + > + <div style="width: 85%; margin-left: 30px"> + {{ sanji.name || "" }} + </div> + <div style="margin-left: 10px"> + <el-button + type="info" + size="mini" + @click="Deletethelevel(index, idx, indx, sanji)" + >删除</el-button + > </div> </div> </div> @@ -131,36 +308,59 @@ </div> </draggable> - <div style="display: flex;align-items: center;margin-top:30px;"> + <div style="display: flex; align-items: center; margin-top: 30px"> <el-button type="primary" size="mini" @click="cancel">取消</el-button> - <el-button style="margin-left: 30px;" type="primary" size="mini" @click="submitForm">保存</el-button> + <el-button + style="margin-left: 30px" + type="primary" + size="mini" + @click="submitForm" + >保存</el-button + > </div> - </div> - <!--?编辑弹框?--> - <el-dialog title="编辑" :visible.sync="isshowage" :center="true" width="30%"> - <div style="display: flex;align-items: center;height: 40px;width: 100%;"> + <el-dialog + title="编辑" + :visible.sync="isshowage" + :center="true" + width="30%" + > + <div + style="display: flex; align-items: center; height: 40px; width: 100%" + > <div>类名:</div> - <div style="width:88%"> - <el-input type="text" maxlength="8" v-model="frosasd.name" autocomplete="off"></el-input> + <div style="width: 88%"> + <el-input + type="text" + maxlength="8" + v-model="frosasd.name" + autocomplete="off" + ></el-input> </div> </div> - <div slot="footer" class="dialog-footer" - style="border-top:1px solid #eee;padding-top: 20px;display: flex;justify-content: end;"> + <div + slot="footer" + class="dialog-footer" + style=" + border-top: 1px solid #eee; + padding-top: 20px; + display: flex; + justify-content: end; + " + > <el-button @click="submicll()">取 消</el-button> <el-button type="primary" @click="submiadd()">提交</el-button> </div> </el-dialog> - </div> </div> </template> <script> -import draggable from 'vuedraggable' +import draggable from "vuedraggable"; export default { data() { return { @@ -170,7 +370,7 @@ export default { treeList: [], //树形数据 newlist: [], nodelist: [], - orgType: localStorage.getItem('orgType'), + orgType: localStorage.getItem("orgType"), dialogFormVisible: false, // 弹框 dialogVisible: false, isshowage: false, @@ -195,8 +395,13 @@ export default { addid: null, // 新增的节点id(接口生成) deleteId: null, // 要删除的表单节点的ID disabledcet: false, - Templateid: '', + Templateid: "", loadingFlag: false, + + inparams: { + templateName: "", // 话术名称 + defaultTemplate: 1, // 默认模板 0:是,1:否 + }, }; }, components: { @@ -211,7 +416,7 @@ export default { mounted() { var isnull = this.$route.query.flag; this.Templateid = isnull.id; - this.setInitCheck() + this.setInitCheck(); }, computed: { dragOptions() { @@ -231,31 +436,33 @@ export default { }, // 获取项目下拉的数据 getHouse() { - this.$api.api.findHouseByUser({ - orgType: localStorage.getItem("orgType"), - }).then((res) => { - this.houseList = res.data.map((item) => { - return { - value: item.id, - label: item.propertyName, - }; - }); - if (this.houseId == "") { - if (localStorage.getItem('orgType') == 3) { - this.houseId = localStorage.getItem('houseId') - } else { - this.houseId = this.houseList[0].value; + this.$api.api + .findHouseByUser({ + orgType: localStorage.getItem("orgType"), + }) + .then((res) => { + this.houseList = res.data.map((item) => { + return { + value: item.id, + label: item.propertyName, + }; + }); + if (this.houseId == "") { + if (localStorage.getItem("orgType") == 3) { + this.houseId = localStorage.getItem("houseId"); + } else { + this.houseId = this.houseList[0].value; + } + // this.houseId = this.houseList[0].value; } - // this.houseId = this.houseList[0].value; - } - this.templategetMarketingTree() - }) + this.templategetMarketingTree(); + }); }, //获取模板 templategetMarketingTree() { let parmest = { houseId: this.houseId, - } + }; this.$api.api.templategetMarketingTree(parmest).then((res) => { console.log(res); let data = res.data; @@ -263,7 +470,7 @@ export default { data = JSON.parse(data); this.treeList = data; this.getAllTreeListId(this.treeList); - }) + }); }, // 递归获取所有的ID getAllTreeListId(arr) { @@ -279,8 +486,10 @@ export default { }, // ------获取选中的节点 getCheckedNode() { - let res = this.$refs.tree.getCheckedKeys().concat(this.$refs.tree.getHalfCheckedKeys()); - console.log(res) + let res = this.$refs.tree + .getCheckedKeys() + .concat(this.$refs.tree.getHalfCheckedKeys()); + console.log(res); let arr = []; let arr1 = JSON.parse(JSON.stringify(this.treeList)); @@ -297,18 +506,20 @@ export default { }, // 树图,设置初始选中值及分数回显--编辑跳转过来的 setInitCheck() { - if (this.Templateid == '') { + if (this.Templateid == "") { //获取项目 this.getHouse(); } else { this.disabledcet = true; let parmest = { tempId: this.Templateid, - } + }; this.$api.http.templatedelfindByTempId(parmest).then((res) => { this.houseId = res.data.houseId; this.checklist = res.data.list; this.nodelist = res.data.list; + this.inparams.templateName = res.data.templateName; + this.inparams.defaultTemplate = res.data.defaultTemplate; this.getHouse2(); this.checklist.forEach((item) => { this.rateMap.set(item.id, item.fraction); // map维护分数 @@ -317,30 +528,28 @@ export default { this.defaultCheck.push(item.id); } }); - console.log(this.newlist, "99999999999999999999999999") + console.log(this.newlist, "99999999999999999999999999"); this.listCheckedchaifen(); - - }) + }); } - }, // 获取项目下拉的数据 getHouse2() { - this.$api.api.findHouseByUser({ - orgType: localStorage.getItem("orgType"), - }).then((res) => { - this.houseList = res.data.map((item) => { - return { - value: item.id, - label: item.propertyName, - }; + this.$api.api + .findHouseByUser({ + orgType: localStorage.getItem("orgType"), + }) + .then((res) => { + this.houseList = res.data.map((item) => { + return { + value: item.id, + label: item.propertyName, + }; + }); + this.templategetMarketingTree(); }); - this.templategetMarketingTree() - }) }, - - inputYiji(e, index) { if (e < 0) { this.$message({ @@ -697,6 +906,7 @@ export default { let params = { houseId: this.houseId, children: [], + ...this.inparams, }; list.forEach((item) => { @@ -739,7 +949,7 @@ export default { }, // 评分保存 新增模板 saveRate(params) { - if (this.Templateid != '') { + if (this.Templateid != "") { params.tempId = this.Templateid; } this.$api.http.templategeaddTemplate(params).then((res) => { @@ -748,10 +958,9 @@ export default { type: "success", }); window.history.back(); - }) + }); }, - //拖拽排序 Peerdrag(before) { let arr = []; @@ -797,9 +1006,7 @@ export default { }, //排序提交 dragSort(list) { - this.$api.http.templategeupdateSort({ children: list }).then((res) => { - - }) + this.$api.http.templategeupdateSort({ children: list }).then((res) => {}); }, //控制那个可拖拽节点 allowDrag(draggingNode, dropNode, type) { @@ -847,10 +1054,10 @@ export default { // 点击添加节点确认按钮 addSubmit() { if (this.addForm.name != "") { - this.loadingFlag = true + this.loadingFlag = true; setTimeout(() => { - this.loadingFlag = false - console.log('防重') + this.loadingFlag = false; + console.log("防重"); }, 1); this.dialogFormVisible = false; this.addNode(); @@ -864,65 +1071,67 @@ export default { }, // 新增的节点保存 addNode() { - this.$api.http.templategeadd({ - pid: this.pid, - name: this.addForm.name, - houseId: this.houseId, - sign: 1 - }).then((res) => { - if (this.level == 0) { - // 大类 - let newNode = { - id: res.data, - sign: 1, - pid: 0, - sort: this.treeList.length + 1, - label: this.addForm.name, - fraction: "", - children: [], - houseId: this.houseId, - }; - this.treeList.push(newNode); - this.allTreeListId.push(res.data.obj); - } else if (this.level == 1) { - // 二级 - let newChild = { - id: res.data, - pid: this.pid, - sign: 1, - fraction: "", - sort: null, - label: this.addForm.name, - children: [], - houseId: this.houseId, - }; + this.$api.http + .templategeadd({ + pid: this.pid, + name: this.addForm.name, + houseId: this.houseId, + sign: 1, + }) + .then((res) => { + if (this.level == 0) { + // 大类 + let newNode = { + id: res.data, + sign: 1, + pid: 0, + sort: this.treeList.length + 1, + label: this.addForm.name, + fraction: "", + children: [], + houseId: this.houseId, + }; + this.treeList.push(newNode); + this.allTreeListId.push(res.data.obj); + } else if (this.level == 1) { + // 二级 + let newChild = { + id: res.data, + pid: this.pid, + sign: 1, + fraction: "", + sort: null, + label: this.addForm.name, + children: [], + houseId: this.houseId, + }; - this.treeList.forEach((item, index) => { - if (item.id == this.pid) { - item.children.push(newChild); - } - }); - this.allTreeListId.push(res.data.obj); - } else { - let newChilds = { - id: res.data, - sign: 1, - fraction: "", - pid: this.pid, - sort: null, - label: this.addForm.name, - houseId: this.houseId, - }; - this.treeList.forEach((item, index) => { - item.children.forEach((ite, inde) => { - if (ite.id == this.pid) { - ite.children.push(newChilds); + this.treeList.forEach((item, index) => { + if (item.id == this.pid) { + item.children.push(newChild); } }); - }); - this.allTreeListId.push(res.data.obj); - } - }) + this.allTreeListId.push(res.data.obj); + } else { + let newChilds = { + id: res.data, + sign: 1, + fraction: "", + pid: this.pid, + sort: null, + label: this.addForm.name, + houseId: this.houseId, + }; + this.treeList.forEach((item, index) => { + item.children.forEach((ite, inde) => { + if (ite.id == this.pid) { + ite.children.push(newChilds); + } + }); + }); + this.allTreeListId.push(res.data.obj); + } + }); }, //编辑提交 submiadd() { @@ -930,7 +1139,7 @@ export default { let parmest = { name: that.frosasd.name, id: that.frosasd.id, - } + }; this.$api.http.templategeupdate(parmest).then((res) => { that.treeList.forEach((item, index) => { if (item.id == that.frosasd.id) { @@ -970,7 +1179,7 @@ export default { }); } }); - }) + }); }, //编辑 ddeditor(node, data) { @@ -982,7 +1191,7 @@ export default { checkDelete() { let parmest = { id: this.deleteId, - } + }; this.$api.http.templategedel(parmest).then((res) => { this.treeList.forEach((item, index) => { if (item.id == this.deleteId) { @@ -994,10 +1203,7 @@ export default { } else { ite.children.forEach((it, ine) => { if (it.id == this.deleteId) { - this.treeList[index].children[inde].children.splice( - ine, - 1 - ); + this.treeList[index].children[inde].children.splice(ine, 1); } }); } @@ -1006,7 +1212,7 @@ export default { }); this.dialogVisible = false; - }) + }); }, remove(node, data) { if (node.level == 3) { @@ -1017,7 +1223,8 @@ export default { if (data.children.length == 0) { this.deleteType = "node"; this.deleteId = data.id; - this.dialogVisible = true; findByTempId + this.dialogVisible = true; + findByTempId; } else { this.$message({ message: "请先清空子级", @@ -1100,11 +1307,11 @@ export default { font-weight: bold; } } -/deep/ .el-button--primary{ - background: #2671E2 !important; - border: 1px solid #2671E2 !important; +/deep/ .el-button--primary { + background: #2671e2 !important; + border: 1px solid #2671e2 !important; } -/deep/ .el-button--text{ - color: #2671E2; +/deep/ .el-button--text { + color: #2671e2; } </style>