值班管理子页面

frontend_web/src/api/duty.js

@@ -34,6 +34,13 @@ export default {
       method: 'get',
       params: params
     })
+  },
+   // 保存值班管理子表信息
+   addDetail (data) {
+    return request({
+      url: process.env.VUE_APP_API + 'duty/detail/adddetail',
+      method: 'post',
+      data: data
+    })
   }
-
-}
+}

frontend_web/src/views/duty/detail/index.vue

@@ -1,64 +1,78 @@
 <template>
-  <el-dialog title="新增值班表"
-             :visible.sync="dialogvisible"
-             width="80%">
-    <el-form size="mini"
-             label-width="100px">
-      <el-row :gutter="20">
-        <el-col :span="8">
-          <el-form-item label="学年"
-                        label-width="120px">
-            <el-select placeholder="请选择学年"
-                       style="width:100%"
-                       v-model="year">
-              <el-option v-for="item in years"
-                         :key="item.value"
-                         :label="item.label"
-                         :value="item.value">
-              </el-option>
-            </el-select>
-          </el-form-item>
-        </el-col>
-        <el-col :span="8">
-          <el-form-item label="学期"
-                        label-width="120px">
-            <el-input placeholder="请输入"
-                      style="width:100%"></el-input>
-          </el-form-item>
-        </el-col>
-        <el-col :span="8">
-          <el-form-item label="地点"
-                        label-width="120px">
-            <div style="margin: 15px 0;"></div>
-            <el-checkbox-group v-model="selectcites">
-              <el-checkbox v-for="city in cities"
-                           :label="city.label"
-                           :key="city.value">{{city.label}}</el-checkbox>
-            </el-checkbox-group>
-          </el-form-item>
-        </el-col>
-        <el-col :span="8">
-          <el-form-item label="值班人员"
-                        label-width="120px">
-            <el-tag @click="personClick(1)">人员1</el-tag>
-            <el-tag @click="personClick(2)">人员2</el-tag>
-          </el-form-item>
-        </el-col>
+  <d2-container>
+    <template slot="header"
+              style="padding: 5px;">
+      <el-form size="mini"
+               :model="dutyDetail"
+               label-width="100px">
+        <el-row :gutter="20">
+          <el-col :span="8">
+            <el-form-item label="学年"
+                          label-width="120px">
+              <el-select placeholder="请选择学年"
+                         style="width:100%"
+                         v-model="year">
+                <el-option v-for="item in years"
+                           :key="item.value"
+                           :label="item.label"
+                           :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="学期"
+                          label-width="120px">
+              <el-input placeholder="请输入"
+                        style="width:100%"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="地点"
+                          prop="Local"
+                          label-width="120px">
+              <el-checkbox-group v-model="dutyDetail.Local">
+                <el-checkbox v-for="item in LocalList"
+                             :label="item.ItemValue"
+                             :key="item.ItemValue">{{item.ItemName}}</el-checkbox>
+              </el-checkbox-group>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="值班人员"
+                          prop="People"
+                          label-width="120px">
+              <el-tag @click="personClick(item.ItemValue)"
+                      v-for="item in PeopleList"
+                      :key="item.ItemValue"
+                      :label="item.ItemValue">{{item.ItemName}}</el-tag>
+            </el-form-item>
 
-        <el-checkbox :indeterminate="isIndeterminateTime"
-                     v-model="timeAll"
-                     @change="handleCheckChange">时间</el-checkbox>
-        <div style="margin: 15px 0;"></div>
-        <el-checkbox-group v-model="checkedTime"
-                           @change="handleCheckedChange">
-          <el-checkbox v-for="city in schoolclass"
-                       :label="city"
-                       :key="city">{{city}}</el-checkbox>
-        </el-checkbox-group>
-      </el-row>
-    </el-form>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="课程时间"
+                          prop="Time"
+                          label-width="120px">
+              <el-checkbox-group v-model="dutyDetail.Time">
+                <el-checkbox v-for="item in TimeList"
+                             :label="item.ItemValue"
+                             :key="item.ItemValue">{{item.ItemName}}</el-checkbox>
+              </el-checkbox-group>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-button size="mini"
+                   type="primary"
+                   style="margin-left:10px"
+                   @click="addDuytDetail()">保存</el-button>
+        <el-button size="mini"
+                   style="margin-right:6px">返回</el-button>
+        <el-button size="mini"
+                   @click="addList()"
+                   style="margin-right:6px">生成表格</el-button>
+      </el-form>
+    </template>
     <el-table :data="list"
