2023-11-22

src/pages/check/rule/add.vue

@@ -1,7 +1,7 @@
 <template>
 	<div class="form-submit">
 		<Card :bordered="false" dis-hover class="ivu-mt">
-			<Form :model="formData" :label-width="150">
+			<Form :model="formData" :label-width="100">
 				<FormItem label="规则名称" required>
 					<Input v-model="formData.groupname" v-width="320"></Input>
 				</FormItem>
@@ -36,19 +36,13 @@
 					<span> </span>
 				</FormItem> -->
 				<card class="day_box" v-for="(itemx,indexx) in formData.checkindate">
-					<div class="title">打卡设置</div>
 					<FormItem label="工作日" required>
-						<TagSelect v-model="itemx.workdays" hide-check-all>
-							<TagSelectOption :name="1">星期一</TagSelectOption>
-							<TagSelectOption :name="2">星期二</TagSelectOption>
-							<TagSelectOption :name="3">星期三</TagSelectOption>
-							<TagSelectOption :name="4">星期四</TagSelectOption>
-							<TagSelectOption :name="5">星期五</TagSelectOption>
-							<TagSelectOption :name="6">星期六</TagSelectOption>
-							<TagSelectOption :name="0">星期天</TagSelectOption>
+						<TagSelect @on-change='changeWordkey' v-model="itemx.workdays" hide-check-all>
+							<TagSelectOption v-for="item in tageList" :name="item.value">
+								{{item.name}}</TagSelectOption>
 						</TagSelect>
 					</FormItem>
-					<card class="time_box"  v-for="(item,index) in itemx.checkintime">
+					<card class="time_box" v-for="(item,index) in itemx.checkintime">
 						<!-- <FormItem label="时段id" required>
 							<Input v-width="320" placeholder="大于0，小于99999,且唯一" v-model="item.time_id"></Input>
 						</FormItem> -->
@@ -60,7 +54,8 @@
 							<TimePicker :steps="[1, 5]" placeholder="" v-width="320" format="HH:mm"
 								v-model="item.remind_work_sec" />
 						</FormItem>
-						<div style="padding: 0 0 10px 150px;">上班提醒时间不可晚于上班时间，且不可早于上班20分钟，只可以为准点、提前5分钟、提前10分钟、提前15分钟、提前20分钟</div>
+						<div class="jgTip">
+							上班提醒时间不可晚于上班时间，且不可早于上班20分钟，只可以为准点、提前5分钟、提前10分钟、提前15分钟、提前20分钟</div>
 						<FormItem label="上班最早时间" required>
 							<TimePicker :steps="[1, 5]" placeholder="" v-width="320" format="HH:mm"
 								v-model="item.earliest_work_sec" />
@@ -69,7 +64,7 @@
 							<TimePicker :steps="[1, 5]" placeholder="" v-width="320" format="HH:mm"
 								v-model="item.latest_work_sec" />
 						</FormItem>
-						
+
 						<FormItem label="下班时间" required>
 							<TimePicker :steps="[1, 5]" placeholder="" v-width="320" format="HH:mm"
 								v-model="item.off_work_sec" />
@@ -78,7 +73,8 @@
 							<TimePicker :steps="[1, 5]" placeholder="" v-width="320" format="HH:mm"
 								v-model="item.remind_off_work_sec" />
 						</FormItem>
-						<div style="padding: 0 0 10px 150px;">下班提醒时间不可早于下班时间，且不可晚于下班60分钟，只可以为准点、下班后10分钟、下班后20分钟、下班后30分钟、下班后60分钟</div>
+						<div class="jgTip">
+							下班提醒时间不可早于下班时间，且不可晚于下班60分钟，只可以为准点、下班后10分钟、下班后20分钟、下班后30分钟、下班后60分钟</div>
 						<FormItem label="下班最早时间" required>
 							<TimePicker :steps="[1, 5]" placeholder="" v-width="320" format="HH:mm"
 								v-model="item.earliest_off_work_sec" />
@@ -90,18 +86,16 @@
 						<Button type="primary" style="margin-left: 20px;" @click="delNewDk(itemx.checkintime,index)"
 							v-if="itemx.checkintime.length>1">删除</Button>
 					</card>
-					<Button type="primary" style="margin-left: 20px;" @click="addNewDk(itemx)"
-						>添加新上班时段</Button>
-					<Button type="primary" @click="delNewDkTime(indexx)"
+					<Button type="primary" @click="addNewDk(itemx)">添加新上班时段</Button>
+					<Button type="primary" style="margin-left: 20px;" @click="delNewDkTime(indexx)"
 						v-if="indexx>0">删除当前组</Button>
 				</card>
-			<Button type="primary" style="margin-top: 20px;" @click="addNewDkTime()">添加新打卡日期</Button>
+				<Button type="primary" style="margin-top: 20px;" @click="addNewDkTime()">添加新打卡日期</Button>
 			</Form>
 			<div style="width: 500px; display: flex;justify-content: center;">
 				<Button type="primary" class="submission" @click="save" :disabled="disabled"
 					v-if="!formData.id">立即创建</Button>
 				<Button type="primary" class="submission" @click="save" :disabled="disabled" v-else>立即修改</Button>
-				<Button type="primary" @click="showDate()">测试数据</Button>
 			</div>
 		</Card>
 		<Modal v-model="modals" title="员工列表" footerHide class="paymentFooter" scrollable width="900"
@@ -133,6 +127,35 @@
 				roterPre: Setting.roterPre,
 				disabled: false,
 				storesList: [],
