<template>
  <view class="container">
    <tui-table style="margin: 25rpx;">
      <tui-tr>
        <tui-td text-align="center"
                ellipsis
                bold
                :span="5">序号</tui-td>
        <tui-td text-align="center"
                ellipsis
                bold
                :span="16">检查内容</tui-td>
        <tui-td text-align="center"
                ellipsis
                bold
                :span="8">正常</tui-td>
        <tui-td text-align="center"
                ellipsis
                bold
                :span="8">异常</tui-td>
        <tui-td text-align="center"
                ellipsis
                bold
                :span="8">不涉及</tui-td>
      </tui-tr>
      <tui-tr v-for="(item, index) in patrolType"
              :key="index">
        <tui-td text-align="center"
                ellipsis
                :span="5">{{index+1}}</tui-td>
        <tui-td alignItems="center"
                :span="16">{{item.inspect_content}}</tui-td>
        <tui-td text-align="center"
                ellipsis
                :span="8">
          <tui-switch @change="(e)=>{updatedStatus(e,item,1)}"
                      :scaleRatio="0.8"
                      name="stateToSwitch"
                      :disabled="distanceJudgementState!=2"
                      :checked="stateToSwitch(item.state,1)"
                      type="checkbox">
          </tui-switch>
        </tui-td>
        <tui-td text-align="center"
                :span="8">
          <view style="display: flex;justify-content:space-around;
					align-items: center;  width: 100%;">
            <tui-button width="100rpx"
                        height="50rpx"
                        :size="24"
                        :disabled="distanceJudgementState!=2"
                        @click="navTo(item)">上报</tui-button>
          </view>
        </tui-td>
        <tui-td text-align="center"
                ellipsis
                :span="8">
          <tui-switch @change="(e)=>{updatedStatus(e,item,2)}"
                      :scaleRatio="0.8"
                      name="stateToSwitch"
                      :checked="stateToSwitch(item.state,2)"
                      type="checkbox">
          </tui-switch>
        </tui-td>
      </tui-tr>
    </tui-table>
    <tui-button width="500rpx"
                height="70rpx"
                margin="30rpx auto"
                :size="24"
                :disabled="distanceJudgementState!=2"
                @click="navTo({
                  categroy:'其它隐患',
                  id:-1
                })">其它隐患上报</tui-button>
  </view>
</template>

<script>
import UserHeader from "@/pages/template/bomb/common/userHeader.vue";
export default {
  components: {
    UserHeader,
  },
  props: {
    risk_id: {
      type: String,
      default: "",
    },
    patrolTypeProp: {
      type: Array,
      default: [],
    },
    riskOrgName: {
      type: String,
      default: "",
    },
    //状态值  距离是否满足需求
    distanceJudgementState: {
      type: Number,
      default: 0,
    },
    //责任人
    contacts: {
      type: String,
      default: "",
    },
    //责任人id
    contacts_id: {
      type: String,
      default: "",
    },
  },
  data() {
    return {
      // risk_id: null,
      // riskOrgName: "",
      patrolType: [],
    };
  },

  onLoad(options) {
    // this.risk_id = options.id;
    // this.patrolType = JSON.parse(options.content);
    // this.riskOrgName = options.riskOrgName;
  },
  mounted() {
    this.patrolType = JSON.parse(JSON.stringify(this.patrolTypeProp));
  },
  methods: {
    //状态值转换 标记正常与否
    stateToSwitch: (state, type) => {
      switch (type) {
        case 1:
          return state == 1 ? true : false;
        case 2:
          return state == 2 ? true : false;
        default:
          return false;
      }
    },
    //点击单选操作
    async updatedStatus(e, item, status = 1) {
      let res = await this.$request.get(`patrol/TodayTask/setManagementState`, {
        params: {
          risk_id: this.risk_id,
          content_id: item.id,
          state: e.detail.value ? status : 0,
        },
      });
      if (res.code == 0) {
        uni.showToast({
          title: "修改成功",
          duration: 2000,
        });
        item.state = e.detail.value ? status : 0;
      }
    },
    //通过获取今日任务列表获取隐患类型
    navTo(item) {
      uni.navigateTo({
        url: `/pages/template/everyday/dayReport?type_source_id=${
          this.risk_id
        }&item=${JSON.stringify(item)}&contacts=${this.contacts}&contacts_id=${
          this.contacts_id
        }`,
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.container {
  padding-top: 20rpx;
}

.header {
  display: flex;
}
</style>