init

src/views/Customer/label.vue

@@ -0,0 +1,495 @@
+<template>
+  <div class="box-center">
+      <div id="app">
+	<div class="biaoti">
+		客户画像关键词配置
+	</div>
+	<div style="width: 100%;margin-top: 30px;">
+
+		<el-tree ref="tree" :default-expand-all="true" :data="treeList">
+			  <span class="custom-tree-node" slot-scope="{ node, data }">
+				  <span v-if="data.level==1" style="font-size: 18px;color: #32363D">
+					  <img class="levelimg1" src="/img/level1.png" alt="">
+					  {{ data.name }}
+				  </span>
+				  <span v-if="data.level==2 && data.isInterval==1" style="font-size: 16px;color: #32363D">
+					  <img class="levelimg2" src="/img/level2.png" alt="">
+					  {{data.name}}
+				  </span>
+				  <span v-if="data.level==2 && data.isInterval==0">
+					   <img class="levelimg2" src="/img/level2.png" alt="">
+					  {{data.name}}~{{data.endName}}
+				  </span>
+				  <span v-if="data.level==3" style="font-size: 14px;color: #32363D">
+					  <img class="levelimg3" src="/img/level3.png" alt="">
+					  {{ data.name }}
+				  </span>
+
+				  <span v-if="data.level==1" style="display: flex;align-items: center;">
+					  <span class="editor"  @click="() => append(node, data)" style="display: flex;align-items: center;">
+						   <img class="levelimg3" src="/img/add1.png" alt="">
+						  <span>添加二级</span>
+					  </span>
+				  </span>
+
+				  <span v-if="data.level==2" style="display: flex;align-items: center;">
+					  <span v-if="data.isInterval==1" class="editor2"  @click="() => append(node, data)" style="display: flex;align-items: center;">
+						   <img class="levelimg3" src="/img/add2.png" alt="">
+						  <span>添加三级</span>
+					  </span>
+					   <span  style="margin-left: 10px">
+						  <el-button class="editor" type="text" size="mini" @click="() => ddeditor(node, data)">编辑</el-button>
+					  </span>
+					  <span  style="margin-left: 10px">
+						   <el-button class="remove" type="text" size="mini" @click="() => remove(node, data)">删除</el-button>
+					  </span>
+				  </span>
+				  <span v-if="data.level==3" style="display: flex;align-items: center;">
+					  <span style="margin-left: 10px">
+						  <el-button class="editor" type="text" size="mini" @click="() => ddeditor(node, data)">编辑</el-button>
+					  </span>
+					  <span style="margin-left: 10px">
+						   <el-button class="remove" type="text" size="mini" @click="() => remove(node, data)">删除</el-button>
+					  </span>
+				  </span>
+			  </span>
+		</el-tree>
+	</div>
+	<el-dialog title="新增" :visible.sync="dialogFormVisible">
+        <div  v-if="amountintervalname=='意向面积'" style="display:flex;height: 40px;line-height: 40px;">
+            <span>面积区间：</span>
+            <span style="width: 100px;"><el-input type="number" v-model="addForm.name"></el-input></span>
+            <span style="margin-left: 6px;">平方</span>
+            <span style="margin-left: 12px;margin-right: 12px;">~</span>
+            <span style="width: 100px;"><el-input type="number" v-model="addForm.endName"></el-input></span>
+            <span style="margin-left: 6px;">平方</span>
+        </div>
+        <div  v-else-if="amountintervalname=='购房预算'" style="display:flex;height: 40px;line-height: 40px;">
+            <span>预算区间：</span>
+            <span style="width: 100px;"><el-input type="number" v-model="addForm.name"></el-input></span>
+            <span style="margin-left: 6px;">万元</span>
+            <span style="margin-left: 12px;margin-right: 12px;">~</span>
+            <span style="width: 100px;"><el-input type="number" v-model="addForm.endName"></el-input></span>
+            <span style="margin-left: 6px;">万元</span>
+        </div>
+		<el-form :model="addForm" v-else>
+			<el-row :gutter="20">
+				<el-col :span="12">
+					<el-form-item label="一级大类名称:" v-if="level==0" :label-width="formLabelWidth">
+						<el-input v-model="addForm.name" autocomplete="off"></el-input>
+					</el-form-item>
+					<el-form-item label="二级名称:" v-if="level==2" :label-width="formLabelWidth">
+						<el-input v-model="addForm.name" autocomplete="off"></el-input>
+					</el-form-item>
+					<el-form-item label="三级名称:" v-if="level==3" :label-width="formLabelWidth">
+						<el-input v-model="addForm.name" autocomplete="off"></el-input>
+					</el-form-item>
+				</el-col>
+			</el-row>
+		</el-form>
+		<div slot="footer" class="dialog-footer">
+			<el-button @click="dialogFormVisible = false">取 消</el-button>
+			<el-button type="primary" @click="addSubmit">确 定</el-button>
+		</div>
+	</el-dialog>
+	<!-- 删除确认弹框 -->
+	<el-dialog title="提示" :visible.sync="dialogVisible" width="30%">
+		<span>确定删除该条内容吗</span>
+		<span slot="footer" class="dialog-footer">
+          <el-button @click="dialogVisible = false">取 消</el-button>
+          <el-button type="primary" @click="checkDelete">确 定</el-button>
+        </span>
+	</el-dialog>
+	<!--?编辑弹框?-->
+	<el-dialog title="编辑" :visible.sync="isshowage">
+		<div  v-if="amountintervalname=='意向面积'" style="display:flex;height: 40px;line-height: 40px;">
+			<span>面积区间：</span>
+			<span style="width: 100px;"><el-input type="number" v-model="frosasd.name"></el-input></span>
+			<span style="margin-left: 6px;">平方</span>
+			<span style="margin-left: 12px;margin-right: 12px;">~</span>
+			<span style="width: 100px;"><el-input type="number" v-model="frosasd.endName"></el-input></span>
+			<span style="margin-left: 6px;">平方</span>
+		</div>
+		<div  v-else-if="amountintervalname=='购房预算'" style="display:flex;height: 40px;line-height: 40px;">
+			<span>预算区间：</span>
+			<span style="width: 100px;"><el-input type="number" v-model="frosasd.name"></el-input></span>
+			<span style="margin-left: 6px;">万元</span>
+			<span style="margin-left: 12px;margin-right: 12px;">~</span>
+			<span style="width: 100px;"><el-input type="number" v-model="frosasd.endName"></el-input></span>
+			<span style="margin-left: 6px;">万元</span>
+		</div>
+		<div v-else style="display: flex;align-items: center;height: 40px;">
+			<div style="margin-left: 160px;height: 30px;line-height: 30px;">类名：</div>
+			<div>
+				<input v-model="frosasd.name" style="width: 280px;height: 30px;line-height: 30px;border-radius: 4px;
+				border: 1px solid #DCDFE6;text-indent: 15px;color: #606266;" type="text">
+			</div>
+		</div>
+
+
+
+		<div style="display: flex;justify-content: center;margin-top: 40px;">
+			<button style="width: 100px;height: 40px;border-radius: 4px;background: #ffffff;
+			font-size: 14px;border: 1px solid #DCDFE6;"  @click="submicll()">取消</button>
+			<button style="width: 100px;height: 40px;border-radius: 4px;background: #409EFF;
+			font-size: 14px;margin-left: 60px; color: #ffffff;border: none;"   @click="submiadd()">提交</button>
+		</div>
+	</el-dialog>
+</div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+			return {
+				formLabelWidth: '120px',
+				dialogFormVisible:false,
+				dialogVisible:false,
+				isshowage:false,
+				treeList: [], //树形数据
+                orgCode: '',//公司id
+				addForm:{
+					name:'',
+					endName:''
+				},
+				level:0,
+				pid:'',
+				deleteId:'',
+				frosasd:{
+					name:'',
+					endName:'',
+					isInterval:'',
+					id:'',
+					pid:'',
+					orgCode:'',
+					sort:'',
+					level:'',
+				},
+        amountintervalname:"",
+				isInterval:''
+			}
+		},
+		mounted() {
+          // this.orgCode=localStorage.getItem("AitemId");
+          // this.getHouse()
+
+          var data={"obj":[{"children":[{"children":[{"children":null,"endName":"","id":113,"isInterval":1,"keywordsId":null,"level":3,"matchKeywords":null,"name":"理财","orgCode":"031","pid":45,"sort":1,"total":null,"unit":""},{"children":null,"endName":"","id":114,"isInterval":1,"keywordsId":null,"level":3,"matchKeywords":null,"name":"管家","orgCode":"031","pid":45,"sort":2,"total":null,"unit":""}],"endName":"","id":45,"isInterval":1,"keywordsId":null,"level":2,"matchKeywords":null,"name":"投资","orgCode":"031","pid":1,"sort":1,"total":null,"unit":""},{"children":[{"children":null,"endName":"","id":115,"isInterval":1,"keywordsId":null,"level":3,"matchKeywords":null,"name":"ABC","orgCode":"031","pid":59,"sort":1,"total":null,"unit":""}],"endName":"","id":59,"isInterval":1,"keywordsId":null,"level":2,"matchKeywords":null,"name":"自住","orgCode":"031","pid":1,"sort":2,"total":null,"unit":""},{"children":[{"children":null,"endName":"","id":116,"isInterval":1,"keywordsId":null,"level":3,"matchKeywords":null,"name":"价格","orgCode":"031","pid":60,"sort":1,"total":null,"unit":""}],"endName":"","id":60,"isInterval":1,"keywordsId":null,"level":2,"matchKeywords":null,"name":"婚房","orgCode":"031","pid":1,"sort":3,"total":null,"unit":""}],"endName":"","id":1,"isInterval":1,"keywordsId":null,"level":1,"matchKeywords":null,"name":"置业需求","orgCode":"031","pid":0,"sort":1,"total":null,"unit":""},{"children":[{"children":[{"children":null,"endName":"","id":135,"isInterval":1,"keywordsId":null,"level":3,"matchKeywords":null,"name":"电梯","orgCode":"031","pid":118,"sort":2,"total":null,"unit":""},{"children":null,"endName":"","id":136,"isInterval":1,"keywordsId":null,"level":3,"matchKeywords":null,"name":"层高五米","orgCode":"031","pid":118,"sort":1,"total":null,"unit":""}],"endName":"","id":118,"isInterval":1,"keywordsId":null,"level":2,"matchKeywords":null,"name":"通风透气","orgCode":"031","pid":2,"sort":1,"total":null,"unit":""},{"children":[],"endName":"","id":120,"isInterval":1,"keywordsId":null,"level":2,"matchKeywords":null,"name":"按摩洗脚","orgCode":"031","pid":2,"sort":2,"total":null,"unit":""}],"endName":"","id":2,"isInterval":1,"keywordsId":null,"level":1,"matchKeywords":null,"name":"关注点","orgCode":"031","pid":0,"sort":2,"total":null,"unit":""},{"children":[{"children":[],"endName":"90","id":95,"isInterval":0,"keywordsId":null,"level":2,"matchKeywords":null,"name":"20","orgCode":"031","pid":3,"sort":2,"total":null,"unit":""},{"children":[],"endName":"99","id":107,"isInterval":0,"keywordsId":null,"level":2,"matchKeywords":null,"name":"90","orgCode":"031","pid":3,"sort":3,"total":null,"unit":""},{"children":[],"endName":"150","id":121,"isInterval":0,"keywordsId":null,"level":2,"matchKeywords":null,"name":"100","orgCode":"031","pid":3,"sort":4,"total":null,"unit":""}],"endName":"","id":3,"isInterval":0,"keywordsId":null,"level":1,"matchKeywords":null,"name":"意向面积","orgCode":"031","pid":0,"sort":3,"total":null,"unit":""},{"children":[{"children":[],"endName":"100","id":108,"isInterval":0,"keywordsId":null,"level":2,"matchKeywords":null,"name":"96","orgCode":"031","pid":4,"sort":null,"total":null,"unit":""},{"children":[],"endName":"95","id":109,"isInterval":0,"keywordsId":null,"level":2,"matchKeywords":null,"name":"82","orgCode":"031","pid":4,"sort":1,"total":null,"unit":""},{"children":[],"endName":"150","id":137,"isInterval":0,"keywordsId":null,"level":2,"matchKeywords":null,"name":"100","orgCode":"031","pid":4,"sort":2,"total":null,"unit":""}],"endName":"","id":4,"isInterval":0,"keywordsId":null,"level":1,"matchKeywords":null,"name":"购房预算","orgCode":"031","pid":0,"sort":4,"total":null,"unit":""},{"children":[{"children":[{"children":null,"endName":"","id":123,"isInterval":1,"keywordsId":null,"level":3,"matchKeywords":null,"name":"周末","orgCode":"031","pid":122,"sort":1,"total":null,"unit":""},{"children":null,"endName":"","id":139,"isInterval":1,"keywordsId":null,"level":3,"matchKeywords":null,"name":"假期","orgCode":"031","pid":122,"sort":2,"total":null,"unit":""}],"endName":"","id":122,"isInterval":1,"keywordsId":null,"level":2,"matchKeywords":null,"name":"放假","orgCode":"031","pid":5,"sort":1,"total":null,"unit":""},{"children":[{"children":null,"endName":"","id":138,"isInterval":1,"keywordsId":null,"level":3,"matchKeywords":null,"name":"工作","orgCode":"031","pid":132,"sort":1,"total":null,"unit":""}],"endName":"","id":132,"isInterval":1,"keywordsId":null,"level":2,"matchKeywords":null,"name":" 旅游","orgCode":"031","pid":5,"sort":2,"total":null,"unit":""}],"endName":"","id":5,"isInterval":1,"keywordsId":null,"level":1,"matchKeywords":null,"name":"认知途径","orgCode":"031","pid":0,"sort":5,"total":null,"unit":""}],"res":1,"resMsg":""}
+          	this.treeList=data.obj
+        },
+		methods: {
+			// 获取模板数据
+			getHouse() {
+				axios({
+					url: `${jypath}/zk/keywords/findKeywordsTemplate`,
+					method: 'get',
+					params: {
+						houseId:this.orgCode
+					}
+				}).then(res => {
+					if(res.data.res===1){
+						console.log(res.data)
+						this.treeList = res.data.obj
+					}
+				});
+			},
+			// 添加二三级节点入口
+			append(node, data) {
+                this.amountintervalname=data.name;
+				this.addForm.name = '';
+				this.addForm.endName='';
+				this.pid = data.id;
+				this.level = data.level+1;
+				this.orgCode=data.orgCode;
+				if(this.amountintervalname=='意向面积' || this.amountintervalname=='购房预算'){
+				    this.isInterval=0;
+                }else {
+                    this.isInterval=1;
+                }
+				this.dialogFormVisible = true;
+			},
+			// 添加节点确认按钮
+			addSubmit() {
+				if (this.addForm.name != "") {
+					if (this.amountintervalname=='意向面积' || this.amountintervalname=='购房预算'){
+						if(Number(this.addForm.name)>Number(this.addForm.endName)){
+							this.$message({
+								message: '第一个值必须小于第二个值，请检查！',
+								type: 'warning'
+							});
+							return;
+						}else {
+							this.dialogFormVisible = false
+							this.addNode()
+						}
+					}else {
+						this.dialogFormVisible = false
+						this.addNode()
+					}
+				} else {
+					this.$message({
+						message: '内容不能为空',
+						type: 'warning'
+					});
+					return;
+				}
+			},
+			// 新增的节点保存
+			addNode() {
+				axios({
+					url: `${jypath}/zk/keywords/add`,
+					method: 'post',
+					data: {
+						pid: this.pid,
+						name: this.addForm.name,
+						endName: this.addForm.endName,
+						level:this.level,
+						orgCode:this.orgCode,
+						isInterval:this.isInterval
+					},
+				}).then(res => {
+					if (res.data.res === 1) {
+					 if(this.level == 2) {
+							// 二级
+							let newChild = {
+								id: res.data.obj,
+								pid:this.pid,
+								name: this.addForm.name,
+								endName: this.addForm.endName,
+								orgCode:this.orgCode,
+								level:this.level,
+								isInterval:this.isInterval,
+								children: []
+							};
+							this.treeList.forEach((item,index)=>{
+								if(item.id==this.pid){
+									item.children.push(newChild)
+								}
+							})
+						}else{
+							let newChilds = {
+								id: res.data.obj,
+								pid:this.pid,
+								name: this.addForm.name,
+								orgCode:this.orgCode,
+								level:this.level,
+								isInterval:1,
+								endName: '',
+							};
+							this.treeList.forEach((item,index)=>{
+								item.children.forEach((ite,inde)=>{
+									if(ite.id==this.pid){
+										ite.children.push(newChilds)
+									}
+								})
+							})
+						}
+					}
+				})
+			},
+			//删除节点
+			remove(node, data) {
+				if(data.level==3){
+					this.deleteId = data.id
+					this.dialogVisible = true;
+				}else {
+					if(data.children.length==0){
+						this.deleteId = data.id
+						this.dialogVisible = true;
+					}else {
+						this.$message({
+							message: '请先清空子级',
+							type: 'warning'
+						});
+					}
+				}
+			},
+			// 确认删除自定义的节点
+			checkDelete() {
+				axios({
+					url: `${jypath}/zk/keywords/delete`,
+					method: 'get',
+					params: {
+						id: this.deleteId
+					}
+				}).then(res => {
+					if(res.data.res===1){
+						this.treeList.forEach((item,index)=>{
+							item.children.forEach((ite,inde)=>{
+								if(ite.id==this.deleteId){
+									this.treeList[index].children.splice(inde,1)
+								}else{
+									ite.children.forEach((it,ine)=>{
+										if(it.id==this.deleteId){
+											this.treeList[index].children[inde].children.splice(ine,1)
+										}
+									})
+								}
+							})
+						})
+						this.dialogVisible = false;
+					}
+				});
+			},
+			//编辑
+			ddeditor(node,data){
+				this.frosasd={
+					name:'',
+					endName:'',
+					isInterval:'',
+					id:'',
+					pid:'',
+					orgCode:'',
+					sort:'',
+					level:'',
+				};
+				if(data.isInterval==0){
+					this.frosasd.isInterval=0;
+					this.frosasd.endName=data.endName;
+					this.treeList.forEach((item,index)=> {
+						if(data.pid==item.id){
+							this.amountintervalname=item.name
+						}
+					})
+				}else {
+					this.amountintervalname='';
+					this.frosasd.endName='';
+					this.frosasd.isInterval=1;
+				}
+				this.frosasd.id=data.id;
+				this.frosasd.name=data.name;
+				this.frosasd.pid=data.pid;
+				this.frosasd.orgCode=data.orgCode;
+				this.frosasd.sort=data.sort;
+				this.frosasd.level=data.level;
+				this.isshowage=true;
+			},
+			//取消编辑
+			submicll(){
+				this.isshowage=false;
+			},
+			//编辑提交
+			submiadd(){
+            	if(this.frosasd.isInterval==0){
+					if(Number(this.frosasd.name)>Number(this.frosasd.endName)){
+						this.$message({
+							message: '第一个值必须小于第二个值，请检查！',
+							type: 'warning'
+						});
+						return;
+					}else {
+						this.infosubmiadd()
+					}
+				}else {
+            		this.infosubmiadd()
+				}
+			},
+			infosubmiadd(){
+				var that=this;
+				axios({
+					url: `${jypath}/zk/keywords/update`,
+					method: 'post',
+					data: this.frosasd
+				}).then(res => {
+					if(res.data.res==1){
+						that.treeList.forEach((item,index)=>{
+							item.children.forEach((asd,indexesd)=>{
+								if(asd.id==that.frosasd.id){
+									that.treeList[index].children[indexesd].name=that.frosasd.name;
+									that.treeList[index].children[indexesd].endName=that.frosasd.endName;
+									that.treeList[index].children[indexesd].id=res.data.obj;
+									that.isshowage=false;
+									that.$message({
+										message: '修改成功',
+										type: 'success'
+									});
+									return
+								}else{
+									asd.children.forEach((zxc,indexzxc)=>{
+										if(zxc.id==that.frosasd.id){
+											that.treeList[index].children[indexesd].children[indexzxc].name=that.frosasd.name;
+											that.treeList[index].children[indexesd].children[indexzxc].id=res.data.obj;
+											that.isshowage=false;
+											that.$message({
+												message: '修改成功',
+												type: 'success'
+											});
+											return
+										}
+									})
+								}
+							})
+						})
+					}else{
+						this.$message({
+							message: '修改失败',
+							type: 'error'
+						});
+					}
+				})
+			}
+
+		}
+};
+</script>
+
+<style scoped="scoped" lang="scss" >
+.box-center {
+  width: 100%;
+  padding: 15px;
+  min-width: 1200px;
+  padding-bottom: 100px;
+}
+#app{
+			width: 100%;
+      min-height: 100vh;
+			background: #FFFFFF;
+			box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.1);
+			border-radius: 4px;
+			padding-left: 15px;
+			padding-bottom: 60px;
+		}
+		.biaoti{
+			font-size: 20px;
+			font-family: PingFangSC-Semibold, PingFang SC;
+			font-weight: 600;
+			color: #32363D;
+			line-height: 20px;
+			padding-top: 25px;
+		}
+		.primary{
+			width: 108px;
+			height: 42px;
+			background: #2671E2;
+		}
+		.custom-tree-node {
+			flex: 1;
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			font-size: 14px;
+			padding-right: 183px;
+		}
+		.remove{
+			color: red;
+		}
+		.editor{
+			color:#2671E2;
+		}
+		.editor2{
+			color:#E6A12F;
+		}
+		.levelimg1{
+			width:18px;
+			height: 18px;
+		}
+		.levelimg2{
+			width:16px;
+			height: 16px;
+		}
+		.levelimg3{
+			width:14px;
+			height: 14px;
+		}
+
+</style>

