dd_pc/src/views/rule.vue

<template>
	<div class="all-box">
		<!-- 头部提示 -->
		<el-alert class="diy-tip" title="如何使用积分规则?" type="success" @close="tips_close" v-if="tips_show" description show-icon>
			<p>先【添加规则分类】，再【添加规则】;或者直接【导入规则】</p>
		</el-alert>
		<div class="all">
			<div class="flex-box" v-loading="rule_loading">
				<div class="terr-left">
					<el-button size="medium" @click="add_class" type="primary">+ 添加规则分类</el-button>
					<div class="rule_class_box">
						<el-tree
							accordion
							:data="rule_tree"
							:expand-on-click-node="false"
							class="cate-tree"
							:props="defaultProps"
							:highlight-current="true"
							@node-click="handleNodeClick"
						></el-tree>
					</div>
				</div>
				<div class="terr-right border-right flex-1">
					<div class="flex-box flex-v-ce">
						<div class="name">{{ selectItem.name }}</div>
						<el-button size="medium" plain v-if="selectItem.id" @click="edit_class">编辑</el-button>
					</div>
					<div class="flex-box btns flex-v-ce">
						<el-button size="small" @click="del_item" type="danger" plain>批量删除</el-button>
						<el-button size="small" @click="add_rule" type="primary">添加规则</el-button>
						<el-button size="small" @click="import_rules_show = true" plain>导入规则</el-button>
					</div>
					<el-table stripe ref="multipleTable" :data="item_list" tooltip-effect="dark" @selection-change="handleSelectionChange" @row-click="editDetails" align="center">
						<el-table-column type="selection" width="55"></el-table-column>
						<el-table-column prop="remark" label="内容" align="left"></el-table-column>
						<el-table-column label="分值" align="center">
							<template slot-scope="scope">
								<div v-if="scope.row.range_type == 1">
									<span :class="scope.row.min_point > 0 ? 'red' : 'green'">{{ scope.row.min_point }}{{ scope.row.pt_Obj.name }}</span>
								</div>
								<div v-if="scope.row.range_type == 2">
									<span :class="scope.row.min_point > 0 ? 'red' : 'green'">{{ scope.row.min_point }}</span>
									至
									<span :class="scope.row.max_point > 0 ? 'red' : 'green'">{{ scope.row.max_point }}{{ scope.row.pt_Obj.name }}</span>
								</div>
							</template>
						</el-table-column>
						<template slot="empty">
							<noData></noData>
						</template>
					</el-table>
				</div>
			</div>
		</div>
		<!-- 编辑添加分类 -->
		<el-dialog :title="class_type == 'add' ? '添加规则分类' : '编辑规则分类'" :visible.sync="class_show" :close-on-click-modal="false" width="500px">
			<el-form :model="dept_formdata" ref="dept_formdata" :rules="dept_formdata_rules" label-width="80px">
				<el-form-item label="规则分类" prop="name"><el-input v-model="dept_formdata.name"></el-input></el-form-item>
				<el-form-item label="上级分类">
					<el-cascader
						v-model="dept_formdata.pid"
						:options="rule_tree"
						:props="{ checkStrictly: true, label: 'name', value: 'id', children: 'child' }"
						clearable
					></el-cascader>
				</el-form-item>
				<el-form-item style="text-align: right; margin-bottom:0;">
					<el-button type="danger" @click="del_dept" v-show="class_type == 'edit'">删除分类</el-button>
					<el-button @click="add_dept_close('dept_formdata')">取消</el-button>
					<el-button type="primary" @click="submit_add_dept('dept_formdata')" :loading="dept_loading">确定</el-button>
				</el-form-item>
			</el-form>
		</el-dialog>

		<!-- 添加编辑规则 -->
		<el-dialog :title="rule_type == 'add' ? '添加规则' : '编辑规则'" :visible.sync="rule_show" :close-on-click-modal="false" width="550px">
			<el-form :model="rules_detail_form" ref="rules_detail_form" :rules="rules" label-width="80px">
				<el-form-item label="规则内容" prop="remark">
					<el-input v-model="rules_detail_form.remark" placeholder="请输入规则内容" type="textarea" :rows="3" maxlength="100" show-word-limit></el-input>
				</el-form-item>
				<el-form-item label="所属分类" prop="rule_id">
					<div style="position: relative;">
						<div
							style="position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 9;"
							@click="not_data"
							v-show="rule_tree !== null && rule_tree.length == 0"
						></div>
						<el-cascader
							placeholder="请选择分类"
							v-model="rules_detail_form.rule_id"
							@visible-change="select_rule"
							:options="rule_tree"
							:props="{ checkStrictly: true, label: 'name', value: 'id', children: 'child' }"
						></el-cascader>
					</div>
				</el-form-item>
				<el-form-item label="规则类型" prop="pt_id">
					<el-radio v-model="rules_detail_form.pt_id" :label="item.id" v-for="(item, index) in point_types" :key="index" v-show="item.name !== '绩效分'">
						{{ item.name }}
					</el-radio>
				</el-form-item>
				<el-form-item label="规则积分" prop="range_type">
					<el-radio-group v-model="rules_detail_form.range_type">
						<el-radio :label="item.value" v-for="(item, index) in range_type_arr" :key="index">{{ item.name }}</el-radio>
					</el-radio-group>
				</el-form-item>
				<el-form-item>
					<el-row :gutter="20" class="select_width">
						<el-col :span="11">
							<el-input
								placeholder="请输入分值"
								:rules="[{ required: true, message: '请输入加分项名称', trigger: 'blur' }]"
								v-model="rules_detail_form.min_point"
								type="Number"
								class="input-with-select"
							>
								<el-select v-model="integral_select_name1" slot="prepend" placeholder="请选择类型">
									<el-option v-for="(item, index) in integral_select" :key="index" :label="item.name" :value="item.value"></el-option>
								</el-select>
							</el-input>
						</el-col>
						<el-col :span="2" v-show="rules_detail_form.range_type == 2">至</el-col>
						<el-col :span="11" v-show="rules_detail_form.range_type == 2">
							<el-input
								placeholder="请输入分值"
								:rules="[{ required: true, message: '请输入加分项名称', trigger: 'blur' }]"
								v-model="rules_detail_form.max_point"
								type="Number"
								class="input-with-select"
							>
								<el-select v-model="integral_select_name2" slot="prepend" placeholder="请选择类型" style="width: 100px;">
									<el-option v-for="(item, index) in integral_select" :key="index" :label="item.name" :value="item.value"></el-option>
								</el-select>
							</el-input>
						</el-col>
					</el-row>
				</el-form-item>
				<el-form-item style="text-align: right; margin-bottom:0;">
					<el-button type="danger" @click="del_rule" :loading="delRule_loading" v-show="rule_type == 'edit'">删除规则</el-button>
					<el-button @click="rule_close('rules_detail_form')">取消</el-button>
					<el-button type="primary" v-show="rule_type == 'add'" :loading="rule_loading2" @click="add_submit_rule('rules_detail_form')">确定</el-button>
					<el-button type="primary" v-show="rule_type == 'edit'" :loading="rule_loading2" @click="edit_submit_rule('rules_detail_form')">确定</el-button>
				</el-form-item>
			</el-form>
		</el-dialog>

		<!-- 导入规则 -->
		<el-dialog title="导入规则" :visible.sync="import_rules_show" width="500px" @before-close="close_import">
			<el-row>
				<el-col :span="12">
					<div class="text-center">
						<p>1、下载规则模版，填写好规则</p>
						<p><img src="../assets/image/rules_mould.png" alt="" /></p>
						<p>规则表</p>
						<p>
							<a target="_blank" :href="'/api/download/rule_item'"><el-button type="primary">下载模板</el-button></a>
						</p>
					</div>
				</el-col>
				<el-col :span="12">
					<div class="text-center">
						<p>2、上传填好的规则表</p>
						<p><img src="../assets/image/rules_mould1.png" alt="" /></p>
						<p>仅支持xls、xlsx格式文件</p>
						<el-upload
							class="upload-demo"
							:headers="ATOKEN"
							:data="{ type: 'rule_item' }"
							ref="upload"
							:limit="1"
							action="https://ding.insys.g107.com/api/upload/excel"
							:on-preview="handlePreview"
							:on-remove="handleRemove"
							:on-success="handleSuccess"
							:before-upload="beforeFilesUpload"
							:file-list="fileList"
						>
							<el-button slot="trigger" type="primary">选取文件</el-button>
						</el-upload>
						<p><el-button type="primary" @click="submitUpload" :loading="save_loading" v-show="import_btn_show" block>导入</el-button></p>
					</div>
				</el-col>
			</el-row>
		</el-dialog>
	</div>
