From 20283a23d9ce49a89066fe7e8cee4350d81e6292 Mon Sep 17 00:00:00 2001
From: weipengfei <2187978347@qq.com>
Date: Fri, 22 Sep 2023 16:42:59 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E7=9D=A3=E4=BF=83=E5=B0=8F?=
 =?UTF-8?q?=E7=BB=84=E6=9C=8D=E5=8A=A1=E5=9B=A2=E9=98=9F=E5=AD=A6=E4=B9=A0?=
 =?UTF-8?q?=E4=BB=BB=E5=8A=A1=E8=AF=A6=E6=83=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages.json                          |   8 +
 subpkg/serviceTask/serviceTask4.vue | 239 ++++++++++++++++++++++++++++
 2 files changed, 247 insertions(+)
 create mode 100644 subpkg/serviceTask/serviceTask4.vue

diff --git a/pages.json b/pages.json
index affb009..4ea0caa 100644
--- a/pages.json
+++ b/pages.json
@@ -671,6 +671,14 @@
         "navigationBarTextStyle": "white"
       }
 
+    }, {
+      "path": "serviceTask/serviceTask4",
+      "style": {
+        "navigationBarTitleText": "督促团队学习",
+        "enablePullDownRefresh": false,
+        "navigationBarBackgroundColor": "#0122C7",
+        "navigationBarTextStyle": "white"
+      }
     }]
   }],
   "globalStyle": {
diff --git a/subpkg/serviceTask/serviceTask4.vue b/subpkg/serviceTask/serviceTask4.vue
new file mode 100644
index 0000000..2b3a7eb
--- /dev/null
+++ b/subpkg/serviceTask/serviceTask4.vue
@@ -0,0 +1,239 @@
+<template>
+  <view class="task_page">
+    <view class="card">
+      <view class="c_title">{{`任务名称: ${taskInfo.title||''}`}}</view>
+      <view>{{taskInfo.content||''}}</view>
+    </view>
+    <view class="card">
+      <view class="c_title">{{`学习照片 ( ${study_photo.length}/5 ) 张`}}</view>
+      <view class="file">
+        <view class="file_item" v-for="(item, index) in study_photo" :key="'file'+index">
+          <image class="image" :src="item" @click="priview(index)"></image>
+          <image v-if="!other.is_commit" class="del" src="/static/icons/delete.png" @click.stop="deleteFile(index)">
+          </image>
+        </view>
+        <view v-if="!other.is_commit" class="file_btn" @click="chooseFile">
+          <image src="/static/icons/plus.png"></image>
+        </view>
+        <view class="file_empty" v-for="k in placeholderLength" :key="'empty'+k"></view>
+      </view>
+    </view>
+    <view class="card">
+      <view class="c_title">{{`签到表照片 ( ${sign_in_table?1:0}/1 ) 张`}}</view>
+      <view class="file">
+        <view v-if="sign_in_table" class="file_item">
+          <image class="image" :src="sign_in_table" @click="priviewOne(index)"></image>
+          <image v-if="!other.is_commit" class="del" src="/static/icons/delete.png"
+            @click.stop="deleteFile(index, 'sign_in_table')">
+          </image>
+        </view>
+        <view v-else class="file_btn" @click="chooseOneFile">
+          <image src="/static/icons/plus.png"></image>
+        </view>
+        <view class="file_empty" v-for="k in 2" :key="'empty'+k"></view>
+      </view>
+    </view>
+    <view class="card" style="margin-bottom: 160rpx;">
+      <view class="c_title">培训内容大纲 (50字以上)</view>
+      <u--textarea :disabled="other.is_commit==1" v-model="study_content" placeholder="请输入内容"
+        placeholderStyle="font-size: 22rpx;" style="font-size: 28rpx;background-color: #eee;min-height: 100px;"
+        autoHeight maxlength="-1"></u--textarea>
+    </view>
+    <mybtn v-if="!other.is_commit" text="确认提交" @click="$u.throttle(submit, 1500)"></mybtn>
+    <mybtn v-else-if="task_info.status==3" text="已完成" :my_btn_disabled="true" @click="showToast('任务已完成')"></mybtn>
+    <mybtn v-else-if="task_info.status==5" text="已关闭" :my_btn_disabled="true" @click="showToast('任务已关闭!')"></mybtn>
+    <!-- <mybtn v-else-if="approve_status==3" text="已驳回,请重新提交" @click="toUpdate"></mybtn> -->
+    <mybtn v-else text="已提交,请等待审核" :my_btn_disabled="true" @click="showToast('请耐心等待审核结果')"></mybtn>
+  </view>
+</template>
+
+<script>
+  import {
+    upLoadImage,
+  } from "@/api/file.js"
+  import { Toast } from "../../libs/uniApi";
+  export default {
+    data() {
+      return {
+        other: {
+          annex: [], // 图片列表
+          is_commit: 0, // 是否提交
+          note: "", // 详情描述
+          video_annex: [] // 视频列表
+        },
+        taskInfo:{},
+        study_photo: [],
+        sign_in_table: '',
+        study_content: ''
+      }
+    },
+    onLoad() {},
+    onShow() {},
+    computed: {
+      // 占位长度
+      placeholderLength() {
+        if (this.other.is_commit == 1) return this.study_photo.length % 3 == 0 ? 0 : 3 - this.study_photo.length % 3;
+        return (this.study_photo.length + 1) % 3 == 0 ? 0 : 3 - (this.study_photo.length + 1) % 3;
+      },
+    },
+    methods: {
+      // 提交
+      async submit() {
+        if(this.study_photo.length<5)return Toast('学习照片不能低于5张');
+        if(!this.sign_in_table)return Toast('签到表照片不能为空');
+        if(this.study_content.trim().length <50) return Toast('培训内容不得低于50字');
+        await taskOtherTaskCommit({
+          id: this.task_id,
+          note: this.note,
+          annex: this.fileList,
+          video_annex: this.videoList
+        });
+        this.other.is_commit = 1;
+        Toast('提交成功');
+      },
+      showToast(str) {
+        Toast(str)
+      },
+      chooseFile() {
+        uni.chooseImage({
+          count: 5,
+          sizeType: ['compressed'],
+          success: async (res) => {
+            for (let item of res.tempFiles) {
+              let ul = await upLoadImage({
+                filePath: item.path,
+                name: 'file'
+              });
+              this.study_photo.push(ul.data.uri);
+            }
+          }
+        });
+      },
+      priview(index) {
+        uni.previewImage({
+          urls: this.study_photo,
+          current: index,
+          longPressActions: {
+            itemList: ['删除'],
+            itemColor: '#ff0000',
+            success(e) {
+              if (e.tapIndex == 0) this.deleteFile(e.index);
+            }
+          },
+        })
+      },
+      chooseOneFile() {
+        uni.chooseImage({
+          count: 1,
+          sizeType: ['compressed'],
+          success: async (res) => {
+            let ul = await upLoadImage({
+              filePath: res.tempFilePaths[0],
+              name: 'file'
+            });
+            this.sign_in_table = ul.data.uri;
+          }
+        });
+      },
+      priviewOne(index) {
+        uni.previewImage({
+          urls: [this.sign_in_table],
+          current: index,
+          longPressActions: {
+            itemList: ['删除'],
+            itemColor: '#ff0000',
+            success(e) {
+              if (e.tapIndex == 0) this.sign_in_table = '';
+            }
+          },
+        })
+      },
+      // 删除已上传文件
+      deleteFile(index, type = 'image') {
+        if (type == 'image') this.study_photo.splice(index, 1);
+        else if (type == 'sign_in_table') this.sign_in_table = '';
+      },
+    },
+  }
+</script>
+
+<style lang="scss">
+  .task_page {
+    padding-top: 30rpx;
+
+    .card {
+      margin: 0 auto;
+      margin-bottom: 28rpx;
+      width: 694rpx;
+      background-color: #fff;
+      border-radius: 26rpx;
+      padding: 28rpx;
+
+      .c_title {
+        font-size: 32rpx;
+        font-weight: bold;
+        color: #333333;
+        margin-bottom: 20rpx;
+      }
+
+      .file {
+        display: flex;
+        justify-content: left;
+        flex-wrap: wrap;
+
+        &_item {
+          flex-shrink: 0;
+          width: 200rpx;
+          height: 200rpx;
+          margin: 0 auto;
+          margin-bottom: 16rpx;
+          border: 2px solid #ccc;
+          border-radius: 10rpx;
+          overflow: hidden;
+          position: relative;
+
+          .image {
+            width: 100%;
+            height: 100%;
+          }
+
+          .del {
+            position: absolute;
+            height: 40rpx;
+            width: 40rpx;
+            top: 10rpx;
+            right: 10rpx;
+          }
+        }
+
+        &_btn {
+          flex-shrink: 0;
+          width: 200rpx;
+          height: 200rpx;
+          margin: 0 auto;
+          margin-bottom: 16rpx;
+          border: 2px solid #ccc;
+          display: flex;
+          justify-content: center;
+          align-items: center;
+          flex-direction: column;
+          border-radius: 10rpx;
+
+          image {
+            width: 100rpx;
+            height: 100rpx;
+          }
+        }
+
+        &_empty {
+          flex-shrink: 0;
+          width: 200rpx;
+          height: 200rpx;
+          margin: 0 auto;
+          margin-bottom: 16rpx;
+          border: 2px solid transparent;
+        }
+      }
+    }
+  }
+</style>
\ No newline at end of file