<template>
  <view class="container">
    <view class="searcher">
      <view>
        <u-search
          v-model="searchForm.keyword"
          placeholder="请输入关键字"
          shape="round"
          bg-color="#f7f7f8"
          action-text="搜索"
          @search="fnResetPaging"
          @custom="fnResetPaging"
        />
      </view>
    </view>

    <view class="info_mainer">
      <view v-if="list.length > 0">
        <u-list @scrolltolower="scrolltolower">
          <u-list-item
            v-for="item in list"
            :key="item.SPECIAL_RECTIFICATION_ACTIVITY_TASK_ID"
            class="wrap"
          >
            <view class="tit">
              <view class="u-line-2">{{ item.ACTIVITY_TASK_NAME }}</view>
            </view>
            <!--            <view class="text">-->
            <!--              <text>行动类型:</text>-->
            <!--              {{ item.ACTIVITY_TASK_TYPE_NAME }}-->
            <!--            </view>-->
            <view class="text">
              <text>行动周期:</text>
              {{ item.ACTIVITY_TIME_BEGIN }} 至 {{ item.ACTIVITY_TIME_END }}
            </view>
            <!--            <view class="text">-->
            <!--              <text>牵头单位:</text>-->
            <!--              {{ item.MAIN_ACTIVITY_DEPARTMENT_NAME }}-->
            <!--            </view>-->
            <view class="text">
              <text>责任单位:</text>
              {{ item.ALL_ACTIVITY_DEPARTMENT_NAME }}
            </view>
            <view class="text">
              <text>状态:</text>
              {{ item.STATE_NAME }}
            </view>
            <view class="bottem">
              <u-button
                text="查看"
                color="linear-gradient(to right, #27a0ff, #2a56f7)"
                custom-style="width:150upx; height:60upx; margin-left: 20upx;margin-right: 0;"
                @click="
                  $u.route({
                    url: '/pages/special_rectification/task_view',
                    params: {
                      SPECIAL_RECTIFICATION_ACTIVITY_TASK_ID:
                        item.SPECIAL_RECTIFICATION_ACTIVITY_TASK_ID,
                    },
                  })
                "
              />
              <u-button
                v-if="item.CHECK_ID && item.checkValue === true"
                :text="item.ISREPORT ? '检查' : '检查情况'"
                color="linear-gradient(to right, #27a0ff, #2a56f7)"
                custom-style="width:150upx; height:60upx; margin-left: 20upx;margin-right: 0;"
                @click="
                  $u.route({
                    url: '/pages/special_rectification/enterprise_inspect_list',
                    params: {
                      SPECIAL_RECTIFICATION_ACTIVITY_ID:
                        item.SPECIAL_RECTIFICATION_ACTIVITY_ID,
                      SPECIAL_RECTIFICATION_ACTIVITY_TASK_ID:
                        item.SPECIAL_RECTIFICATION_ACTIVITY_TASK_ID,
                      ISREPORT: item.ISREPORT,
                    },
                  })
                "
              />
              <u-button
                v-if="item.ISREPORT && item.contactValue === true"
                text="指派具体工作人员"
                color="linear-gradient(to right, #27a0ff, #2a56f7)"
                custom-style="width:250upx; height:60upx; margin-left: 20upx;margin-right: 0;"
                @click="
                  // fnAssignSpecificStaff(
                  //   item.SPECIAL_RECTIFICATION_ACTIVITY_TASK_ID,
                  // )
                  $u.route({
                    url: '/pages/special_rectification/add_task_user',
                    params: {
                      SPECIAL_RECTIFICATION_ACTIVITY_ID:
                        item.SPECIAL_RECTIFICATION_ACTIVITY_ID,
                      SPECIAL_RECTIFICATION_ACTIVITY_TASK_ID:
                        item.SPECIAL_RECTIFICATION_ACTIVITY_TASK_ID,
                      DEPARTMENT_ID: LOGIN_DEPARTMENT,
                    },
                  })
                "
              />
            </view>
          </u-list-item>
        </u-list>
      </view>
      <empty v-else />
    </view>
  </view>