</template>

<script>
import noData from '@/components/noData';
export default {
	data() {
		return {
			ATOKEN: { 'A-TOKEN': this.$getToken() },
			tips_show: true,
			rule_loading: false,
			rule_tree: [],
			item_list: [],
			all_item_list: [],
			defaultProps: {
				id: 'id',
				children: 'child',
				label: 'name'
			},
			selectItem: { name: '积分分类' }, //选择的分类
			//添加分类
			class_show: false,
			delRule_loading:false,
			dept_formdata_rules: {
				name: [
					{
						required: true,
						message: '请输入规则分类',
						trigger: 'blur'
					},
					{
						min: 2,
						max: 20,
						message: '长度在 2 到 20 个字符',
						trigger: 'blur'
					}
				]
			},
			dept_formdata: {
				name: '',
				pid: '0',
				cycle_type: '1'
			},
			class_type: 'add',
			dept_loading:false,

			// 规则相关
			del_item_id: [], //选择规则ID集合
			rule_loading2: false,
			rule_type: 'add',
			rule_show: false,
			rules_detail_form: {
				rule_id: '',
				range_type: '1',
				prize_type: '0',
				min_point: '',
				max_point: '',
				remark: '',
				is_attendance: '0',
				cycle_type: '1',
				pt_id: 0
			},
			rules: {
				remark: [
					{
						required: true,
						message: '请输入规则名称',
						trigger: 'blur'
					}
				],
				rule_id: [
					{
						required: true,
						message: '请选择分类',
						trigger: 'change'
					}
				]
			},
			integral_select_name1: '1',
			integral_select_name2: '1',
			point_types: [],
			range_type_arr: [
				{
					name: '固定分值',
					value: '1'
				},
				{
					name: '范围分值',
					value: '2'
				}
			],
			integral_select: [
				{
					name: '奖分',
					value: '1'
				},
				{
					name: '扣分',
					value: '2'
				}
			],
			//导入规则
			import_rules_show: false,
			save_loading: false,
			import_btn_show: false,
			fileList: [],
			file: null,
			flName:'',
		};
	},
	components: {
		noData
	},
	created() {
		this.point_types = this.$getTyps();
		this.getData();
	},
	mounted() {
		this.$nextTick(function() {
			if (localStorage.getItem('rule')) {
				this.tips_show = false;
			} else {
				this.tips_show = true;
			}
		});
	},
	methods: {
		// 导入相关
		close_import() {
			this.import_rules_show = false;
			this.import_btn_show = false;
			this.$refs.upload.clearFiles();
		},
		submitUpload() {
			this.save_loading = true;
			let params = {
				file: this.file
			};
			this.$axios.post('/api/rule/import', params).then(res => {
					if (res.data.code == 1) {
						this.close_import();
						this.$message.success({ message: res.data.msg });
						this.getData();
					} else {
						this.$message({ type: 'error', message: res.data.msg });
					}
				}).finally(() => {
					this.save_loading = false;
				});
		},
		handleSuccess(response) {
			if (response.code == 1) {
				this.file = response.data;
			}
		},
		handleRemove(file, fileList) {
			if (fileList !== null && fileList.length != 0) {
				this.import_btn_show = true;
			} else {
				this.import_btn_show = false;
			}
		},
		handlePreview(file) {
			console.log(file);
		},
		imgChange(file, fileList) {
			if (fileList !== null && fileList.length != 0) {
				this.import_btn_show = true;
			} else {
				this.import_btn_show = false;
			}
		},
		beforeFilesUpload(file) {
			const $ext_list = ['xlsx', 'xls'];
			let len = file.name.split('.').length - 1;
			const $ext_name = file.name.split('.')[len];
			if ($ext_list.indexOf($ext_name) != -1) {
				this.import_btn_show = true;
			} else {
				this.$message.warning('文件格式上传错误,仅支持上传xlsx,xls）');
				return false;
			}
		},

		edit_submit_rule(form) {
			this.rule_loading2=true;
			let self = this;
			self.$refs[form].validate(valid => {
				if (valid) {
					if (self.integral_select_name1 != '1' && self.rules_detail_form.min_point >= 0) {
						self.rules_detail_form.min_point = '-' + self.rules_detail_form.min_point;
					}
					if (self.integral_select_name2 != '1' && self.rules_detail_form.max_point >= 0) {
						self.rules_detail_form.max_point = '-' + self.rules_detail_form.max_point;
					}
					if (self.rules_detail_form.range_type == 1) {
						self.rules_detail_form.max_point = self.rules_detail_form.min_point;
					}
					if (parseFloat(self.rules_detail_form.min_point) > parseFloat(self.rules_detail_form.max_point)) {
						this.$confirm(
							'填写的规则积分是' +
								self.rules_detail_form.min_point +
								' ～ ' +
								self.rules_detail_form.max_point +
								'，应该是 ' +
								self.rules_detail_form.max_point +
								' ～ ' +
								self.rules_detail_form.min_point +
								'吧？',
							'提示',
							{
								confirmButtonText: '确定',
								cancelButtonText: '取消',
								type: 'warning'
							}
						)
							.then(() => {
								let min_point = self.rules_detail_form.min_point;
								self.rules_detail_form.min_point = self.rules_detail_form.max_point;
								self.rules_detail_form.max_point = min_point;
								let data = self.rules_detail_form;
								data.item_id = self.rules_detail_form.id;
								if (self.rules_detail_form.min_point == 0 && self.rules_detail_form.range_type == 1) {
									self.$message.error('积分不能为零');
									this.rule_loading2=false;
									return false;
								}
								this.$axios.post('/api/integral/rule/items/edit', data).then(res => {
										if (res.data.code == 1) {
											self.$message.success(res.data.msg);
											self.getData();
											self.rule_close(form);
										}
								}).finally(err=>{
									this.rule_loading2=false;
								});
							
							})
					} else {
						self.rules_detail_form.item_id = self.rules_detail_form.id;
						let data = self.rules_detail_form;
						data.item_id = self.rules_detail_form.id;
						if (self.rules_detail_form.min_point == 0 && self.rules_detail_form.range_type == 1) {
							self.$message.error('积分不能为零');
							this.rule_loading2=false;
							return false;
						}
						this.$axios.post('/api/integral/rule/items/edit', data).then(res => {
								if (res.data.code == 1) {
									self.$message.success(res.data.msg);
									self.getData();
									self.rule_close(form);
								}
							}).finally(() => {
								this.rule_loading2 = false;
							});
					}
				} else {
					this.rule_loading2=false;
					return false;
				}
			});
		},
		//添加规则
		add_submit_rule(form) {
			this.rule_loading2=true;
			let self = this;
			self.$refs[form].validate(valid => {
				if (valid) {
					if (self.integral_select_name1 != '1' && self.rules_detail_form.min_point >= 0) {
						self.rules_detail_form.min_point = '-' + self.rules_detail_form.min_point;
					}
					if (self.integral_select_name2 != '1' && self.rules_detail_form.max_point >= 0) {
						self.rules_detail_form.max_point = '-' + self.rules_detail_form.max_point;
					}
					if (self.rules_detail_form.range_type == 1) {
						self.rules_detail_form.max_point = self.rules_detail_form.min_point;
					}
					if (parseFloat(self.rules_detail_form.min_point) > parseFloat(self.rules_detail_form.max_point)) {
						this.$confirm(
							'填写的规则积分是' +
								self.rules_detail_form.min_point +
								' ～ ' +
								self.rules_detail_form.max_point +
								'，应该是 ' +
								self.rules_detail_form.max_point +
								' ～ ' +
								self.rules_detail_form.min_point +
								'吧？',
							'提示',
							{
								confirmButtonText: '确定',
								cancelButtonText: '取消',
								type: 'warning'
							}
						).then(() => {
							let min_point = self.rules_detail_form.min_point;
							self.rules_detail_form.min_point = self.rules_detail_form.max_point;
							self.rules_detail_form.max_point = min_point;
							if (self.rules_detail_form.min_point == 0 && self.rules_detail_form.range_type == 1) {
								self.$message.error('积分不能为零');
								this.rule_loading2=false;
								return false;
							}
							let data = {
								items: [self.rules_detail_form]
							};
							this.$axios
								.post('/api/integral/rule/items', data)
								.then(res => {
									if (res.data.code == 1) {
										self.$message.success(res.data.msg);
										self.getData();
										self.rule_close(form);
									}
								}).finally(() => {
									this.rule_loading2 = false;
								});
						});
					} else {
						self.rules_detail_form.item_id = self.rules_detail_form.id;
						if (self.rules_detail_form.min_point == 0 && self.rules_detail_form.range_type == 1) {
							self.$message.error('积分不能为零');
							this.rule_loading2=false;
							return false;
						}
						let data = {
							items: [self.rules_detail_form]
						};
						this.$axios.post('/api/integral/rule/items', data).then(res => {
								if (res.data.code == 1) {
									self.$message.success(res.data.msg);
									self.getData();
									self.rule_close(form);
								}
							}).finally(() => {
								this.rule_loading2 = false;
							});
					}
				} else {
					this.rule_loading2=false;
					return false;
				}
			});
		},
		//删除规则
		del_rule() {
			let self = this;
			let data = {
				item_id: [this.rules_detail_form.id]
			};
			this.delRule_loading=true;
			self.$confirm('此操作将永久删除该选项, 是否继续?', '提示').then(() => {
					this.$axios.post('/api/integral/rule/items/destroy', data).then(res => {
							if (res.data.code == 1) {
								self.$message.success(res.data.msg);
								self.rule_show = false;
								self.getData(true);
							}
						}).finally(() => {
							this.delRule_loading = false;
						});
			});
		},
		//关闭规则弹窗
		rule_close(form) {
			this.rule_show = false;
			this.$refs[form].resetFields();
		},
		select_rule(val) {
			if (!val) {
				this.rules_detail_form.rule_id = this.rules_detail_form.rule_id[this.rules_detail_form.rule_id.length - 1];
			}
		},
		not_data() {
			this.$confirm('暂时没有积分分类,是否前往添加?', '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning'
			}).then(() => {
					this.rule_show = false;
					this.class_show = true;
			})
		},
		add_rule() {
			this.rule_show = true;
			this.rule_type = 'add';
			this.rules_detail_form = {
				rule_id: '',
				range_type: '1',
				prize_type: '0',
				min_point: '',
				max_point: '',
				remark: '',
				is_attendance: '0',
				cycle_type: '1',
				pt_id: 2
			};
			this.integral_select_name1 = '1';
			this.integral_select_name2 = '1';
		},
		del_item() {
			if (this.del_item_id.length == 0) {
				this.$message.error('请选择积分细则');
				return false;
			}
			this.$confirm('此操作将永久删除该选项, 是否继续?', '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning'
			}).then(() => {
				let data = {
					item_id: this.del_item_id
				};
				this.$axios
					.post('/api/integral/rule/items/destroy', data)
					.then(res => {
						if (res.data.code == 1) {
							this.$message.success(res.data.msg);
							this.getData(true);
							this.handleNodeClick(this.selectItem);
						}
					})
			});
		},

		editDetails(val) {
			this.rules_detail_form = JSON.parse(JSON.stringify(val));
			if (this.rules_detail_form.min_point == this.rules_detail_form.max_point) {
				this.rules_detail_form.range_type = '1';
			} else {
				this.rules_detail_form.range_type = '2';
			}
			if (this.rules_detail_form.min_point < 0) {
				this.integral_select_name1 = '2';
			} else {
				this.integral_select_name1 = '1';
			}
			if (this.rules_detail_form.max_point < 0) {
				this.integral_select_name2 = '2';
			} else {
				this.integral_select_name2 = '1';
			}
			this.rule_show = true;
			this.rule_type = 'edit';
		},
		handleSelectionChange(val) {
			this.del_item_id = [];
			val.forEach(element => {
				this.del_item_id.push(element.id);
			});
		},

		handleNodeClick(e) {
			var items = this.getItemData(e);
			this.selectItem = {
				child: e.child,
				id: e.id,
				name:e.name,
				pid: e.pid,
			};
			this.flName=e.name;
			this.item_list = items;
		},
		getItemData(e) {
			var ids = [];
			var lists = [];
			if (e.child && e.child.length > 0) {
				ids.push(e.id);
				e.child.map(item => {
					ids.push(item.id);
					if (item.child && item.child.length > 0) {
						item.child.map(item1 => {
							ids.push(item1.id);
							if (item1.child && item1.child.length > 0) {
								item1.child.map(item2 => {
									ids.push(item2.id);
								});
							}
						});
					}
				});
				for (var i = 0; i < ids.length; i++) {
					lists.push(...this.filterItem(ids[i]));
				}
			} else {
				lists = this.filterItem(e.id);
			}
			return lists;
		},
		//根据分类ID获取对应的规则
		filterItem(id) {
			var all_item_list = this.all_item_list;
			var items = all_item_list.filter(item => {
				return item.rule_id == id;
			});
			return items;
		},

		getData(is) {
			this.rule_loading = true;
			var that = this;
			this.$axios.get('api/integral/rule/trees', { params: { cycle_type: 1 } }).then(res => {
				var item_list = res.data.data.item_list || [];
				var list = [];
				for (let i in item_list) {
					for (let k in item_list[i]) {
						item_list[i][k].pt_Obj = that.$getTyps(item_list[i][k].pt_id);
						list.push(item_list[i][k]);
					}
				}
				that.rule_tree = res.data.data.rule_tree || [];
				that.item_list = list;
				that.all_item_list = list;
				if (is) {
					that.handleNodeClick(that.selectItem);
				} else {
					this.selectItem = { name: '积分分类' }; //选择的分类
				}
			}).finally(() => {
				this.rule_loading = false;
			});
		},
		//编辑分组
		edit_class() {
			this.class_show = true;
			this.class_type = 'edit';
			this.dept_formdata={
				child: this.selectItem.child,
				id: this.selectItem.id,
				name: this.selectItem.name,
				pid: this.selectItem.pid,
			}
		},
		//添加分组
		submit_add_dept(form) {
			this.dept_loading=true;
			let that = this;
			that.$refs[form].validate(valid => {
				if (valid) {
					if (that.class_type == 'edit') {
						delete that.dept_formdata.child;
						that.dept_formdata.rule_id = that.dept_formdata.id;
						if(typeof(that.dept_formdata.pid)=='number'){
						}else{
							if(that.dept_formdata.pid.length>0){
								that.dept_formdata.pid =that.dept_formdata.pid[that.dept_formdata.pid.length - 1];
							}else{
								that.dept_formdata.pid=0;
							}
						}
						this.$axios.post('/api/integral/rule/edit', that.dept_formdata).then(res => {
							if (res.data.code == 1) {
								that.selectItem.name=that.dept_formdata.name;
								that.$message.success('修改积分分类成功');
								this.getData(true);
								this.add_dept_close('dept_formdata');
							}
						}).finally(() => {
							this.dept_loading = false;
						});
					} else {
						if (that.dept_formdata.pid !== null && that.dept_formdata.pid.length == 0) {
							that.dept_formdata.pid = 0;
						} else {
							that.dept_formdata.pid = that.dept_formdata.pid[that.dept_formdata.pid.length - 1];
						}
						this.$axios.post('/api/integral/rule', that.dept_formdata).then(res => {
							if (res.data.code == 1) {
								that.$message.success('添加积分分类成功');
								this.getData(true);
								this.add_dept_close('dept_formdata');
							}
						}).finally(() => {
							this.dept_loading = false;
						});
					}
				} else {
					this.dept_loading=false;
				}
			});
			
		},
		//删除分组
		del_dept() {
			this.$confirm('此操作将永久删除该分组, 是否继续?', '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning'
			}).then(() => {
				this.$axios.post('/api/integral/rule/destroy', { rule_id: this.selectItem.id }).then(res => {
					if (res.data.code == 1) {
						this.$message.success(res.data.msg);
						this.getData();
						this.add_dept_close('dept_formdata');
					}
				});
			});
		},
		//关闭弹窗
		add_dept_close(form) {
			this.class_show = false;
			// this.$refs[form].resetFields();
		},
		//关闭提示
		tips_close() {
			localStorage.setItem('rule', 'true');
			this.tips_show = false;
		},
		//添加分类
		add_class() {
			this.class_show = true;
			this.class_type = 'add';
			this.dept_formdata = {
				name: '',
				pid: '0',
				cycle_type: '1'
			};
		}
	}
};
</script>

