policeSecurity/collect_information/src/subPages/police/dailyInspection/dailyInspection.vue

<template>
  <view class="container">
    <picker mode="selector" :range="selector" rangeKey="label" @change="onChange">
      <view class="picker">
        考核单位：
        <view style="display: flex; align-items: center">
          <view v-if="selectorChecked.length === 0" style="color: #606266">请选择考核单位：</view>
          <view> {{ selectorChecked }}</view>
          <IconFont name="arrow-right"></IconFont>
        </view>
      </view>
    </picker>

    <picker v-if="(selectorType?.length ?? 0) > 0" mode="selector" :range="selectorType" rangeKey="label" @change="onChangeType">
      <view class="picker">
        当前考核项目：
        <view style="display: flex; align-items: center">
          <view v-if="selectorCheckedType.length === 0" style="color: #606266">请选择考核项目</view>
          <view> {{ selectorCheckedType }}</view>
          <IconFont name="arrow-right"></IconFont>
        </view>
      </view>
    </picker>

    <view class="exit" v-for="item in starRating" :key="item.snowFlakeId" @click="Onrating(item.name, item.snowFlakeId)">
      <view class="exitItem">
        <text style="margin-left: 30rpx; font-size: 16px">
          <text>{{ item.name }}（{{ item?.totalScore }}分） </text>
        </text>
      </view>
      <view style="margin-right: 30rpx; display: flex; align-items: center">
        <view v-if="item.currentScore > 0" style="color: #ff0000"> -{{ item?.currentScore }}</view>
        <IconFont name="arrow-right"></IconFont>
      </view>
    </view>

    <view>
      <nut-form labelWidth="320rpx" labelAlign="left">
        <nut-form-item label="备注">
          <nut-input v-model="_form.remark" placeholder="请输入备注" type="text" />
        </nut-form-item>

        <nut-form-item label="考核人员签名:">
          <navigator :url="`/subPages/select/signature/signature?index=${1}&name=考核人员签名`" hover-class="navigator-hover">
            <nut-button style="height: 50rpx" shape="square" type="info">考核人员签字</nut-button>
          </navigator>
        </nut-form-item>
        <view style="display: flex; justify-content: center">
          <!-- :class="direction1 ? 'sigh_btns' : 'sigh_btns_noRotate'" -->
          <image v-if="_form.assessmentUserSignature" :src="_form.assessmentUserSignature" mode="heightFix" style="height: 300rpx"></image>
        </view>

        <nut-form-item label="被考评学校签名:">
          <navigator :url="`/subPages/select/signature/signature?index=${2}&name=被考评学校签名`" hover-class="navigator-hover">
            <nut-button style="height: 50rpx" shape="square" type="info">被考评学校负责人</nut-button>
          </navigator>
        </nut-form-item>
        <view style="display: flex; justify-content: center">
          <!--  :class="direction2 ? 'sigh_btns' : 'sigh_btns_noRotate'" -->
          <image v-if="_form.byAssessmentEnterprisesUnitUserSignature" :src="_form.byAssessmentEnterprisesUnitUserSignature" mode="heightFix" style="height: 300rpx"></image>
        </view>
      </nut-form>
    </view>
    <view style="height: 150rpx"></view>
    <view style="display: flex; width: 100%; justify-content: center; position: fixed; bottom: 50rpx">
      <nut-button :loading="isLoading" shape="round" type="info" @click="onSubmit" style="height: 80rpx; width: 702rpx; margin: 10rpx auto">确认提交</nut-button>
    </view>
  </view>
</template>
<script setup lang="ts">
import { IconFont } from '@nutui/icons-vue-taro'
import Taro, { useLoad, useUnload } from '@tarojs/taro'
import './dailyInspection.scss'
import { ref, computed, reactive, watch } from 'vue'
import api from '@/request/index'
import { useDailyStore } from '@/store/daily'
const starRating = ref<any[]>([])
const store = useDailyStore()
const daily = computed(() => store.getdailyinspection)
const base64_1 = computed(() => store.get_base64_1)
const base64_2 = computed(() => store.get_base64_2)
// const direction = computed(() => store.getDirection)
const direction1 = computed(() => store.getDirection1)
const direction2 = computed(() => store.getDirection2)

