|
|
@@ -0,0 +1,388 @@
|
|
|
+<template>
|
|
|
+ <view class="task-details">
|
|
|
+ <view class="task-details__header">
|
|
|
+ <task-card type="show" :dataSource="taskDetail"></task-card>
|
|
|
+ </view>
|
|
|
+ <view class="panel">
|
|
|
+ <view class="panel__header">
|
|
|
+ <view class="panel__title">任务汇报</view>
|
|
|
+ </view>
|
|
|
+ <view class="panel__content">
|
|
|
+ <view class="task-details__area">
|
|
|
+ <view class="task-details__edit-icon" v-if="!isMessageEdit" @click="isMessageEdit=!isMessageEdit">
|
|
|
+ <uni-icons type="compose" color="#1B76FF"></uni-icons>
|
|
|
+ </view>
|
|
|
+ <u--textarea :focus="true" v-else v-model="report_msg" placeholder="" :maxlength="200" autoHeight
|
|
|
+ border="none">
|
|
|
+ </u--textarea>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="task-details__body" v-if="task_type">
|
|
|
+ <!-- <u-sticky>
|
|
|
+ <task-tabs @tabClick="handleTabClick" :tabList="tabList"></task-tabs>
|
|
|
+ </u-sticky> -->
|
|
|
+ <view class="task-details__content">
|
|
|
+ <!-- <transition name="slide-fade" mode="out-in" appear>
|
|
|
+ <component :is="currentComponent" :dataSource="taskDetail" :isEdit="isEdit"></component>
|
|
|
+ </transition> -->
|
|
|
+ <EntrapmentComponent :dataSource="taskDetail" :isEdit="true" :isShowHeader="true"></EntrapmentComponent>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="task-details__footer">
|
|
|
+ <u-button text="提交" type="primary" size="small" @click="taskfillingcom"></u-button>
|
|
|
+ </view>
|
|
|
+ <u-loading-page loading-text="加载中..." :loading="loading" font-size="16"></u-loading-page>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import {
|
|
|
+ mapState
|
|
|
+ } from 'vuex';
|
|
|
+ import ClockInRecordComponent from './components/ClockInRecord.vue';
|
|
|
+ import EntrapmentComponent from './components/Entrapment.vue';
|
|
|
+ import GisComponent from './components/Gis.vue';
|
|
|
+ import * as taskService from '@/service/task.js';
|
|
|
+ import HeartBeat from '@/util/HeartBeat.js'
|
|
|
+
|
|
|
+ export default {
|
|
|
+ components: {
|
|
|
+ ClockInRecordComponent,
|
|
|
+ EntrapmentComponent,
|
|
|
+ GisComponent
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapState({
|
|
|
+ wornlist: state => state.wornlist
|
|
|
+ }),
|
|
|
+ tabList() {
|
|
|
+ if (this.task_type) {
|
|
|
+ return [{
|
|
|
+ id: 1,
|
|
|
+ name: '签到记录',
|
|
|
+ }, {
|
|
|
+ id: 2,
|
|
|
+ name: '诱捕器',
|
|
|
+ }, {
|
|
|
+ id: 3,
|
|
|
+ name: '行驶轨迹'
|
|
|
+ }]
|
|
|
+ } else {
|
|
|
+ return [{
|
|
|
+ id: 1,
|
|
|
+ name: '签到记录',
|
|
|
+ }, {
|
|
|
+ id: 3,
|
|
|
+ name: '行驶轨迹'
|
|
|
+ }]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ currentComponent: ClockInRecordComponent,
|
|
|
+ taskID: '',
|
|
|
+ loading: false,
|
|
|
+ taskDetail: {},
|
|
|
+ draft: [],
|
|
|
+ taskinfo: {},
|
|
|
+ report_msg: '',
|
|
|
+ task_type: false,
|
|
|
+ isEdit: false,
|
|
|
+ isMessageEdit: false,
|
|
|
+ istask: 1 // 任务模块
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+ this.report_msg = ''
|
|
|
+ },
|
|
|
+ onLoad(options) {
|
|
|
+ console.warn(options, '------------- on load --------------')
|
|
|
+ this.taskID = options.taskID;
|
|
|
+ this.getTaskDetail()
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ wornlist(news, old) {
|
|
|
+ // console.log(this.taskinfo.trap_record_list)
|
|
|
+ console.warn(news, ' task edit watch')
|
|
|
+ this.draft = []
|
|
|
+ this.draft.push(news)
|
|
|
+ for (var i = 0; i < this.taskinfo.trap_record_list.length; i++) {
|
|
|
+ for (var j = 0; j < news; j++) {
|
|
|
+ if (this.taskinfo.trap_record_list[i].id == news.record_id) {
|
|
|
+ this.taskinfo.trap_record_list[i].report_status = news.report_status
|
|
|
+ } else {
|
|
|
+ this.taskinfo.trap_record_list[i].report_status = ""
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.taskfillingdraft()
|
|
|
+ },
|
|
|
+ // kpsurlL(news, old) {
|
|
|
+ // if (this.istask == 1) {
|
|
|
+ // if (news != "") {
|
|
|
+ // let pages = getCurrentPages();
|
|
|
+ // var page = pages[pages.length - 1];
|
|
|
+ // var currentWebview = page.$getAppWebview();
|
|
|
+ // currentWebview.setTitleNViewButtonStyle(0, {
|
|
|
+ // text: " ",
|
|
|
+ // });
|
|
|
+ // this.$store.state.kpsurlL = 1
|
|
|
+ // } else {
|
|
|
+ // let pages = getCurrentPages();
|
|
|
+ // var page = pages[pages.length - 1];
|
|
|
+ // var currentWebview = page.$getAppWebview();
|
|
|
+ // currentWebview.setTitleNViewButtonStyle(0, {
|
|
|
+ // text: "提交",
|
|
|
+ // });
|
|
|
+ // this.$store.state.kpsurlL = 0
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+
|
|
|
+ // }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ getTaskDetail() {
|
|
|
+ console.warn('get task detail start')
|
|
|
+ if (!this.taskID) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ console.warn('get task detail fetch')
|
|
|
+ this.loading = true;
|
|
|
+ taskService.getTaskDetailByTaskID(this.taskID).then(res => {
|
|
|
+ console.warn(res, 'get task detail')
|
|
|
+ this.taskDetail = this.taskinfo = res;
|
|
|
+ this.isEdit = res.task_status === '处理中';
|
|
|
+ this.task_id = res.task_id;
|
|
|
+
|
|
|
+ console.log(this.taskinfo, '------------------------------- task info', this.taskDetail)
|
|
|
+ // if (this.taskinfo.img_list == "" || this.taskinfo.img_list.length == 0) {
|
|
|
+ // this.taskinfo.img_list = []
|
|
|
+ // } else {
|
|
|
+ // this.taskinfo.img_list = JSON.parse(this.taskinfo.img_list)
|
|
|
+ // }
|
|
|
+ console.warn(this.taskinfo.task_type, 'get task detail --1213144')
|
|
|
+ if (res.task_type == "有害生物监测") {
|
|
|
+ this.task_type = true
|
|
|
+ } else {
|
|
|
+ this.task_type = false
|
|
|
+ }
|
|
|
+
|
|
|
+ this.$store.state.worndatabase = JSON.parse(JSON.stringify(this.taskinfo.trap_record_list))
|
|
|
+ }).finally(() => {
|
|
|
+ this.loading = false;
|
|
|
+ })
|
|
|
+ },
|
|
|
+ handleTabClick(id) {
|
|
|
+ switch (id) {
|
|
|
+ case 1:
|
|
|
+ this.currentComponent = ClockInRecordComponent;
|
|
|
+ break;
|
|
|
+ case 2:
|
|
|
+ this.currentComponent = EntrapmentComponent;
|
|
|
+ break;
|
|
|
+ case 3:
|
|
|
+ this.currentComponent = GisComponent;
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async taskfillingdraft() { //任务填报接口
|
|
|
+ // this.gettaskinfo()
|
|
|
+
|
|
|
+ var arr = JSON.parse(JSON.stringify(this.$store.state.worndatabase))
|
|
|
+ console.warn(this.draft, 'draft')
|
|
|
+ console.log(arr, 'arr draft')
|
|
|
+ for (var i = 0; i < arr.length; i++) {
|
|
|
+ for (var j = 0; j < this.draft.length; j++) {
|
|
|
+ if (arr[i].id == this.draft[j].record_id || arr[i].record_id == this.draft[j].record_id) {
|
|
|
+ arr.splice(i, 1)
|
|
|
+ i--;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ for (var i = 0; i < this.taskinfo.trap_record_list.length; i++) {
|
|
|
+ for (var j = 0; j < this.draft.length; j++) {
|
|
|
+ if (this.taskinfo.trap_record_list[i].id == this.draft[j].record_id) {
|
|
|
+ // console.log(this.taskinfo.trap_record_list[i])
|
|
|
+ this.taskinfo.trap_record_list[i].report_status = this.draft[j].report_status
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.draft = this.draft.concat(arr)
|
|
|
+
|
|
|
+ this.$store.state.worndatabase = JSON.parse(JSON.stringify(this.draft))
|
|
|
+ // console.log(arr)
|
|
|
+ for (var i = 0; i < this.draft.length; i++) {
|
|
|
+ if (this.draft[i].id) {
|
|
|
+ this.draft[i]["record_id"] = this.draft[i].id
|
|
|
+ }
|
|
|
+ }
|
|
|
+ console.warn(this.draft, "0000 草稿提交")
|
|
|
+ var data = {}
|
|
|
+ if (this.task_type) {
|
|
|
+ data = {
|
|
|
+ task_id: this.task_id, // 是 任务id
|
|
|
+ // report_msg: this.textareavalue, // 是 任务汇报内容
|
|
|
+ // img_list: JSON.stringify(this.urllist), // 是 图片列表 ['http://www.c.com']
|
|
|
+ trap_record_list: JSON.stringify(this.draft),
|
|
|
+ }
|
|
|
+ console.log("有数据", data)
|
|
|
+ } else {
|
|
|
+ data = {
|
|
|
+ task_id: this.task_id, // 是 任务id
|
|
|
+ report_msg: this.textareavalue, // 是 任务汇报内容
|
|
|
+ img_list: JSON.stringify(this.urllist), // 是 图片列表 ['http://www.c.com']
|
|
|
+ }
|
|
|
+ console.log("无数据", data)
|
|
|
+ }
|
|
|
+ console.log(data, 555)
|
|
|
+ const res = await this.$myRequest({
|
|
|
+ url: '/api/api_gateway?method=app.task.task_filling_draft',
|
|
|
+ data: data,
|
|
|
+ })
|
|
|
+ // console.log(res)
|
|
|
+ },
|
|
|
+ taskfillingcom() {
|
|
|
+ console.log(this.taskinfo.trap_record_list)
|
|
|
+ var tf = this.taskinfo.trap_record_list.every((item) => {
|
|
|
+ console.log(item.report_status)
|
|
|
+ return item.report_status != ""
|
|
|
+ })
|
|
|
+ if (!this.report_msg) {
|
|
|
+ uni.$u.toast('请填写任务汇报')
|
|
|
+ } else if (!tf) {
|
|
|
+ if (this.task_type) {
|
|
|
+ uni.$u.toast('请将所有设备全部登记后提交!')
|
|
|
+ } else {
|
|
|
+ // this.taskfillingdraft()+
|
|
|
+ this.taskfilling()
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ // this.taskfillingdraft()
|
|
|
+ this.taskfilling()
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ async taskfilling() { //任务填报接口
|
|
|
+ this.loading = true;
|
|
|
+ const res = await this.$myRequest({
|
|
|
+ url: '/api/api_gateway?method=app.task.task_filling',
|
|
|
+ data: {
|
|
|
+ // task_id:id,
|
|
|
+ task_id: this.task_id, // 是 任务id
|
|
|
+ report_msg: this.report_msg, // 是 任务汇报内容
|
|
|
+ // img_list: JSON.stringify(this.urllist), // 是 图片列表
|
|
|
+ }
|
|
|
+ })
|
|
|
+ console.log(res)
|
|
|
+ uni.$u.toast('提交成功')
|
|
|
+ HeartBeat.getInstance().clearByType('record_' + this.task_id);
|
|
|
+ setTimeout(() => {
|
|
|
+ this.loading = false;
|
|
|
+ uni.switchTab({
|
|
|
+ url: '/pages/index/index'
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .task-details {
|
|
|
+ padding: 24rpx 24rpx 100rpx;
|
|
|
+
|
|
|
+ &__header {
|
|
|
+ margin-bottom: 24rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ &__body {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ box-sizing: border-box;
|
|
|
+ // padding: 32rpx 0;
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ &__content {
|
|
|
+ flex: 1 1 auto;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ // padding: 10rpx 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ &__area {
|
|
|
+ font-size: 12px;
|
|
|
+ line-height: 18px;
|
|
|
+ color: #656565;
|
|
|
+ font-weight: 400;
|
|
|
+ }
|
|
|
+
|
|
|
+ &__edit-icon {
|
|
|
+ padding: 24rpx 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ &__footer {
|
|
|
+ position: fixed;
|
|
|
+ bottom: 0rpx;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ background-color: #fff;
|
|
|
+ padding: 40rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .panel {
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 16rpx;
|
|
|
+ padding: 16rpx;
|
|
|
+ margin-bottom: 24rpx;
|
|
|
+
|
|
|
+ &__header {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ }
|
|
|
+
|
|
|
+ &__title {
|
|
|
+ flex: 1 1 auto;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #333;
|
|
|
+ line-height: 40rpx;
|
|
|
+ margin-right: 100rpx;
|
|
|
+ padding-bottom: 10rpx;
|
|
|
+ @include hairline-bottom(rgba(151, 151, 151, 0.09));
|
|
|
+ }
|
|
|
+
|
|
|
+ &__content {
|
|
|
+ padding: 10rpx 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|
|
|
+<style>
|
|
|
+ page {
|
|
|
+ background-color: #F7F8FB;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 可以设置不同的进入和离开动画 */
|
|
|
+ /* 设置持续时间和动画函数 */
|
|
|
+ .slide-fade-enter-active {
|
|
|
+ transition: all .3s ease;
|
|
|
+ }
|
|
|
+
|
|
|
+ .slide-fade-leave-active {
|
|
|
+ transition: all .8s cubic-bezier(1.0, 0.5, 0.8, 1.0);
|
|
|
+ }
|
|
|
+
|
|
|
+ .slide-fade-enter,
|
|
|
+ .slide-fade-leave-to
|
|
|
+
|
|
|
+ /* .slide-fade-leave-active for below version 2.1.8 */
|
|
|
+ {
|
|
|
+ transform: translateX(10px);
|
|
|
+ opacity: 0;
|
|
|
+ }
|
|
|
+</style>
|