src/views/File/index.vue

@@ -0,0 +1,263 @@
+<template>
+
+  <div class="box-center">
+    <!-- 头 -->
+    <div class="app-top">
+      <div class="app-titel" style="margin-top: 5px">
+        <div class="label">用户名：</div>
+        <div>
+             <el-input v-model="value"></el-input>
+        </div>
+        <div class="label">设备编号：</div>
+        <div>
+           <el-input v-model="value"></el-input>
+        </div>
+        <div class="label">录音来源：</div>
+        <div>
+            <el-select v-model="value" placeholder="请选择">
+            <el-option
+              v-for="item in options"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
+        </div>
+      </div>
+        <div class="app-titel" style="margin-top: 15px">
+        <div class="label" style="color: #ffffff">筛选相关：</div>
+        <div style="margin-left: 20px">
+          <el-button style="background: #2671e2; color: #ffffff"
+            >筛选</el-button
+          >
+        </div>
+        <div style="margin-left: 20px">
+          <el-button>清空筛选条件</el-button>
+        </div>
+         <div style="margin-left: 20px">
+          <el-button style="background: #2671e2; color: #ffffff"
+            >上传</el-button
+          >
+        </div>
+      </div>
+    </div>
+
+    <!-- 表格 -->
+    <div class="cen-tab">
+        <el-table
+          :data="tableData"
+          stripe
+          height="400"
+          @selection-change="handleSelectionChange"
+          style="width: 100%">
+            <el-table-column
+              type="selection"
+              width="55">
+            </el-table-column>
+          <el-table-column
+            prop="date"
+            label="用户名"
+            align="center"
+          >
+          </el-table-column>
+          <el-table-column
+            prop="name"
+            label="录音来源"
+             align="center"
+           >
+          </el-table-column>
+          <el-table-column
+            prop="address"
+            label="设备编号"
+             align="center">
+          </el-table-column>
+
+          <el-table-column
+            prop="date"
+            label="录音时长"
+            align="center"
+          >
+          </el-table-column>
+
+           <el-table-column
+            prop="date"
+            label="录音结束时间"
+            align="center"
+          >
+          </el-table-column>
+           <el-table-column
+            prop="date"
+            label="文件上传时间"
+            align="center"
+          >
+          </el-table-column>
+           <!--  scope -->
+         <el-table-column label="操作" align="center">
+            <template slot-scope="">
+              <span style="color: #2671E2;">编辑</span>
+              <span style="color: #2671E2;margin-left: 10px;">播放</span>
+            </template>
+          </el-table-column>
+        </el-table>
+        <div style="display: flex;justify-content:flex-end;margin-top: 10px;">
+            <el-pagination
+              @size-change="handleSizeChange"
+              @current-change="handleCurrentChange"
+              :current-page="currentPage4"
+              :page-sizes="[100, 200, 300, 400]"
+              :page-size="100"
+              layout="total, sizes, prev, pager, next, jumper"
+              :total="400">
+            </el-pagination>
+        </div>
+    </div>
+
+       <el-dialog title="绑定" :visible.sync="dialogVisible" >
+          <div slot="footer" class="dialog-footer">
+              <el-button @click="dialogVisible = false">取 消</el-button>
+              <el-button type="primary" @click="editor()">保存</el-button>
+          </div>
+      </el-dialog>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      currentPage4:4,
+      value: "",
+      input: "",
+      tableData: [
+        {
+          date: "2016-05-03",
+          name: "王小虎",
+          address: " 1518 弄",
+        },
+        {
+          date: "2016-05-02",
+          name: "王小虎",
+          address: " 1518 弄",
+        },
+        {
+          date: "2016-05-04",
+          name: "王小虎",
+          address: " 1518 弄",
+        },
+        {
+          date: "2016-05-01",
+          name: "王小虎",
+          address: " 1518 弄",
+        },
+        {
+          date: "2016-05-08",
+          name: "王小虎",
+          address: " 1518 弄",
+        },
+        {
+          date: "2016-05-06",
+          name: "王小虎",
+          address: " 1518 弄",
+        },
+        {
+          date: "2016-05-07",
+          name: "王小虎",
+          address: " 1518 弄",
+        },
+      ],
+      multipleSelection:[],
+      dialogVisible:false,
+       options: [{
+          value: '选项1',
+          label: '黄金糕'
+        }, {
+          value: '选项2',
+          label: '双皮奶'
+        }, {
+          value: '选项3',
+          label: '蚵仔煎'
+        }, {
+          value: '选项4',
+          label: '龙须面'
+        }, {
+          value: '选项5',
+          label: '北京烤鸭'
+        }],
+        value: ''
+    };
+  },
+  mounted() {},
+  methods: {
+    editorinfo(){
+      this.dialogVisible=true;
+    },
+    editor(){
+      this.dialogVisible=false;
+    },
+     handleSelectionChange(val) {
+        this.multipleSelection = val;
+      },
+     handleSizeChange(val) {
+        console.log(`每页 ${val} 条`);
+      },
+      handleCurrentChange(val) {
+        console.log(`当前页: ${val}`);
+      }
+  },
+};
+</script>
+
+<style scoped="scoped" lang="scss" >
+.box-center {
+  width: 100%;
+  padding: 15px;
+  min-width: 1200px;
+  padding-bottom: 100px;
+}
+.cen-tab{
+  width: 100%;
+  padding: 15px;
+  background: #FFFFFF;
+  margin-top: 15px;
+}
+.tophove {
+  color: #ffffff;
+  background: #2671e2;
+}
+.app-top {
+  width: 100%;
+  background: #ffffff;
+  box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.04);
+  border-radius: 4px;
+  padding-top: 15px;
+  padding-bottom: 15px;
+  .app-titel {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    .label {
+      font-size: 14px;
+      font-weight: 400;
+      color: #32363d;
+      line-height: 14px;
+      margin-left: 15px;
+    }
+    .toptimeqhuan {
+      height: 30px;
+      background: #ffffff;
+      display: flex;
+      align-items: center;
+    }
+    .toptimeqhuan div {
+      padding-left: 20px;
+      padding-right: 20px;
+      text-align: center;
+      line-height: 30px;
+      font-size: 14px;
+      margin-right: 15px;
+      border-radius: 4px;
+      border: 1px solid #e0e0e0;
+    }
+  }
+}
+</style>