const currentCkProjectId = ref('')
const submitData = ref<Item[]>([])

const _form = reactive({
  enterprisesUnitId: '', //企事业单位id
  ckProjectId: '', //考核项目
  assessmentUserSignature: '', //考核人员签字
  byAssessmentEnterprisesUnitUserSignature: '', //	被考核单位人员签字
  remark: '', //考核备注
})
watch(
  [daily, base64_1, base64_2],
  ([newDaily, newBase64_1, newBase64_2]) => {
    _form.assessmentUserSignature = newBase64_1
    _form.byAssessmentEnterprisesUnitUserSignature = newBase64_2

    if (newDaily.length > 0) {
      starRating.value = newDaily
    }
    submitData.value = newDaily
    // console.log('watch_______________', _form, submitData.value)
  },
  { immediate: true }
)

useLoad(async () => {
  await getUnitEnterprisesUnitList()
})

const Onrating = function (name: string, snowFlakeId: string) {
  let index = starRating.value.findIndex((item) => item.snowFlakeId === snowFlakeId)
  Taro.navigateTo({
    url: `/subPages/select/dailyLife/dailyLife?name=${name}&index=${index}`,
  })
}

/**
 * @assessmentCriteriaRulesByCkProjectId 获取考核规则
 */

const assessmentCriteriaRulesByCkProjectId = async function (ckProjectId) {
  // Taro.showLoading({
  //   title: '加载中...',
  //   mask: true,
  // })
  const res = await api.get<StarRating[]>(`/assessmentCriteria/assessmentCriteriaRulesByCkProjectId`, { ckProjectId })

  res.data?.forEach((item) => {
    item.currentScore = 0

    item.itemList.forEach((element: ItemList) => {
      element.standardList.forEach((ele) => {
        ele.isSelected = false
      })
      element.standardList.unshift({
        ckItemId: 'null',
        deductionPoints: 0,
        name: '达标',
        snowFlakeId: 'null',
        isSelected: true,
      })
      element.selectedID = element.standardList[0].snowFlakeId
      element.selected_points = 0 // 默认达标 默认扣 0 分
      // 多选
      if (element.type.value === 'multiple') {
        element.selectedGroup = [element.selectedID]
      }
    })
  })
  starRating.value = res.data ?? []
  // console.log('starRating.value______________________________', starRating.value)

  store.dailyinspectionList(starRating.value)
  // Taro.hideLoading()
}
/**
 * @ckProjectListByType 根据类型获取考核标准列表
 */

const selectorCheckedType = ref<string>('')
const selectorType = ref<CkProjectListByType[]>()
const ckProjectListByType = async function (type) {
  const res = await api.get<CkProjectListByType[]>(`/assessmentCriteria/ckProjectListByType`, { type })
  console.log(res.data)

  if (res.data?.length === 0) {
    let timeID = setTimeout(() => {
      Taro.showToast({
        title: '该单位下面没有考核标准',
        icon: 'none',
        duration: 2000,
      })
      clearTimeout(timeID)
    }, 500)
  }
  selectorType.value = res.data
}

const onChangeType = function (e: any) {
  let index = Number(e.detail.value)
  selectorCheckedType.value = selectorType.value?.[index].label as string
  currentCkProjectId.value = selectorType.value?.[index].value as string
  assessmentCriteriaRulesByCkProjectId(currentCkProjectId.value)
  _form.ckProjectId = selectorType.value?.[index].value as string
}

