终端培训更新

src/api/project/terminalTrainSign.js

@@ -0,0 +1,15 @@
+import request from '@/utils/request'
+
+const terminalTrainSignApi = {
+    list: 'project/terminalTrain/list',
+    
+}
+
+export function terminalTrainSignList(params) {
+    console.log("terminalTrainList------------{}", params)
+    return request({
+        url: terminalTrainSignApi.list,
+        method: 'get',
+        params: params
+    })
+}

src/views/project/terminalTrain/TerminalTrainDetail.vue

@@ -16,8 +16,8 @@
     </a-descriptions>
     <br />
     <div style="width: 100%; height: 32px; margin-bottom: 8px">
-      <a-button type="primary">修 改 信 息</a-button>
+      <a-button  v-if="hasPerm('terminal:train:edit')" type="primary" @click="editInfo()">修 改 信 息</a-button>
-      <a-button type="primary">会议签到信息</a-button>
+      <a-button v-if="hasPerm('terminal:train:list')" type="primary" @click="signInfo()">会议签到信息</a-button>
     </div>
   </a-card>
 </template>
@@ -54,6 +54,23 @@ export default {
         },
       })
     },
+    editInfo(){ //修改信息按钮
+      this.$router.push({
+        path: '/project/terminalTrain/form',
+        query: {
+          id: this.detailData.id,
+        }
+      })
+    },
+
+    signInfo(){ //跳转签到信息页面
+      this.$router.push({
+        path: '/project/terminalTrain/signList',
+        query: {
+          id: this.detailData.id,
+        }
+      })
+    }
   },
 }
 </script>

src/views/project/terminalTrain/TerminalTrainForm.vue

@@ -1,6 +1,6 @@
 <template>
   <a-card :bordered="false" :title="titleName">
-    <a-form-model @submit="handleSubmit" :model="form">
+    <a-form-model @submit="handleSubmit" :model="form" :layout="layout" :labelCol="{span: 2}" :wrapperCol="{span: 10}">
       <a-form-model-item label="培训名称">
         <a-input v-model="form.trainName" />
       </a-form-model-item>
@@ -31,8 +31,10 @@
       <a-form-model-item label="备注">
         <a-input v-model="form.remark" type="textarea" />
       </a-form-model-item>
-      <a-button htmlType="submit" type="primary" > 保存 </a-button>
+      <a-form-model-item>
+        <a-button htmlType="submit" type="primary"  @click="() => { this.form.status = 1}" style="border-left: 200px;"> 保存 </a-button>
         <a-button htmlType="submit" type="primary"  @click="() => { this.form.status = 2}"> 保存并发布 </a-button>
+      </a-form-model-item>
     </a-form-model>
   </a-card>
 </template>
@@ -66,7 +68,8 @@ export default {
         remark: '',
         status: 1,
       },
-      titleName: '新增终端培训',
+      titleName: '终端培训表单',
+      layout: 'horizontal'
     }
   },
   //计算属性 类似于data概念

src/views/project/terminalTrain/TerminalTrainList.vue