src/views/Scheduling/index.vue

@@ -0,0 +1,268 @@
+<template>
+
+  <div class="box-center">
+    <!-- 头 -->
+    <div class="app-top">
+      <div class="app-titel" style="margin-top: 5px">
+        <div class="label">用户名：</div>
+        <div>
+             <el-input v-model="value"></el-input>
+        </div>
+        <div class="label">状态：</div>
+        <div>
+            <el-select v-model="value" placeholder="请选择">
+            <el-option
+              v-for="item in options"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
+        </div>
+        <div class="label">排班状态：</div>
+        <div>
+            <el-select v-model="value" placeholder="请选择">
+            <el-option
+              v-for="item in options"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
+        </div>
+      </div>
+        <div class="app-titel" style="margin-top: 15px">
+        <div class="label" style="color: #ffffff">筛选相关：</div>
+        <div style="margin-left: 20px">
+          <el-button style="background: #2671e2; color: #ffffff"
+            >筛选</el-button
+          >
+        </div>
+        <div style="margin-left: 20px">
+          <el-button>清空筛选条件</el-button>
+        </div>
+         <div style="margin-left: 20px">
+          <el-button style="background: #2671e2; color: #ffffff"
+            >添加</el-button
+          >
+        </div>
+         <div style="margin-left: 20px">
+          <el-button style="background: #2671e2; color: #ffffff"
+            >批量删除</el-button
+          >
+        </div>
+         <div style="margin-left: 20px">
+          <el-button style="background: #2671e2; color: #ffffff"
+            >批量排班</el-button
+          >
+        </div>
+      </div>
+    </div>
+
+    <!-- 表格 -->
+    <div class="cen-tab">
+        <el-table
+          :data="tableData"
+          stripe
+          height="400"
+          @selection-change="handleSelectionChange"
+          style="width: 100%">
+            <el-table-column
+              type="selection"
+              width="55">
+            </el-table-column>
+          <el-table-column
+            prop="date"
+            label="用户名"
+            align="center"
+          >
+          </el-table-column>
+          <el-table-column
+            prop="name"
+            label="状态"
+             align="center"
+           >
+          </el-table-column>
+          <el-table-column
+            prop="address"
+            label="上次接待结束时间"
+             align="center">
+          </el-table-column>
+
+          <el-table-column
+            prop="date"
+            label="有无排班"
+            align="center"
+          >
+          </el-table-column>
+           <!--  scope -->
+         <el-table-column label="操作" align="center">
+            <template slot-scope="">
+              <span style="color: #2671E2;">暂停接待</span>
+              <span style="color: #2671E2;margin-left: 10px;">工作安排</span>
+              <span style="color: #2671E2;margin-left: 10px;">删除</span>
+            </template>
+          </el-table-column>
+        </el-table>
+        <div style="display: flex;justify-content:flex-end;margin-top: 10px;">
+            <el-pagination
+              @size-change="handleSizeChange"
+              @current-change="handleCurrentChange"
+              :current-page="currentPage4"
+              :page-sizes="[100, 200, 300, 400]"
+              :page-size="100"
+              layout="total, sizes, prev, pager, next, jumper"
+              :total="400">
+            </el-pagination>
+        </div>
+    </div>
+
+       <el-dialog title="绑定" :visible.sync="dialogVisible" >
+          <div slot="footer" class="dialog-footer">
+              <el-button @click="dialogVisible = false">取 消</el-button>
+              <el-button type="primary" @click="editor()">保存</el-button>
+          </div>
+      </el-dialog>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      currentPage4:4,
+      value: "",
+      input: "",
+      tableData: [
+        {
+          date: "2016-05-03",
+          name: "王小虎",
+          address: " 1518 弄",
+        },
+        {
+          date: "2016-05-02",
+          name: "王小虎",
+          address: " 1518 弄",
+        },
+        {
+          date: "2016-05-04",
+          name: "王小虎",
+          address: " 1518 弄",
+        },
+        {
+          date: "2016-05-01",
+          name: "王小虎",
+          address: " 1518 弄",
+        },
+        {
+          date: "2016-05-08",
+          name: "王小虎",
+          address: " 1518 弄",
+        },
+        {
+          date: "2016-05-06",
+          name: "王小虎",
+          address: " 1518 弄",
+        },
+        {
+          date: "2016-05-07",
+          name: "王小虎",
+          address: " 1518 弄",
+        },
+      ],
+      multipleSelection:[],
+      dialogVisible:false,
+       options: [{
+          value: '选项1',
+          label: '黄金糕'
+        }, {
+          value: '选项2',
+          label: '双皮奶'
+        }, {
+          value: '选项3',
+          label: '蚵仔煎'
+        }, {
+          value: '选项4',
+          label: '龙须面'
+        }, {
+          value: '选项5',
+          label: '北京烤鸭'
+        }],
+        value: ''
+    };
+  },
+  mounted() {},
+  methods: {
+    editorinfo(){
+      this.dialogVisible=true;
+    },
+    editor(){
+      this.dialogVisible=false;
+    },
+     handleSelectionChange(val) {
+        this.multipleSelection = val;
+      },
+     handleSizeChange(val) {
+        console.log(`每页 ${val} 条`);
+      },
+      handleCurrentChange(val) {
+        console.log(`当前页: ${val}`);
+      }
+  },
+};
+</script>
+
+<style scoped="scoped" lang="scss" >
+.box-center {
+  width: 100%;
+  padding: 15px;
+  min-width: 1200px;
+  padding-bottom: 100px;
+}
+.cen-tab{
+  width: 100%;
+  padding: 15px;
+  background: #FFFFFF;
+  margin-top: 15px;
+}
+.tophove {
+  color: #ffffff;
+  background: #2671e2;
+}
+.app-top {
+  width: 100%;
+  background: #ffffff;
+  box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.04);
+  border-radius: 4px;
+  padding-top: 15px;
+  padding-bottom: 15px;
+  .app-titel {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    .label {
+      font-size: 14px;
+      font-weight: 400;
+      color: #32363d;
+      line-height: 14px;
+      margin-left: 15px;
+    }
+    .toptimeqhuan {
+      height: 30px;
+      background: #ffffff;
+      display: flex;
+      align-items: center;
+    }
+    .toptimeqhuan div {
+      padding-left: 20px;
+      padding-right: 20px;
+      text-align: center;
+      line-height: 30px;
+      font-size: 14px;
+      margin-right: 15px;
+      border-radius: 4px;
+      border: 1px solid #e0e0e0;
+    }
+  }
+}
+</style>