const selector = ref<UnitEnterprisesUnitList[]>()
const selectorChecked = ref<string>('')
const onChange = function (e: any) {
  try {
    let index = Number(e.detail.value)
    selectorChecked.value = selector.value?.[index].label as string
    let type = selector.value?.[index].extData.type.value
    ckProjectListByType(type)
    _form.enterprisesUnitId = selector.value?.[index].value as string
  } catch (error) {
    console.log('🚀 ~ onChange ~ error:', error)
  }
}

const getUnitEnterprisesUnitList = async function () {
  const res = await api.get<UnitEnterprisesUnitList[]>(`/policeIndex/getUnitEnterprisesUnitList`)

  selector.value = res.data
}

const _showToast = function (title) {
  Taro.showToast({
    title,
    icon: 'none',
    duration: 1500,
    mask: true,
  })
}

/**
 * @onSubmit 提交
 * @assessmentRecordDetails 选择后的数据用于提交
 * @clearData 清空数据
 */

const assessmentRecordDetails = ref<any[]>([])
const clearData = function () {
  store.clearSignData()
  store.dailyinspectionList([])
  assessmentRecordDetails.value = []
  _form.assessmentUserSignature = ''
  _form.byAssessmentEnterprisesUnitUserSignature = ''
  _form.remark = ''
  assessmentCriteriaRulesByCkProjectId(currentCkProjectId.value) //重新获取数据
}
const isLoading = ref(false)
const onSubmit = async function () {
  if (_form.enterprisesUnitId === '') {
    _showToast('请选择企事业单位')
    return
  }
  if (_form.ckProjectId === '') {
    _showToast('请选择考核项目')
    return
  }
  if (_form.assessmentUserSignature === '') {
    _showToast('请考核人员签字')
    return
  }
  if (_form.byAssessmentEnterprisesUnitUserSignature === '') {
    _showToast('请被考核单位人员签字')
    return
  }
  isLoading.value = true

  submitData.value.forEach((element: StarRating) => {
    element?.itemList.forEach((item: ItemList) => {
      item.standardList.forEach((ele: StandardList) => {
        if (ele.snowFlakeId === item.selectedID && !item.hasOwnProperty('selectedGroup') && item.selectedID != 'null') {
          assessmentRecordDetails.value.push({
            ckGroupId: element.snowFlakeId, //选项的雪花Id
            ckItemId: ele.ckItemId, //已选择的ID
            ckStandardId: item.selectedID, //已选择的雪花ID
          })
        }
      })
      if (item.hasOwnProperty('selectedGroup')) {
        item.selectedGroup.forEach((selectedItem) => {
          item.standardList.forEach((standard_Element) => {
            if (selectedItem != 'null' && selectedItem === standard_Element.snowFlakeId) {
              assessmentRecordDetails.value.push({
                ckGroupId: element.snowFlakeId, //选项的雪花Id
                ckItemId: standard_Element.ckItemId, //已选择的ID
                ckStandardId: selectedItem, //已选择的雪花ID
              })
            }
          })
        })
      }
    })
  })

  const assessmentRecordParams = {
    assessmentRecordDetails: [] as any[],
  }
  Object.assign(assessmentRecordParams, _form)
  assessmentRecordParams.assessmentRecordDetails = [...assessmentRecordDetails.value]
  const result = await api.post('/assessmentCriteria/submitAssessmentRecord', assessmentRecordParams)

  clearData() //清空数据
  if (result.code === 200) {
    isLoading.value = false

    let timeID = setTimeout(() => {
      Taro.showToast({
        title: result.message,
        icon: 'success',
        duration: 2000,
        mask: true,
      })
      clearTimeout(timeID)
    }, 500)
  } else {
    _showToast(result.message)
  }
}

useUnload(() => {
  store.clearSignData()
  store.dailyinspectionList([])
  assessmentRecordDetails.value = []
  _form.assessmentUserSignature = ''
  _form.byAssessmentEnterprisesUnitUserSignature = ''
  _form.remark = ''
})
</script>