@@ -78,40 +78,20 @@ export default {
         endDate: this.$route.query.terminalTrainEndDate || null,
       },
       columns: [
-        {
+        { title: '序号', width: 'auto', align: 'center', dataIndex: 'id', key: 'id', scopedSlots: { customRender: 'serial' }, },
-          title: '序号',
-          width: 'auto',
-          align: 'center',
-          dataIndex: 'id',
-          key: 'id',
-          scopedSlots: { customRender: 'serial' },
-        },
         { title: '项目名称', width: 'auto', align: 'center', dataIndex: 'projectName', key: 'projectName' },
-        {
+        { title: '时间', dataIndex: 'date', key: 'date',
-          title: '时间',
-          dataIndex: 'date',
-          key: 'date',
           customRender: (text, record, index) => {
             return record.startDate + ' - ' + record.endDate
           },
         },
-        {
+        { title: '人数', width: 'auto', align: 'center', dataIndex: 'num', key: 'num',
-          title: '人数',
-          width: 'auto',
-          align: 'center',
-          dataIndex: 'num',
-          key: 'num',
           customRender: (text, record, index) => {
             return record.signNum + ' / ' + record.personNum
           },
         },
         { title: '培训类型', width: 'auto', align: 'center', dataIndex: 'projectType', key: 'projectType' },
-        {
+        { title: '项目状态', width: 'auto', align: 'center', dataIndex: 'status', key: 'status',
-          title: '项目状态',
-          width: 'auto',
-          align: 'center',
-          dataIndex: 'status',
-          key: 'status',
           customRender: (text, record, index) => {
             if (text == '1') return '未发布'
             else if (text == '2') return '未开始'

src/views/project/terminalTrain/TerminalTrainSignList.vue

@@ -0,0 +1,163 @@
+<template>
+  <a-card :bordered="false" title="会议签到">
+    <template slot="extra">
+      <a-button size="small" @click="close">返回</a-button>
+    </template>
+    <a-tabs :animated="false" :default-active-key="1" @change="changeTab" :headStyle="{ paddingTop: '300px' }">
+      <a-tab-pane key="1" :tab="list1.title">
+        <a-list item-layout="horizontal" :data-source="list1.data">
+          <a-list-item slot="renderItem" slot-scope="item">
+            <a-list-item-meta :description="headerListData(item)">
+              <p slot="title">{{ item.name }}</p>
+              <a-avatar slot="avatar" src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" />
+            </a-list-item-meta>
+            <div class="list-content">
+              <div class="list-content-item">
+                <span>签到状态</span>
+                <p v-if="item.signStatus == 1" :style="{ color: 'turquoise' }">正常</p>
+                <p v-if="item.signStatus == 2" :style="{ color: 'red' }">迟到</p>
+              </div>
+              <div class="list-content-item">
+                <span>签到时间</span>
+                <p>{{ item.signTime }}</p>
+              </div>
+            </div>
+          </a-list-item>
+        </a-list>
+      </a-tab-pane>
+      <a-tab-pane key="2" :tab="list2.title" force-render>
+        <a-list item-layout="horizontal" :data-source="list2.data">
+          <a-list-item slot="renderItem" slot-scope="item">
+            <a-list-item-meta :description="headerListData(item)">
+              <p slot="title">{{ item.name }}</p>
+              <a-avatar slot="avatar" src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" />
+            </a-list-item-meta>
+          </a-list-item>
+        </a-list>
+      </a-tab-pane>
+    </a-tabs>
+  </a-card>
+</template>
+
+<script>
+// 这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
+// 例如：import 《组件名称》 from '《组件路径》'
+import { terminalTrainSignList } from '@/api/project/terminalTrainSign'
+
+export default {
+  // import引入的组件需要注入到对象中才能使用
+  components: {
+    terminalTrainSignList,
+  },
+  props: {},
+  data() {
+    // 这里存放数据
+    return {
+      list1: {
+        title: '',
+        params: {
+          id: this.$route.query.id || '',
+          type: 1,
+        },
+        data: [],
+      },
+      list2: {
+        title: '',
+        params: {
+          id: this.$route.query.id || '',
+          type: 2,
+        },
+        data: [],
+      },
+    }
+  },
+  // 计算属性 类似于data概念
+  computed: {},
+  // 监控data中的数据变化
+  watch: {},
+  // 方法集合
+  methods: {
+    changeTab(key) {
+      if (key === '1') {
+        this.queryList(this.list1.params)
+      } else {
+        this.queryList(this.list2.params)
+      }
+    },
+    // 返回 按钮
+    close() {
+      this.$router.push({
+        path: '/project/terminalTrain/detail',
+        query: {
+          terminalTrainId: this.list1.params.id,
+        },
+      })
+    },
+
+    //返回数据拼接
+    headerListData(item) {
+      return item.department + '-' + item.position
+    },
+
+    //异步查询数据
+    queryList(params) {
+      terminalTrainSignList(params).then((res) => {
+        console.log(res)
+        if (params.type === 1) {
+          this.list1.data = res.data
+          this.list1.title = '已签到人员 (' + res.signNum + ')'
+          this.list2.title = '未签到人员 (' + res.enrollNum + ')'
+        } else {
+          this.list2.data = res.data
+          this.list1.title = '已签到人员 (' + res.signNum + ')'
+          this.list2.title = '未签到人员 (' + res.enrollNum + ')'
+        }
+      })
+    },
+  },
+  // 生命周期 - 创建完成（可以访问当前this实例）
+  created() {
+    this.changeTab('1')
+  },
+  // 生命周期 - 挂载完成（可以访问DOM元素）
+  mounted() {},
+  // 生命周期 - 创建之前
+  beforeCreate() {},
+  // 生命周期 - 挂载之前
+  beforeMount() {},
+  // 生命周期 - 更新之前
+  beforeUpdate() {},
+  // 生命周期 - 更新之后
+  updated() {},
+  // 生命周期 - 销毁之前
+  beforeDestroy() {},
+  // 生命周期 - 销毁完成
+  destroyed() {},
+  // 如果页面有keep-alive缓存功能，这个函数会触发
+  activated() {},
+}
+</script>
+<style lang="less" scoped>
+.ant-avatar-lg {
+  width: 48px;
+  height: 48px;
+  line-height: 48px;
+}
+
+.list-content-item {
+  color: rgba(0, 0, 0, 0.45);
+  display: inline-block;
+  vertical-align: middle;
+  font-size: 14px;
+  margin-left: 300px;
+  span {
+    line-height: 20px;
+  }
+  p {
+    margin-top: 4px;
+    margin-bottom: 0;
+    line-height: 22px;
+
+  }
+}
+</style>