|
|
@@ -1,95 +1,121 @@
|
|
|
<template>
|
|
|
- <div class="container" style="min-height: 100%; padding-bottom: 100px;">
|
|
|
- <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-border">
|
|
|
- <div style="display:inline-block;width:100%;">
|
|
|
+ <div class="app-container" style="min-height: 100%;">
|
|
|
+ <el-form :model="day" :rules="rules" ref="day" label-width="130px">
|
|
|
+ <div class="form-item">
|
|
|
<el-row>
|
|
|
- <div style="background: grey">
|
|
|
- 每日履职
|
|
|
- </div>
|
|
|
- <el-col :xs="24" :sm="12" :md="8" :lg="6">
|
|
|
- <el-form-item label="营业前提醒分钟数" prop="workType">
|
|
|
- <el-input-number v-model="num" @change="handleChange" :min="1" :max="10" label="描述文字"></el-input-number>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="4">
|
|
|
+ <div class="item-title">
|
|
|
+ 每日履职
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="5">
|
|
|
+ <el-form-item label="营业前提醒:" prop="workType">
|
|
|
+
|
|
|
+ <el-input-number size="mini" style="width: 70%;" v-model="day.font" @change="handleChange" :min="1" :max="10" label="描述文字"></el-input-number>
|
|
|
+ 分钟
|
|
|
+
|
|
|
+
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
- <el-col :xs="24" :sm="12" :md="8" :lg="6">
|
|
|
- <el-form-item label="营业中提醒分钟数" prop="educationType">
|
|
|
- <el-input-number v-model="num" @change="handleChange" :min="1" :max="10" label="描述文字"></el-input-number>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="5">
|
|
|
+ <el-form-item label="营业中提醒:" prop="educationType">
|
|
|
+ <el-input-number size="mini" style="width: 70%;" v-model="day.z" @change="handleChange" :min="1" :max="10" label="描述文字"></el-input-number>
|
|
|
+ 分钟
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
|
|
|
- <el-col :xs="24" :sm="12" :md="8" :lg="6">
|
|
|
- <el-form-item label="营业后提醒分钟数" prop="professionalQualifications">
|
|
|
- <el-input-number v-model="num" @change="handleChange" :min="1" :max="10" label="描述文字"></el-input-number>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="5">
|
|
|
+ <el-form-item label="营业后提醒:" prop="professionalQualifications">
|
|
|
+ <el-input-number size="mini" style="width: 70%;" v-model="day.h" @change="handleChange" :min="1" :max="10" label="描述文字"></el-input-number>
|
|
|
+ 分钟
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
- <el-col :xs="24" :sm="12" :md="8" :lg="6">
|
|
|
- <el-form-item label="全天提醒分钟数" prop="professionalQualifications">
|
|
|
- <el-input-number v-model="num" @change="handleChange" :min="1" :max="10" label="描述文字"></el-input-number>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="5">
|
|
|
+ <el-form-item label="全天提醒:" prop="professionalQualifications">
|
|
|
+ <el-input-number size="mini" style="width: 70%;" v-model="day.all" @change="handleChange" :min="1" :max="10" label="描述文字"></el-input-number>
|
|
|
+ 分钟
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
-
|
|
|
</div>
|
|
|
- <div style="display:inline-block;width:100%;">
|
|
|
+ </el-form>
|
|
|
+ <el-form :model="week" :rules="rules" ref="week" label-width="130px">
|
|
|
+ <div class="form-item">
|
|
|
<el-row>
|
|
|
- <div style="background: grey">
|
|
|
- 每周履职
|
|
|
- </div>
|
|
|
- <el-col :xs="24" :sm="12" :md="8" :lg="6">
|
|
|
- <el-form-item label="提前提醒天数" prop="educationType">
|
|
|
- <el-input-number v-model="num" @change="handleChange" :min="1" :max="10" label="描述文字"></el-input-number>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="4">
|
|
|
+ <div class="item-title">
|
|
|
+ 每周履职
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="5">
|
|
|
+ <el-form-item label="提前提醒:" prop="educationType">
|
|
|
+ <el-input-number size="mini" style="width: 70%" v-model="num" @change="handleChange" :min="1" :max="10" label="描述文字"></el-input-number>
|
|
|
+ 天
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
-
|
|
|
</div>
|
|
|
- <div style="display:inline-block;width:100%;">
|
|
|
+ </el-form>
|
|
|
+ <el-form :model="month" :rules="rules" ref="month" label-width="130px">
|
|
|
+ <div class="form-item">
|
|
|
<el-row>
|
|
|
- <div style="background: grey">
|
|
|
- 每月履职
|
|
|
- </div>
|
|
|
-
|
|
|
- <el-col :xs="24" :sm="12" :md="8" :lg="6">
|
|
|
- <el-form-item label="提前提醒天数" prop="educationType">
|
|
|
- <el-input-number v-model="num" @change="handleChange" :min="1" :max="10" label="描述文字"></el-input-number>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="4">
|
|
|
+ <div class="item-title">
|
|
|
+ 每月履职
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="5">
|
|
|
+ <el-form-item label="提前提醒:" prop="educationType">
|
|
|
+ <el-input-number size="mini" v-model="num" style="width: 70%" @change="handleChange" :min="1" :max="10" label="描述文字"></el-input-number>
|
|
|
+ 天
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
</div>
|
|
|
- <div style="display:inline-block;width:100%;">
|
|
|
+ </el-form>
|
|
|
+ <el-form :model="season" :rules="rules" ref="season" label-width="130px">
|
|
|
+ <div class="form-item">
|
|
|
<el-row>
|
|
|
- <div style="background: grey">
|
|
|
- 每季履职
|
|
|
- </div>
|
|
|
-
|
|
|
- <el-col :xs="24" :sm="12" :md="8" :lg="6">
|
|
|
- <el-form-item label="提前提醒天数" prop="educationType">
|
|
|
- <el-input-number v-model="num" @change="handleChange" :min="1" :max="10" label="描述文字"></el-input-number>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="4">
|
|
|
+ <div class="item-title">
|
|
|
+ 每季履职
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="5">
|
|
|
+ <el-form-item label="提前提醒:" prop="educationType">
|
|
|
+ <el-input-number size="mini" v-model="num" style="width: 70%" @change="handleChange" :min="1" :max="10" label="描述文字"></el-input-number>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
</div>
|
|
|
- <div style="display:inline-block;width:100%;">
|
|
|
+ </el-form>
|
|
|
+ <el-form :model="holfYear" :rules="rules" ref="holfYear" label-width="130px">
|
|
|
+ <div class="form-item">
|
|
|
<el-row>
|
|
|
- <div style="background: grey">
|
|
|
- 半年履职
|
|
|
- </div>
|
|
|
-
|
|
|
- <el-col :xs="24" :sm="12" :md="8" :lg="6">
|
|
|
- <el-form-item label="提前提醒天数" prop="educationType">
|
|
|
- <el-input-number v-model="num" @change="handleChange" :min="1" :max="10" label="描述文字"></el-input-number>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="4">
|
|
|
+ <div class="item-title">
|
|
|
+ 半年履职
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="5">
|
|
|
+ <el-form-item label="提前提醒:" prop="educationType">
|
|
|
+ <el-input-number size="mini" v-model="num" style="width: 70%" @change="handleChange" :min="1" :max="10" label="描述文字"></el-input-number>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
</div>
|
|
|
- <div style="display:inline-block;width:100%;">
|
|
|
+ </el-form>
|
|
|
+ <el-form :model="year" :rules="rules" ref="year" label-width="130px">
|
|
|
+ <div class="form-item">
|
|
|
<el-row>
|
|
|
- <div style="background: grey">
|
|
|
- 每年履职
|
|
|
- </div>
|
|
|
- <el-col :xs="24" :sm="12" :md="8" :lg="6">
|
|
|
- <el-form-item label="提前提醒天数" prop="educationType">
|
|
|
- <el-input-number v-model="num" @change="handleChange" :min="1" :max="10" label="描述文字"></el-input-number>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="4">
|
|
|
+ <div class="item-title">
|
|
|
+ 每年履职
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="5">
|
|
|
+ <el-form-item label="提前提醒:" prop="educationType">
|
|
|
+ <el-input-number size="mini" v-model="num" style="width: 70%" @change="handleChange" :min="1" :max="10" label="描述文字"></el-input-number>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
@@ -110,7 +136,12 @@ export default {
|
|
|
data() {
|
|
|
return {
|
|
|
num: 1,
|
|
|
-
|
|
|
+ day:{},
|
|
|
+ week:{},
|
|
|
+ month:{},
|
|
|
+ season:{},
|
|
|
+ holfYear:{},
|
|
|
+ year:{},
|
|
|
formData:{
|
|
|
deptId: null,
|
|
|
duties: null,
|
|
|
@@ -226,12 +257,21 @@ export default {
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
-<style scoped>
|
|
|
-.container {}
|
|
|
-
|
|
|
-.demo-border {
|
|
|
- border: 1px grey dashed;
|
|
|
- min-height: 1rem;
|
|
|
- border-radius: 5px;
|
|
|
+<style lang="scss" scoped>
|
|
|
+.form-item{
|
|
|
+ border: 1px solid #f1f1f1;
|
|
|
+ margin-bottom: 2px;
|
|
|
+ min-height: 100px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.item-title{
|
|
|
+ width: 100px;
|
|
|
+ color: #fff;
|
|
|
+ background-color: #ccc;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ height: 100%;
|
|
|
}
|
|
|
</style>
|