<style scoped lang="scss">
.select_width .el-select {
	width: 80px;
}
.text-center {
	text-align: center;
}
.text-center p {
	padding: 10px 0;
}
.terr-right {
	.name {
		font-size: 18px;
		margin-right: 20px;
	}
	.btns button {
		margin-top: 20px;
		margin-right: 5px;
	}
}
.rule_class_box {
	::v-deep .el-tree-node {
		border-bottom: 1px #f8f8f8 solid;
	}
	::v-deep .el-tree-node__content {
		padding: 10px 0;
		border-bottom: 1px #f8f8f8 solid;
	}
	::v-deep .el-tree-node__content:hover {
		background: #ecf5ff;
		border-radius: 4px;
	}
	::v-deep .is-current .el-tree-node__content .el-icon-caret-right {
		color: #409eff !important;
	}
	::v-deep .is-current .el-tree-node__content .el-tree-node__label {
		color: #409eff !important;
	}
	::v-deep .is-current .el-tree-node__children .el-icon-caret-right {
		color: #c0c4cc !important;
	}
	::v-deep .is-current .el-tree-node__children .el-tree-node__label {
		color: #606266 !important;
	}
	::v-deep .el-tree-node__label {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
}
.terr-left button {
	margin: 0 auto;
	display: block;
	margin-bottom: 20px;
}
</style>