+				tageList: [{
+					value: 1,
+					name: '星期一',
+					bool: false,
+				}, {
+					value: 2,
+					name: '星期二',
+					bool: false,
+				}, {
+					value: 3,
+					name: '星期三',
+					bool: false,
+				}, {
+					value: 4,
+					name: '星期四',
+					bool: false,
+				}, {
+					value: 5,
+					name: '星期五',
+					bool: false,
+				}, {
+					value: 6,
+					name: '星期六',
+					bool: false,
+				}, {
+					value: 0,
+					name: '星期天',
+					bool: false,
+				}],
 				formData: {
 					groupname: '',
 					grouptype: 1, //规则类型: 1-固定时间上下班；2-按班次上下班；3-自由上下班
@@ -144,10 +167,10 @@
 						loc_detail: "四川省成都市武侯区高新南区天府三街",
 						distance: 300
 					}],
-					wifimac_infos: [{
-						"wifiname": "Tencent-WiFi-1",
-						"wifimac": "c0:7b:bc:37:f8:d3"
-					}],
+					// wifimac_infos: [{
+					// 	"wifiname": "Tencent-WiFi-1",
+					// 	"wifimac": "c0:7b:bc:37:f8:d3"
+					// }],
 					range: {
 						userid: [
 							"qywx4633487382413312"
@@ -186,9 +209,16 @@
 		},
 		created() {},
 		methods: {
-			// 测试数据
-			showDate() {
-				console.log('shuju', this.formData)
+			// 触发改变事件
+			changeWordkey(res) {
+				for (let a = 0; a < this.tageList.length; a++) {
+					this.tageList[a].bool = false;
+					for (let i = 0; i < res.length; i++) {
+						if (this.tageList[a].value == res[i]) {
+							this.tageList[a].bool = true;
+						}
+					}
+				}
 			},
 			// 打开员工选择弹窗
 			chooseSatff() {
@@ -209,9 +239,8 @@
 				let str = hh + ':' + mm + ':' + '00'
 				console.log('str:', str)
 				return str
-
-
 			},
+			// 添加时间
 			addNewDk(item) {
 				item.checkintime.push({
 					"time_id": '',
@@ -225,6 +254,7 @@
 					"latest_off_work_sec": '' //	下班最晚时间
 				})
 			},
+			// 添加日期
 			addNewDkTime() {
 				this.formData.checkindate.push({
 					'workdays': [],
@@ -243,19 +273,16 @@
 					"flex_off_duty_time": 0
 				})
 			},
-
+			// 删除时间
 			delNewDkTime(index) {
 				this.formData.checkindate.splice(index, 1)
 			},
-			delNewDk(item,index) {
-				console.log(item,'itemx')
+			// 删除日期
+			delNewDk(item, index) {
+				console.log(item, 'itemx')
 				item.splice(index, 1)
 			},
-			// 
-			onchangeTime(e) {
-				console.log(e, 'xuanz');
-			},
-			// 商品id
+			// 用户id
 			getProductId(row) {
 				this.modals = false;
 				console.log(row, '这个');
@@ -265,52 +292,32 @@
 					arr.push(item.userid)
 				})
 				this.formData.range.userid = arr
-
-			},
-			// 选择商品
-			changeGoods() {
-				this.modals = true;
-			},
-			downTab() {
-				// if (!this.formData.store_name) {
-				// 	return this.$Message.error("请输入服务卡名称");
-				// }
-				// if (!this.formData.card_price) {
-				// 	return this.$Message.error("请输入售价");
-				// }
-				// if (!this.formData.repertory) {
-				// 	return this.$Message.error("请输入库存");
-				// }
 			},
 			getTime(str) {
-				if(typeof(str) == 'string') {
+				if (typeof(str) == 'string') {
 					let arr = str.split(':')
-					return arr[0]*60*60 + arr[1]*60
-				}else {
+					return arr[0] * 60 * 60 + arr[1] * 60
+				} else {
 					return str
 				}
-				
+
 			},
 			// 创建
 			save() {
 				let that = this
-				this.downTab();
-				console.log('这');
 				let qdata = {}
-				qdata = Object.assign(qdata,this.formData)
-				try{
-					// let qdata = JSON.parse(JSON.stringify(this.formData))
-					let checkindate = []
+				qdata = Object.assign(qdata, this.formData)
+				try {
+					let checkindate = [];
 					this.formData.checkindate.forEach(item => {
 						// checkindate.push(item.)
 						let mitem = []
 						item.checkintime.forEach(itemt => {
-							for(let key in itemt) {
-								// let val = ''
-								if(key != 'time_id') {
+							for (let key in itemt) {
+								if (key != 'time_id') {
 									itemt[key] = that.getTime(itemt[key])
-								}else {
-									itemt[key] = itemt[key]*1
+								} else {
+									itemt[key] = itemt[key] * 1
 								}
 							}
 							mitem.push(itemt)
@@ -319,13 +326,12 @@
 						checkindate.push(item)
 					})
 					qdata.checkindate = checkindate
-					console.log(qdata,'this.formData')
-				}catch(e){
+					console.log(qdata, 'this.formData')
+				} catch (e) {
 					//TODO handle the exception
-					console.log(e,'cuow')
+					console.log(e, 'cuow')
 				}
-				
-				
+				// 请求
 				addCheckRule({
 						'group': qdata
 					})
@@ -520,11 +526,19 @@
 	/deep/.vxe-tree-cell {
 		padding-left: 0 !important;
 	}
-	.day_box{
-		margin-bottom: 20px
-		min-width: 1000px
-		.time_box{
-			margin-bottom: 20px
+
+	.day_box {
+		margin-bottom: 20px;
+
+		.time_box {
+			margin-bottom: 20px;
 		}
 	}
+	.jgTip{
+		margin-top: -25px;
+		padding-left: 25px;
+		padding-bottom: 10px;
+		color: #c3c3c3;
+		font-size: 12px;
+	}
 </style>