<template>
  <view>
    <cu-custom bgColor="bg-gradual-blueness" :isBack="true">
      <block slot="backText">返回</block>
      <block slot="content">气体检测</block>
    </cu-custom>
    <scroll-view scroll-y="false">
      <view class="form">
        <view class="wui-form-list">

          <view class="cu-form-group ">
            <view class="title">分析时间</view>
            <ruiDatePicker fields="minute"
                           :value="pd.ANALYZE_TIME?pd.ANALYZE_TIME:''"
                           :end="currentTime"
                           @change="changeStartDate"
            ></ruiDatePicker>
          </view>

          <view class="cu-form-group">
            <view class="title">分析点：</view>
            <input name="input" ref="ANALYZE_PLACE" v-model="pd.ANALYZE_PLACE" placeholder="请输入分析点"></input>
          </view>

          <view class="cu-form-group">
            <view class="title">可燃气体检测结果：</view>
            <input name="input" ref="ANALYZE_RESULT" v-model="pd.ANALYZE_RESULT"
                   placeholder="请输入可燃气体检测结果"></input>
          </view>

          <view class="cu-form-group">
            <view>
              <text class="title">分析人：</text>
              <text>{{ pd.ANALYZE_USER }}</text>
            </view>
          </view>
          <view>
            <view class="wui-sign">
              <view class="title"></view>
              <button class="cu-btn bg-green shadow" @tap="showModal" data-target="Modal">新增手写签字</button>
            </view>
            <view class="wui-sign-box wui-sign-box1" v-show="imgList && imgList.length > 0">
              <view class="sign-title">
                签字照片：
              </view>
              <view class="wui-sign-cotent">
                <view class="sign-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" data-type="0"
                      :data-url="imgList[index].filePath">
                  <image :src="imgList[index].filePath" mode="aspectFit"></image>
                  <view class="cu-tag bg-red" @tap.stop="DelImg(index)">
                    <text class='cuIcon-close'></text>
                  </view>
                </view>
              </view>
            </view>
            <view class="cu-modal" :class="modalName=='Modal'?'show':''">
              <writing-board :signShow="modalName =='Modal'" @confirm="subCanvas" @cancel="hideModal"/>
            </view>
          </view>
        </view>
      </view>
      <view class="cu-bar btn-group" style="margin-top: 30upx;">
        <button class="cu-btn bg-red margin-tb-sm lg" @click="$noMultipleClicks(goSubmit(-1))">作废</button>
        <button class="cu-btn bg-green margin-tb-sm lg" @click="$noMultipleClicks(goSubmit(1))">保存</button>
      </view>
      <view class="padding flex flex-direction">
      </view>
    </scroll-view>
  </view>
</template>

<script>
import {
  basePath, corpinfoId, deptId, loginUser, formatDate, loginSession, baseImgPath
} from '@/common/tool.js';
import tkiTree from "@/components/select-tree/select-tree.vue"
import writingBoard from "@/components/horizontal-writing-board/writing-board.vue"
import gcoord from '@/common/gcoord.js'
import ruiDatePicker from '@/components/rattenking-dtpicker/rattenking-dtpicker.vue';