-              ref="multipleTable"
               border
               fit
               tooltip-effect="dark"
@@ -73,12 +87,14 @@
                        min-width="160px"
                        label="地点"
                        align="center"
-                       show-overflow-tooltip></el-table-column>
+                       show-overflow-tooltip
+                       :formatter="formatLocal"></el-table-column>
       <el-table-column prop="time"
                        label="时间段"
                        align="center"
                        min-width="120px"
-                       show-overflow-tooltip></el-table-column>
+                       show-overflow-tooltip
+                       :formatter="formatTime"></el-table-column>
       <el-table-column prop="mo"
                        label="周一"
                        align="center"
@@ -122,17 +138,9 @@
                        show-overflow-tooltip
                        :formatter="formatPerson"></el-table-column>
     </el-table>
-    <span slot="footer">
-      <el-button size="mini"
-                 type="primary">保存</el-button>
-      <el-button size="mini"
-                 @click="dialogvisible=false">关闭</el-button>
-    </span>
-  </el-dialog>
+  </d2-container>
 </template>
 <script>
-const cityOptions = ['计算机楼', '主楼', '科技楼']
-const classTime = ['8：00-10：00', '13：00-15：00', '18：00-20：00']
 // 总列数
 const columnNum = 9
 // 固定列数
@@ -149,25 +157,34 @@ const columnProperty = [
   'sa',
   'su'
 ]