src/views/Template/wrongword.vue

@@ -0,0 +1,235 @@
+<template>
+
+  <div class="box-center">
+    <!-- 头 -->
+    <div class="app-top">
+      <div class="app-titel" style="margin-top: 5px">
+        <div class="label">正确词：</div>
+        <div>
+             <el-input v-model="value"></el-input>
+        </div>
+        <div class="label">错误词：</div>
+        <div>
+             <el-input v-model="value"></el-input>
+        </div>
+        <div style="margin-left: 20px">
+          <el-button style="background: #2671e2; color: #ffffff"
+            >筛选</el-button
+          >
+        </div>
+        <div style="margin-left: 20px">
+          <el-button>清空筛选条件</el-button>
+        </div>
+         <div style="margin-left: 20px">
+          <el-button @click="editorinfo()" style="background: #2671e2; color: #ffffff"
+            >新增</el-button
+          >
+        </div>
+      </div>
+    </div>
+
+    <!-- 表格 -->
+    <div class="cen-tab">
+        <el-table
+          :data="tableData"
+          stripe
+          height="400"
+          style="width: 100%">
+          <el-table-column
+            prop="date"
+            label="公司"
+            align="center"
+          >
+          </el-table-column>
+          <el-table-column
+            prop="name"
+            label="正确词"
+             align="center"
+           >
+          </el-table-column>
+          <el-table-column
+            prop="address"
+            label="错误词"
+             align="center">
+          </el-table-column>
+
+          <el-table-column
+            prop="date"
+            label="创建时间"
+            align="center"
+          >
+          </el-table-column>
+
+          <el-table-column
+            prop="date"
+            label="备注"
+            align="center"
+          >
+          </el-table-column>
+           <!--  scope -->
+         <el-table-column label="操作" align="center">
+            <template slot-scope="">
+              <div style="color: #2671E2;">修改</div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <div style="display: flex;justify-content:flex-end;margin-top: 10px;">
+            <el-pagination
+              @size-change="handleSizeChange"
+              @current-change="handleCurrentChange"
+              :current-page="currentPage4"
+              :page-sizes="[100, 200, 300, 400]"
+              :page-size="100"
+              layout="total, sizes, prev, pager, next, jumper"
+              :total="400">
+            </el-pagination>
+        </div>
+    </div>
+
+       <el-dialog title="绑定" :visible.sync="dialogVisible" >
+      <el-form :model="ruleForm" label-position="labelPosition"  ref="ruleForm" label-width="140px" style="width:60%; margin: 0 auto;">
+          <el-form-item label="正确词" prop="areaName">
+              <el-input v-model="ruleForm.areaName"></el-input>
+          </el-form-item>
+          <el-form-item label="错误词" prop="areaName">
+              <el-input v-model="ruleForm.areaName"></el-input>
+          </el-form-item>
+            <el-form-item label="描述：" prop="areaName">
+              <el-input type="textarea" v-model="ruleForm.areaName"></el-input>
+          </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+          <el-button @click="dialogVisible = false">取 消</el-button>
+          <el-button type="primary" @click="editor()">保存</el-button>
+      </div>
+  </el-dialog>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      currentPage4:4,
+      value: "",
+      input: "",
+      tableData: [
+        {
+          date: "2016-05-03",
+          name: "王小虎",
+          address: " 1518 弄",
+        },
+        {
+          date: "2016-05-02",
+          name: "王小虎",
+          address: " 1518 弄",
+        },
+        {
+          date: "2016-05-04",
+          name: "王小虎",
+          address: " 1518 弄",
+        },
+        {
+          date: "2016-05-01",
+          name: "王小虎",
+          address: " 1518 弄",
+        },
+        {
+          date: "2016-05-08",
+          name: "王小虎",
+          address: " 1518 弄",
+        },
+        {
+          date: "2016-05-06",
+          name: "王小虎",
+          address: " 1518 弄",
+        },
+        {
+          date: "2016-05-07",
+          name: "王小虎",
+          address: " 1518 弄",
+        },
+      ],
+      multipleSelection:[],
+      dialogVisible:false,
+        ruleForm:{
+          areaName:'',
+          provinceItem:[],
+       },
+    };
+  },
+  mounted() {},
+  methods: {
+    editorinfo(){
+      this.dialogVisible=true;
+    },
+    editor(){
+      this.dialogVisible=false;
+    },
+     handleSelectionChange(val) {
+        this.multipleSelection = val;
+      },
+     handleSizeChange(val) {
+        console.log(`每页 ${val} 条`);
+      },
+      handleCurrentChange(val) {
+        console.log(`当前页: ${val}`);
+      }
+  },
+};
+</script>
+
+<style scoped="scoped" lang="scss" >
+.box-center {
+  width: 100%;
+  padding: 15px;
+  min-width: 1200px;
+  padding-bottom: 100px;
+}
+.cen-tab{
+  width: 100%;
+  padding: 15px;
+  background: #FFFFFF;
+  margin-top: 15px;
+}
+.tophove {
+  color: #ffffff;
+  background: #2671e2;
+}
+.app-top {
+  width: 100%;
+  background: #ffffff;
+  box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.04);
+  border-radius: 4px;
+  padding-top: 15px;
+  padding-bottom: 15px;
+  .app-titel {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    .label {
+      font-size: 14px;
+      font-weight: 400;
+      color: #32363d;
+      line-height: 14px;
+      margin-left: 15px;
+    }
+    .toptimeqhuan {
+      height: 30px;
+      background: #ffffff;
+      display: flex;
+      align-items: center;
+    }
+    .toptimeqhuan div {
+      padding-left: 20px;
+      padding-right: 20px;
+      text-align: center;
+      line-height: 30px;
+      font-size: 14px;
+      margin-right: 15px;
+      border-radius: 4px;
+      border: 1px solid #e0e0e0;
+    }
+  }
+}
+</style>

vue.config.js

@@ -3,9 +3,9 @@
  * https://cli.vuejs.org/zh/config/
  */
 // const url = 'http://pigx-gateway'
-const url = 'http://39.97.167.65:9999' //测试
+// const url = 'http://39.97.167.65:9999' //测试
 // const url = 'http://192.168.31.161:9999' //长龙
-// const url = 'http://192.168.31.128:9999' //嘉豪
+const url = 'http://192.168.31.128:9999' //嘉豪
 
 const CompressionWebpackPlugin = require('compression-webpack-plugin')
 const productionGzipExtensions = ['js', 'css']