|
@@ -0,0 +1,127 @@
|
|
|
+<template>
|
|
|
+ <view class="check-map-list">
|
|
|
+ <view class="item"
|
|
|
+ v-for="(item, index) in depList"
|
|
|
+ :key="index">
|
|
|
+ <view class="title-wrap">
|
|
|
+ <text>{{item.deptName}}</text>
|
|
|
+ <view>
|
|
|
+ <image src="../../static/icon-map.png"></image>
|
|
|
+ <text>{{item.deptClassName}}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="content">
|
|
|
+ <text>{{item.decs}}</text>
|
|
|
+ <text>
|
|
|
+ 要点概览:{{item.checkPointNames}}
|
|
|
+ </text>
|
|
|
+ </view>
|
|
|
+ <view class="footer">
|
|
|
+ <text>查核人:{{item.empName}}</text>
|
|
|
+ <text>{{item.startDate}}~{{item.endDate}}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="null" v-if="depList.length === 0">暂无数据</view>
|
|
|
+ <view class="modal">
|
|
|
+ <view class="content-list">
|
|
|
+ <view class="list-item">
|
|
|
+ <text>第1次查核计划(2020-09-21 ~ 2020-09-22)</text>
|
|
|
+ <view class="item-icon">已完成</view>
|
|
|
+ </view>
|
|
|
+ <view class="list-item active">
|
|
|
+ <text>第1次查核计划(2020-09-21 ~ 2020-09-22)</text>
|
|
|
+ <view class="item-icon">进行中</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ depList: [
|
|
|
+ {
|
|
|
+ "checkId":30, //类型:Number 必有字段 备注:计划id
|
|
|
+ "deptId":1, //类型:Number 必有字段 备注:单位id
|
|
|
+ "deptName":"测试单位1", //类型:String 必有字段 备注:单位名称
|
|
|
+ "deptClassId":1, //类型:Number 必有字段 备注:单位分组id
|
|
|
+ "deptClassName":"单位分类1", //类型:String 必有字段 备注:单位分组名称
|
|
|
+ "checkPointNames":"要点1", //类型:String 必有字段 备注:要点名称拼接
|
|
|
+ "decs":"包含1个查核要点, 已完成0/2个查核项目", //类型:String 必有字段 备注:描述
|
|
|
+ "empId":6, //类型:Number 必有字段 备注:分配查核人id
|
|
|
+ "empName":"查核组员2", //类型:String 必有字段 备注:分配查核人名称
|
|
|
+ "startDate":"2021-02-20 08:00", //类型:String 必有字段 备注:分配开始时间
|
|
|
+ "endDate":"2021-02-21 05:00" //类型:String 必有字段 备注:分配结束时间
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created: function(){
|
|
|
+ this.dispatch('depList', {checkId: ''}).then((data)=>{
|
|
|
+ console.log(data);
|
|
|
+ if(data) {
|
|
|
+ // this.depList = data;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ dispatch: function(key, data) {
|
|
|
+ return this.$store.dispatch({type: 'checkList/commActions', key, data});
|
|
|
+ },
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less">
|
|
|
+ .check-map-list {
|
|
|
+ padding: 25rpx;
|
|
|
+ .footer {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ margin: 0 25rpx 16.87rpx;
|
|
|
+ border-top: 1px solid #DADEE6;
|
|
|
+ padding-top: 16.25rpx;
|
|
|
+ font-size: 17.5rpx;
|
|
|
+ line-height: 26.25rpx;
|
|
|
+ color: #666E80;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .null {
|
|
|
+ text-align: center;
|
|
|
+ color: #999;
|
|
|
+ }
|
|
|
+ .content-list {
|
|
|
+ width: 100%;
|
|
|
+ background-color: #fff;
|
|
|
+ .list-item {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ align-items: center;
|
|
|
+ border-bottom: 1px solid #DADEE6;
|
|
|
+ padding: 0 25rpx;
|
|
|
+ width: 100%;
|
|
|
+ height: 87.5rpx;
|
|
|
+ font-size: 22.5rpx;
|
|
|
+ line-height: 33.75rpx;
|
|
|
+ color: #292C33;
|
|
|
+ .item-icon {
|
|
|
+ border-radius: 5rpx;
|
|
|
+ padding: 6.25rpx 11.25rpx;
|
|
|
+ line-height: 26.25rpx;
|
|
|
+ color: #29CC96;
|
|
|
+ background-color: #e9f9f4;
|
|
|
+ }
|
|
|
+ &.active {
|
|
|
+ color: #3377FF;
|
|
|
+ .item-icon {
|
|
|
+ color: #FFAA00;
|
|
|
+ background-color: #fff9ef;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|