</template>

<script>
import { getSpecialRectificationTaskList } from "@/api";

export default {
  data() {
    return {
      list: [],
      pageSize: 10,
      currentPage: 1,
      totalPage: 0,
      searchForm: {
        keyword: "",
      },
      assignSpecificStaff: {
        show: false,
        form: {
          DEPARTMENT_ID: "",
          USER_ID: "",
        },
        rules: {
          USER_ID: {
            type: "string",
            required: true,
            message: "请选择检查人",
            trigger: ["blur", "change"],
          },
        },
      },
      inspectUserList: [],
      inspectionDepartment: [],
    };
  },
  computed: {
    userInfo() {
      return this.$store.getters.getUserInfo;
    },
  },
  created() {
    this.fnGetData();
    if (this.$store.getters.getUserInfo.DEPARTMENT_FULL_ID) {
      this.LOGIN_DEPARTMENT =
        this.$store.getters.getUserInfo.DEPARTMENT_FULL_ID.split(",")[0];
    }
  },
  methods: {
    async fnGetData() {
      const resData = await getSpecialRectificationTaskList({
        showCount: this.pageSize,
        currentPage: this.currentPage,
        KEYWORDS: this.searchForm.keyword,
      });
      const targetValue = this.$store.getters.getUserInfo.USER_ID;
      for (let i = 0; i < resData.varList.length; i++) {
        resData.varList[i].checkValue =
          resData.varList[i].CHECK_ID &&
          resData.varList[i].CHECK_ID.split(",").includes(targetValue);
        resData.varList[i].contactValue =
          resData.varList[i].CONTACT_ID &&
          resData.varList[i].CONTACT_ID.split(",").includes(targetValue);
      }
      // 当前时间
      const currentDateStr = new Date().toISOString().slice(0, 10);
      resData.varList.forEach((item) => {
        const time1 = new Date(item.ACTIVITY_TIME_BEGIN);
        const time2 = new Date(item.ACTIVITY_TIME_END);
        if (
          time1.getTime() <= new Date(currentDateStr).getTime() &&
          new Date(currentDateStr).getTime() <= time2.getTime()
        ) {
          item.ISREPORT = true;
        } else {
          item.ISREPORT = false;
        }
        if (new Date(currentDateStr).getTime() < time1.getTime()) {
          item.STATE_NAME = "未开始";
        } else if (new Date(currentDateStr).getTime() > time2.getTime()) {
          // 检查工作未开展
          item.STATE_NAME = "已结束";
        } else if (item.COUNT_TASK_INSPECT <= 0) {
          // 检查工作未开展
          item.STATE_NAME = "未开展";
        } else {
          item.STATE_NAME = "开展中";
        }
      });
      this.list = [...this.list, ...resData.varList];
      this.totalPage = resData.page.totalPage;
    },
    scrolltolower() {
      this.currentPage++;
      if (this.totalPage >= this.currentPage) this.fnGetData();
    },
    fnResetPaging() {
      this.list = [];
      this.currentPage = 1;
      this.fnGetData();
    },
  },
};
</script>

<style scoped lang="scss">
.searcher {
  width: 100%;
  background: #ffffff;
  padding: 20upx;
  box-sizing: border-box;
  margin-top: 20upx;
  border-bottom: 1px solid #eeeeee;

  .mainer {
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-top: 20upx;
    align-items: center;
    font-size: 28upx;
  }
}

.info_mainer {
  width: 100%;
  margin-top: 20upx;

  .wrap {
    width: 100%;
    background: #ffffff;
    margin-bottom: 20upx;
    padding: 20upx;
    line-height: 2;
    box-sizing: border-box;

    .tit {
      font-weight: bold;
      display: flex;
      justify-content: space-between;
      align-items: center;
    }

    .text text {
      color: #999999;
      margin-right: 10upx;
    }

    .bottem {
      width: 100%;
      border-top: 1px solid #eeeeee;
      margin-top: 20upx;
      display: flex;
      justify-content: flex-end;
      padding: 20upx 0 0;
    }
  }
}
</style>