-
+import DutyApi from '@/api/duty'
+import itemDetailApi from '@/api/sysadmin/itemdetail'
 export default {
   name: 'dutyEdit',
   data () {
     return {
+
+      LocalList: [],
+      PeopleList: [],
+      TimeList: [],
+      dutyDetail: {
+        Id: '',
+        DutyId: '',
+        Local: [],
+        Time: [],
+        Status: '',
+        People: [],
+        Monday: '',
+        Tuesday: '',
+        Wednesday: '',
+        Thursday: '',
+        Friday: '',
+        Saturday: '',
+        Sunday: ''
+      },
       year: '',
       edit: { year: 1 },
-      cities: [{ label: '上海', value: 0 }, { label: '北京', value: 1 }, { label: '广州', value: 2 }, { label: '深圳', value: 3 }],
-      times: [{ label: '8:00-12:00', value: 0 }, { label: '12:00-15:00', value: 1 }],
-      persons: [{ label: '人员1', value: 1 }, { label: '人员2', value: 2 }],
-      checkAll: false,
-      // 地点选择
-      isIndeterminate: true,
-      selectcites: [],
-      // 时间选择
-      isIndeterminateTime: true,
-      schoolclass: classTime,
-      timeAll: false,
-      checkedTime: [],
+      persons: [],
       years: [],
       dialogvisible: false,
       // 刷新标志 刷新表格样式
@@ -175,53 +192,94 @@ export default {
       // 已选列表
       selectcell: new Map(),
       // 数据列表
-      list: [{
-        position: 0,
-        time: 0,
-        mo: 0,
-        tu: 0,
-        we: 0,
-        th: 0,
-        fr: 0,
-        sa: 0,
-        su: 0
-      }, {
-        position: 1,
-        time: 1,
-        mo: 1,
-        tu: 1,
-        we: 1,
-        th: 1,
-        fr: 1,
-        sa: 1,
-        su: 1
-      }]
+      list: []
     }
   },
   created () {
     this.init()
   },
+  mounted () {
+    this.getLocal()
+    this.getPeople()
+    this.getDutyTime()
+  },
   methods: {
-    init () {
-      var myDate = new Date()
-      var year = myDate.getFullYear()// 获取当前年
-      this.initSelectYear(year)
+    // 新增表格
+    addList () {
+      if (this.dutyDetail.Local.length > 0 && this.dutyDetail.Local.Time) {
+        return
+      }
+      this.list = []
+      let _this = this
+      this.dutyDetail.Local.forEach(function (value, key) {
+        _this.dutyDetail.Time.forEach(function (valuee, keyy) {
+          _this.list.push({
+            position: value,
+            time: valuee,
+            mo: 0,
+            tu: 0,
+            we: 0,
+            th: 0,
+            fr: 0,
+            sa: 0,
+            su: 0
+          })
+        })
+      })
     },
-    handleCheckAllChange (checked, val) {
-      checked = val ? this.val : []
-      this.isIndeterminate = false
+    // 保存值班子表信息
+    addDuytDetail () {
+      if (valid) {
+        DutyApi.addDetail(this.dutyDetail, {})
+          .then(res => {
+          })
+          .catch(err => {
+            // handle error
+            console.error(err)
+          })
+      } else {
+        console.log('error submit!!')
+        return false
+      }
     },
+    // 获取字典表地点
+    getLocal () {
+      itemDetailApi.getItemDetailByItemCode({ ItemCode: 'Local' })
+        .then(res => {
+          this.LocalList = res
 
-    // 时间多选框
-    handleCheckChange (val) {
-      this.timeAll = val ? classTime : []
-      this.isIndeterminate = false
+        })
+        .catch(err => {
+          console.error(err)
+        })
     },
-    handleCheckedChange (value) {
-      let checkedCount = value.length
-      this.checkAll = checkedCount === this.schoolclass.length
-      this.isIndeterminate = checkedCount > 0 && checkedCount < this.schoolclass.length
+    // 获取字典表值班人员
+    getPeople () {
+      itemDetailApi.getItemDetailByItemCode({ ItemCode: 'People' })
+        .then(res => {
+          this.PeopleList = res
+        })
+        .catch(err => {
+          console.error(err)
+        })
     },
+    // 获取字典表课程时间段
+    getDutyTime () {
+      itemDetailApi.getItemDetailByItemCode({ ItemCode: 'DutyTime' })
+        .then(res => {
+          this.TimeList = res
+        })
+        .catch(err => {
+          console.error(err)
+        })
+    },
+    // 获取本年年份
+    init () {
+      var myDate = new Date()
+      var year = myDate.getFullYear()// 获取当前年
+      this.initSelectYear(year)
+    },
+    // 循环遍历年份
     initSelectYear (year) {
       this.years = []
       for (let i = 0; i < 5; i++) {
@@ -272,7 +330,7 @@ export default {
       }
       this.refresh = Math.random()
     },
-    // tag点击
+    // 选择值班人员
     personClick (person) {
       this.selectcell.forEach(function (value, key) {
         if (value) {
@@ -296,19 +354,32 @@ export default {
     },
     formatPerson (row, column, cellValue, index) {
       let label = '休息'
-      for (var i = 0; i < this.persons.length; i++) {
-        if (this.persons[i].value === cellValue) {
-          label = this.persons[i].label
+      for (var i = 0; i < this.PeopleList.length; i++) {
+        if (this.PeopleList[i].ItemValue === cellValue) {
+          return this.PeopleList[i].ItemName
         }
       }
       return label
+
+    }, formatLocal (row, column, cellValue, index) {
+      for (var i = 0; i < this.LocalList.length; i++) {
+        if (this.LocalList[i].ItemValue === cellValue) {
+          return this.LocalList[i].ItemName
+        }
+      }
+    }, formatTime (row, column, cellValue, index) {
+      for (var i = 0; i < this.TimeList.length; i++) {
+        if (this.TimeList[i].ItemValue === cellValue) {
+          return this.TimeList[i].ItemName
+        }
+      }
     }
   }
 }
 </script>
 <style>
-  .selectedCell {
-    background-color: green !important;
-    color: white;
-  }
+.selectedCell {
+  background-color: green !important;
+  color: white;
+}
 </style>

frontend_web/src/views/duty/index.vue

@@ -67,6 +67,7 @@
                      circle></el-button>
           <el-button size="mini"
                      type="info"
+                     title="详情"
                      icon="el-icon-notebook-2"
                      circle
                      @click="handleDetail(scope.row)"></el-button>
@@ -221,7 +222,7 @@ export default {
     // 打开二级页面
     handleDetail (duty) {
       let Id = parseInt(duty.Id)
-      this.$router.push({ path: '/duty/detail', query: { Id: Id } })
+      this.$router.push({ path: '/duty/detail', query: { duty: duty } })
     },
     // 添加 返回页面
     handleCloseAdd () {