export default {
  components: {
    tkiTree, ruiDatePicker, writingBoard
  },
  data() {
    return {
      imgList: [],
      modalName: null,
      noClick: true,
      buttonloading: false,
      pd: {},// 数据
      rules: [
        {name: 'ANALYZE_TIME', message: '请输入分析时间'},
        {name: 'ANALYZE_PLACE', message: '请输入分析点'},
        {name: 'ANALYZE_RESULT', message: '请输入分析结果'},
      ],
      currentTime: formatDate(new Date(), 'yyyy-MM-dd hh:mm')
    }
  },
  onLoad(event) {
    this.pd.ELECTRICITY_ID = event.ELECTRICITY_ID;
    this.pd.ANALYZE_USER = loginUser.NAME;
    loginSession();
  },
  methods: {
    uploadImgFaults(files, signtime) {
      this.imgList.map((item, index) => {
        var img = {}
        img.name = 'file' + index
        img.uri = item.filePath
        files.push(img)
        signtime.push(item.SIGNER_TIME)
      })
    },
    showModal(e) {
      this.modalName = e.currentTarget.dataset.target
    },
    hideModal(e) {
      this.modalName = null
    },
    DelImg(index) {
      this.imgList.splice(index, 1)
    },
    //完成
    subCanvas(e) {
      let t = {
        id: "",
        filePath: e.tempFile,
        SIGNER_TIME: formatDate(new Date(), 'yyyy-MM-dd hh:mm')
      }
      this.imgList.push(t);
      this.hideModal()
    },
    ViewImage(e) {
      let files = [];
      files.push(e.currentTarget.dataset.url)
      uni.previewImage({
        urls: files,
        current: e.currentTarget.dataset.url
      });
    },
    goSubmit(APPLY_STATUS) {
      var _this = this;
      let required = true
      if (_this.imgList.length <= 0) {
        uni.showToast({
          icon: 'none',
          title: '请签字',
          duration: 1500
        });
        return;
      }
      if (APPLY_STATUS == 1) {
        this.rules.map(({name, message}) => {
          if (!this.pd[name]) {
            uni.showToast({
              icon: 'none',
              title: message,
              duration: 1500
            });
            required = false
          }
        })
        if (!required) {
          return
        }
      }
      uni.showModal({
        title: '请确认' + (APPLY_STATUS == 1 ? "通过" : "作废") + '本作业票？',
        placeholderText: '请输入作废原因',
        cancelColor: "#000000",
        cancelText: '取消',
        editable: APPLY_STATUS != 1,
        confirmText: '确定',
        success: res => {
          if (res.confirm) {
            if (APPLY_STATUS != 1 && !res.content) {
              uni.showToast({
                icon: 'none',
                title: '请填写作废原因',
                duration: 1500
              });
              return;
            }
            this.buttonloading = true

            uni.showLoading({
              title: '请稍候'
            })
            var files = [];
            var signtime = [];
            const formData = {}
            Object.keys(this.pd).map(key => {
              formData[key] = this.pd[key]
            })
            this.uploadImgFaults(files, signtime)
            formData.SIGNTIME = signtime
            formData.STEP_REASON = res.content ? res.content : ''
            formData.CORPINFO_ID = loginUser.CORPINFO_ID
            formData.USER_ID = loginUser.USER_ID
            formData.APPLY_STATUS = APPLY_STATUS
            uni.uploadFile({
              url: basePath + "app/electricity/gas/save",
              files: files,
              formData: formData,
              success: (res) => {
                uni.showToast({
                  icon: 'none',
                  title: '保存成功',
                  duration: 2000
                });
                this.buttonloading = false
                if (APPLY_STATUS === 1) {
                  uni.navigateBack({delta: 1});
                } else {
                  uni.navigateBack({delta: 3});
                }
                // _this.goback()
              },
              fail: (err) => {
                uni.hideLoading();
                uni.showModal({
                  content: err.errMsg,
                  showCancel: false
                });
              }
            })
          }
        }
      })
    },

    changeStartDate(e) {
      this.pd.ANALYZE_TIME = e
      this.$forceUpdate();//强制刷新
    },

    goback() {
      var pages = getCurrentPages();	// 获取当前页面栈
      var prePage = pages[pages.length - 2];	// 上二级页面
      prePage.$vm.initflag = true;    // A 页面 init方法 为true
      uni.navigateBack({delta: 1});
      uni.hideLoading();
    },
  }
}
</script>

<style>
.wui-sign-box1 {
  margin-top: 20upx;
  display: block;
}

.sign-img {
  position: relative;
  border-bottom: 1px dashed #eee;
  padding-top: 20upx;
}

.cu-tag {
  position: absolute;
  right: 20upx;
  top: 20upx;
}
</style>
