<template>
  <view class="content">
    <view class="card">
      <u-cell-group :border="false">
        <u-cell>
          <view slot="title" class="title">申辩人：</view>
          <view slot="label" class="mt-10">
            <u--image :showLoading="true" :src="$store.state.filePath + form.INSPECTED_SITEUSER_SIGN_IMG"
                      width="100%" height="80px" mode="scaleToFill"
                      @click="previewImage($store.state.filePath + form.INSPECTED_SITEUSER_SIGN_IMG)"></u--image>
          </view>
        </u-cell>
        <u-cell>
          <view slot="title" class="title">申辩时间：</view>
          <view slot="value">{{ form.INSPECTED_SITEUSER_SIGN_TIME }}</view>
        </u-cell>
        <u-cell>
          <view slot="title" class="title">申辩说明：</view>
          <view slot="value">{{ form.INSPECTED_EXPLAIN }}</view>
        </u-cell>
        <u-cell v-if="form.INSPECTED_EXPLAIN_FILENAME">
          <view slot="title" class="title">申辩附件：</view>
          <view slot="label" class="mt-10 flex-between">
            <text class="u-line-1">{{ form.INSPECTED_EXPLAIN_FILENAME }}</text>
            <view class="ml-10">
              <u-button type="primary" text="下载" size="mini" @click="downloadAppendix"></u-button>
            </view>
          </view>
        </u-cell>
        <u-cell>
          <view slot="title" class="title required">申辩是否成立：</view>
          <view slot="value">
            <u-radio-group v-model="form.INSPECTION_STATUS" placement="row">
              <u-radio label="是" name="-2"></u-radio>
              <u-radio label="否" name="3" class="ml-10"></u-radio>
            </u-radio-group>
          </view>
        </u-cell>
        <template v-if="form.INSPECTION_STATUS === '-2'">
          <u-cell>
            <view slot="title" class="title flex-between">
              确认人签字：
              <view>
                <u-button type="primary" text="手写添加" size="mini"
                          @click="signShow = true"></u-button>
                <sign v-if="signShow" :signShow.sync="signShow" @confirm="signConfirm"></sign>
              </view>
            </view>
            <view slot="label" class="mt-10">
            </view>
          </u-cell>
          <u-cell v-if="form.SIGN_IMG">
            <view slot="label" class="mt-10 flex-1" v-show="form.SIGN_IMG">
              <u--image v-show="form.SIGN_IMG" :showLoading="true" :src="form.SIGN_IMG"
                        width="100%" height="80px" mode="scaleToFill"
                        @click="previewImage(form.SIGN_IMG)"></u--image>

            </view>
          </u-cell>
        </template>
        <template v-if="form.INSPECTION_STATUS === '3'">
          <u-cell>
            <view slot="title" class="title required">不成立理由：</view>
            <view slot="label" class="mt-10">
              <u--textarea v-model="form.INSPECTED_EXPLAIN_REFUSE" placeholder="请输入不成立理由"></u--textarea>
            </view>
          </u-cell>
          <u-cell>
            <view slot="title" class="title flex-between">
              确认人签字：
              <view>
                <u-button type="primary" text="手写添加" size="mini"
                          @click="signShow = true"></u-button>
                <sign v-if="signShow" :signShow.sync="signShow" @confirm="signConfirm"></sign>
              </view>
            </view>
            <view slot="label" class="mt-10">
            </view>
          </u-cell>
          <view>
            <u--image v-show="form.SIGN_IMG" :showLoading="true" :src="form.SIGN_IMG"
                      width="100%" height="80px" mode="scaleToFill"
                      @click="previewImage(form.SIGN_IMG)"></u--image>
          </view>
        </template>
        <u-cell :border="false">
          <view slot="label" class="flex-between">
            <u-button type="primary" text="提交" @click="$u.debounce(fnSubmit, 1000,true)"></u-button>
          </view>
        </u-cell>
      </u-cell-group>
    </view>
  </view>
</template>

<script>
import sign from "../../../components/sign/sign";
import {setSafetyenvironmentalGoEdit, setSafetyenvironmentalExplain} from "../../../api";

export default {
  components: {
    sign,
  },
  data() {
    return {
      INSPECTION_ID: '',
      form: {},
      signShow: false
    }
  },
  onLoad(event) {
    this.INSPECTION_ID = event.INSPECTION_ID
    this.getData()
  },
  computed: {
    userInfo() {
      return this.$store.getters.getUserInfo
    }
  },
  methods: {
    async getData() {
      let params = {
        INSPECTION_ID: this.INSPECTION_ID,
      }
      let resData = await setSafetyenvironmentalGoEdit(params)
      this.form = resData.pd
    },
    previewImage(current) {
      uni.previewImage({
        urls: [current],
        current
      });
    },
    downloadAppendix() {
      uni.downloadFile({
        url: this.$store.state.filePath + this.form.INSPECTED_EXPLAIN_FILEPATH,
        success: (res) => {
          uni.openDocument({
            filePath: res.tempFilePath,
          });
        },
      });
    },
    signConfirm({path}) {
      this.form.SIGN_IMG = path
    },
    async fnSubmit() {
      if (!this.form.INSPECTION_STATUS) {
        uni.showToast({
          title: '请选择申辩是否成立',
          icon: "none"
        })
        return;
      }
      if (this.form.INSPECTION_STATUS === '3') {
        if (!this.form.INSPECTED_EXPLAIN_REFUSE) {
          uni.showToast({
            title: '请填写不成立理由',
            icon: "none"
          })
          return;
        }
        if (!this.form.SIGN_IMG) {
          uni.showToast({
            title: '请签字',
            icon: "none"
          })
          return;
        }
        await setSafetyenvironmentalExplain({
          ...this.form,
          'loginUserId': this.userInfo.USER_ID,
          'loginUserName': this.userInfo.USERNAME
        })
        uni.showToast({
          title: '申辩成功',
        })
        uni.$u.route({
          type: 'navigateBack'
        })
      } else if (this.form.INSPECTION_STATUS === '-2') {
        uni.$u.route({
          url: '/pages/safety-environmental-inspection/initiate/detail',
          params: {
            INSPECTION_ID: this.INSPECTION_ID,
            type: 'edit',
            vector: 'list'
          }
        })
      }
    }
  }
}
</script>

<style scoped>
.title {
  min-width: 150rpx;
}

.flex-1 {
  flex: 1;
}
</style>