YNUtdPlatform/pages/workPlan/monthPlanAuditingDetails/pro-index.vue

<template>
  <!-- 基建月计划详情 -->
  <view style="padding: 15rpx">
    <u-navbar
      class="u-navbar"
      title="详情"
      placeholder
      @leftClick="leftClick"
      leftIconColor="#fff"
      bgColor="#00337A"
      :titleStyle="{ color: '#FFF', fontSize: '32rpx' }"
    />

    <view>
      <view class="item-header">
        <!-- <text>{{ month }}</text>
        <text v-if="kjsAmount > 0">可接受风险:{{ kjsAmount }}</text>
        <text v-if="gfxAmount > 0">高风险:{{ gfxAmount }}</text>
        <text v-if="zfxAmount > 0">中风险:{{ zfxAmount }}</text>
        <text v-if="dfxAmount > 0">低风险:{{ dfxAmount }}</text>
        <text v-if="tfxAmount > 0">特高风险:{{ tfxAmount }}</text> -->
      </view>

      <view>
        <scroll-view scroll-x class="header-left">
          <text
            :class="{ 'active-form-page': activeFormPages === index }"
            v-for="(item, index) in monthDetailsList"
            :key="index"
            @tap="onChangeFormPages(index)"
          >
            {{ index + 1 }}
          </text>
        </scroll-view>
      </view>

      <view class="auditing-result" v-if="!isView || isView == 'false'">
        <uni-forms label-position="top" label-width="200">
          <uni-forms-item required label="是否通过">
            <uni-data-select
              :localdata="passList"
              v-model="isPass"
              placeholder="请选择"
              @change="onChangeIsPass"
              :clear="false"
            ></uni-data-select>
          </uni-forms-item>
          <uni-forms-item required label="不通过意见" v-if="isPass === 1">
            <uni-easyinput :clear="false" type="text" placeholder="请填写" v-model="remarks" />
          </uni-forms-item>
        </uni-forms>
      </view>

      <swiper
        circular
        :autoplay="false"
        :current="activeFormPages"
        class="scroll-content"
        :style="{ height: navHeight + 'px' }"
        @change="onSwiperChangeForms"
      >
        <swiper-item v-for="(item, index) in monthDetailsList" :key="index" :style="{ height: navHeight + 'px' }">
          <scroll-view scroll-y="true" class="scroll-Y" :style="{ height: navHeight + 'px' }">
            <uni-forms class="form-container" label-position="top" label-width="200">
              <uni-forms-item
                v-for="(f, i) in productionFormLabel"
                :key="i"
                :label="f.form_label"
                :name="f.name"
                :required="f.required"
              >
                <u--textarea
                  v-if="f.items_type === 'area'"
                  v-model="item[f.name]"
                  placeholder="请填写"
                  autoHeight
                  :disabled="editDisabled"
                ></u--textarea>
                <u--input
                  v-if="f.items_type === 'ipt'"
                  :type="f.isType ? f.isType : 'text'"
                  v-model="item[f.name]"
                  placeholder="请填写"
                  :disabled="editDisabled"
                />
                <uni-data-select
                  v-model="item[f.name]"
                  :localdata="f.options"
                  :disabled="editDisabled"
                  :clear="false"
                  v-if="f.items_type === 'sel'"
                ></uni-data-select>
                <uni-datetime-picker
                  v-if="f.items_type === 'date'"
                  type="datetime"
                  :clear-icon="false"
                  v-model="item[f.name]"
                />
              </uni-forms-item>
            </uni-forms>

            <view class="process-container" v-if="roles != '22'">
              <h1>流程</h1>

              <view v-for="(item, index) in processList" :key="index">
                <view class="process-item">
                  <view>
                    <!-- 项目部
                    <text class="type-icon">x</text> -->

                    <image :src="item.imgSrcList[item.imgSrcIndex]" mode="'scaleToFill'"></image>
                  </view>
                  <view class="box-2">
                    <text class="text_1">{{ item.process }}</text>
                    <view class="text_2" v-for="(j, k) in item.auditingInfo" :key="k">
                      <text>{{ j.operateUser }}</text>
                      <text v-if="index !== 0">{{ j.operateResult }}</text>
                      <text v-if="index !== 0">{{ j.operateTime }}</text>
                    </view>
                  </view>
                  <view v-if="index == 0" class="box-3">{{ item.auditingInfo[0].operateTime || '' }}</view>
                </view>

                <view class="line" v-if="index !== 2">
                  <view class="line-content">
                    <view></view>
                  </view>
                </view>
              </view>
            </view>
          </scroll-view>
        </swiper-item>
      </swiper>
    </view>

    <view class="revoke" v-show="!isView || isView == 'false'" @tap="onAuditingComplete">
      审核完成
      <!-- <view
        @tap="showModalFun(item.id)"
        v-for="item in btnList"
        :key="item.id"
        v-show="item.isShow.includes(state) && item.isRoles.includes(roles)"
      >
        <uni-icons :type="item.type" size="20" style="color: #00337a"></uni-icons>
        <text style="margin-top: 8rpx">{{ item.title }}</text>
      </view> -->
    </view>

    <!-- 审核人弹框 -->
    <uni-popup ref="popupAuditing" background-color="#fff">
      <view class="auditing-content">
        <view class="auditing-title">
          <view class="title">
            <text style="margin-left: 15rpx">请选择计划审核人</text>
          </view>
          <view class="search">
            <view class="search-ipt">
              <uni-easyinput :clear="false" type="text" placeholder="请输入关键字" v-model="searchUserName" />
            </view>
            <view class="search-btn" @tap="onSearchUserInfo">搜索</view>
          </view>
        </view>

        <view class="user-info">
          <view class="user-title">
            <view style="width: 8%"></view>
            <view style="width: 12%">序号</view>
            <view style="width: 30%">姓名</view>
            <view style="width: 50%">岗位</view>
          </view>

          <scroll-view :scroll-y="true" style="height: 33vh">
            <view class="user-content" v-for="(item, index) in auditingUserList" :key="item.id">
              <view style="width: 8%">
                <label>
                  <checkbox
                    :checked="item.isChecked"
                    color="#fff"
                    borderColor="#ccc"
                    backgroundColor="#fff"
                    activeBorderColor="#003778"
                    activeBackgroundColor="#003778"
                    style="transform: scale(0.7)"
                    @tap="onCheckBoxChange(item)"
                  />
                </label>
              </view>
              <view style="width: 12%">{{ index + 1 }}</view>
              <view style="width: 30%">{{ item.name }}</view>
              <view style="width: 50%">{{ item.orgName }}</view>
            </view>
          </scroll-view>
        </view>

        <view class="user-btn">
          <view class="btn-cancel" @tap="onHandlerCancel">取消</view>
          <view class="btn-submit" @tap="onHandlerSubmit">确定</view>
        </view>
      </view>
    </uni-popup>
  </view>
</template>

<script>
import {
  submitPlanProApi,
  deletePlanApi,
  revokePlanApi,
  getPlanDetailProApi,
  getRiskLevelListApi,
  getControlLevelListApi,
  updateInfPlanContentProApi,
  getAUditingProcessApi,
  getAUditingUserInfoApi,
  // setMonthPlanApi,
  setAuditingRejectProApi
} from '../../../api/workPlan/monthPlan'
export default {
  data() {
    return {
      monthDetailsList: [],
      monthPlanTitle: '基建月计划',
      editDisabled: false,
      state: '',
      month: '',
      proId: '',
      activeFormPages: 0,
      params: {
        proId: '',
        planTime: ''
      },
      btnList: [
        { title: '修改', id: 1, type: 'compose', isShow: ['1', '3', '2'], isRoles: ['22', '23'] },
        { title: '删除', id: 2, type: 'trash', isShow: ['1', '3', '2'], isRoles: ['22', '23'] },
        {
          title: '撤回',
          id: 3,
          type: 'redo-filled',
          isShow: ['1', '2', '4', '5', '6', '7', '8', '9'],
          isRoles: ['22', '23']
        },
        { title: '提交', id: 4, type: 'upload', isShow: ['1', '2', '3'], isRoles: ['22', '23'] }
      ],
      productionFormLabel: [
        { form_label: '作业内容', items_type: 'area', name: 'zynr', required: true },
        { form_label: '实施单位', items_type: 'area', name: 'ssdw', required: true },
        { form_label: '实施部门', items_type: 'area', name: 'ssbm', required: true },
        { form_label: '任务来源', items_type: 'area', name: 'rwly', required: true },
        {
          form_label: '作业类型',
          items_type: 'sel',
          name: 'zylx',
          required: true,

          options: []
        },
        { form_label: '计划开始时间', items_type: 'date', name: 'kssj', required: true },
        { form_label: '计划结束时间', items_type: 'date', name: 'jssj', required: true },
        {
          form_label: '是否停电',
          items_type: 'sel',
          name: 'sftd',
          required: true,
          options: [
            { value: '1', text: '是' },
            { value: '0', text: '否' }
          ]
        },
        { form_label: '停电设备（作业场所）', items_type: 'ipt', name: 'tdsb', required: true },
        { form_label: '作业监督人/联系电话', items_type: 'ipt', name: 'zyjdr', required: true },
        { form_label: '作业负责人/联系电话', items_type: 'ipt', name: 'zyfzr', required: true },
        {
          form_label: '管控级别',
          items_type: 'sel',
          name: 'gkcj',
          required: true,
          options: []
        },
        {
          form_label: '风险等级',
          items_type: 'sel',
          name: 'fxdj',
          required: true,
          options: []
        },
        {
          form_label: '管控方式（根据作业内容在作业文件栏中选择"是"、"否"）',
          items_type: 'sel',
          name: 'gkfs',
          required: true,
          options: []
        },
        {
          form_label: '施工方案',
          items_type: 'sel',
          name: 'sgfa',
          required: true,
          options: [
            { value: '1', text: '是' },
            { value: '0', text: '否' }
          ]
        },
        {
          form_label: '作业指导书',
          items_type: 'sel',
          name: 'zyzds',
          required: true,
          options: [
            { value: '1', text: '是' },
            { value: '0', text: '否' }
          ]
        },
        {
          form_label: '作业表单',
          items_type: 'sel',
          name: 'zybd',
          required: true,
          options: [
            { value: '1', text: '是' },
            { value: '0', text: '否' }
          ]
        },
        {
          form_label: '工作票',
          items_type: 'sel',
          name: 'gzp',
          required: true,
          options: [
            { value: '1', text: '是' },
            { value: '0', text: '否' }
          ]
        },
        { form_label: '备注', items_type: 'ipt', name: 'bz', required: false },
        { form_label: '计划数量', items_type: 'ipt', isType: 'number', name: 'planCount', required: true }
      ],
      kjsAmount: 0,
      dfxAmount: 0,
      zfxAmount: 0,
      gfxAmount: 0,
      tfxAmount: 0,
      navHeight: 0,
      roles: uni.getStorageSync('wkRole'),
      processList: [
        {
          process: '发起申请',
          userName: '',
          time: '',
          auditingResult: '',
          imgSrcIndex: 0,
          auditingInfo: [{ operateTime: '', operateUser: '', operateResult: '' }],
          imgSrcList: ['../../../static/images/workPlan/xmb_dd.png', '  ', '../../../static/images/workPlan/xmb_tg.png']
        },
        {
          process: '审核人',
          userName: '',
          time: '2',
          auditingResult: '',
          imgSrcIndex: 0,
          auditingInfo: [],
          imgSrcList: [
            '../../../static/images/workPlan/fgs_dsh.png',
            '../../../static/images/workPlan/fgs_wtg.png',
            '../../../static/images/workPlan/fgs_tg.png',
            '../../../static/images/workPlan/fgs_dd.png'
          ]
        },
        {
          process: '审核人',
          userName: '',
          time: '',
          imgSrcIndex: 0,
          auditingResult: '未通过',
          auditingInfo: [],
          imgSrcList: [
            '../../../static/images/workPlan/zgs_dsh.png',
            '../../../static/images/workPlan/zgs_wtg.png',
            '../../../static/images/workPlan/zgs_tg.png',
            '../../../static/images/workPlan/zgs_dd.png'
          ]
        }
      ],
      searchUserName: '',
      auditingUserList: [],
      passList: [
        { value: 0, text: '通过' },
        { value: 1, text: '不通过' }
      ],
      isPass: null,
      remarks: '',
      isView: false
    }
  },
  methods: {
    leftClick() {
      uni.navigateBack()
    },
    async getRiskLevelListData() {
      const res = await getRiskLevelListApi()

      try {
        this.productionFormLabel.forEach(e => {
          if (e.form_label === '风险等级') {
            e.options = res.map(e => {
              return {
                value: e.id,
                text: e.name
              }
            })

            throw new Error()
          }
        })
      } catch (error) {}
    },
    async getControlLevelListData() {
      const res = await getControlLevelListApi()
      // console.log('管控层级', res)
      try {
        this.productionFormLabel.forEach(e => {
          if (e.form_label === '管控级别') {
            e.options = res.map(e => {
              return {
                value: e.id,
                text: e.name
              }
            })

            throw new Error()
          }
        })
      } catch (error) {}
    },
    /* 获取详情 */
    async getPlanDetailData() {
      console.log('this.params', this.params)
      const res = await getPlanDetailProApi(this.params)
      console.log('详情数据res', res)

      this.monthDetailsList = res.obj

      if (this.monthDetailsList.length > 0) {
        this.kjsAmount = 0
        this.dfxAmount = 0
        this.zfxAmount = 0
        this.gfxAmount = 0
        this.tfxAmount = 0
        // this.monthDetailsList.forEach(e => {
        //   this.kjsAmount = this.kjsAmount + e.kjsfx * 1
        //   this.dfxAmount = this.dfxAmount + e.dfx * 1
        //   this.zfxAmount = this.zfxAmount + e.zfx * 1
        //   this.gfxAmount = this.gfxAmount + e.gfx * 1
        //   this.tfxAmount = this.tfxAmount + e.tgfx * 1
        // })

        this.kjsAmount = this.monthDataList[0].kjsfx * 1
        this.dfxAmount = this.monthDataList[0].dfx * 1
        this.zfxAmount = this.monthDataList[0].zfx * 1
        this.gfxAmount = this.monthDataList[0].gfx * 1
        this.tfxAmount = this.monthDataList[0].tgfx * 1
      }
    },
    showModalFun(type) {
      let tipTitle = ''
      let API = null
      switch (type) {
        case 1:
          tipTitle = '修改'
          API = updateInfPlanContentProApi
          break
        case 2:
          tipTitle = '删除'
          API = deletePlanApi
          break
        case 3:
          tipTitle = '撤销'
          API = revokePlanApi
          break
        case 4:
          tipTitle = '提交'
          API = submitPlanProApi
          break
      }

      uni.showModal({
        title: '提示',
        content: `确定要${tipTitle}吗？`,
        showCancel: true,
        cancelText: '取消',
        confirmText: '确定',
        confirmColor: '#00337a',
        cancelColor: '#00337a',
        success: async res => {
          if (res.confirm) {
            const params = {
              id: JSON.stringify(this.monthDetailsList)
            }

            if (type === 4 && this.roles != '22') {
              this.getAUditingUserInfoData()
              this.$refs.popupAuditing.open('center')
            } else {
              uni.showLoading({
                title: '正在提交，请勿重复点击',
                mask: true
              })
              const result = await API(type === 1 ? params : this.params)
              uni.hideLoading({})
              if (result.res == 1) {
                uni.showToast({ title: `${tipTitle}成功！`, icon: 'none' })
                setTimeout(() => {
                  uni.navigateBack({
                    delta: 1,
                    success() {
                      uni.$emit('update')
                    }
                  })
                }, 500)
              } else {
                uni.showToast({ title: `${tipTitle}失败！`, icon: 'none' })
              }
            }
          }
        }
      })
    },
    onChangeFormPages(index) {
      this.activeFormPages = index
    },
    onSwiperChangeForms(e) {
      this.activeFormPages = e.detail.current
    },
    /* 获取详细审核流程 */
    async getAUditingProcessData() {
      if (this.roles != '22') {
        // const params = {
        //   id: this.proId
        // }

        // console.log('paramsparams参数', params)
        const res = await getAUditingProcessApi(this.params)
        console.log('res审核流程', res)

        res.obj.forEach(e => {
          if (e.type == 2) {
            this.processList[0].auditingInfo[0].operateTime = e.upTime ? e.upTime : null
            this.processList[0].auditingInfo[0].operateUser = e.upUser
            this.processList[0].auditingInfo[0].operateResult = e.state
          }
          if (e.type == 3) {
            this.processList[1].auditingInfo.push({
              operateTime: e.upTime,
              operateUser: e.upUser,
              operateResult: e.state
            })
          }
          if (e.type == 4) {
            this.processList[2].auditingInfo.push({
              operateTime: e.upTime,
              operateUser: e.upUser,
              operateResult: e.state
            })
          }
        })

        this.processList.forEach((e, index) => {
          console.log('e.auditingInfo', e.auditingInfo, 'e.auditingInfo')
          if (index === 0) {
            if (e.auditingInfo[e.auditingInfo.length - 1].operateTime) {
              e.imgSrcIndex = 2
            } else {
              e.imgSrcIndex = 0
            }
          }
          if (index === 1) {
            if (e.auditingInfo[e.auditingInfo.length - 1].operateResult == '待审核') {
              e.imgSrcIndex = 0
            }
            if (e.auditingInfo[e.auditingInfo.length - 1].operateResult == '未通过') {
              e.imgSrcIndex = 1
            }
            if (e.auditingInfo[e.auditingInfo.length - 1].operateResult == '通过') {
              e.imgSrcIndex = 2
            }
            if (e.auditingInfo[e.auditingInfo.length - 1].operateResult == null) {
              e.imgSrcIndex = 3
            }
          }
          if (index === 2) {
            if (e.auditingInfo[e.auditingInfo.length - 1].operateResult == '待审核') {
              e.imgSrcIndex = 0
            }
            if (e.auditingInfo[e.auditingInfo.length - 1].operateResult == '未通过') {
              e.imgSrcIndex = 1
            }
            if (e.auditingInfo[e.auditingInfo.length - 1].operateResult == '通过') {
              e.imgSrcIndex = 2
            }
            if (e.auditingInfo[e.auditingInfo.length - 1].operateResult == null) {
              e.imgSrcIndex = 3
            }
          }
        })
        // this.processList.forEach(e => {
        //   if (e.auditingInfo.length > 1) {
        //     e.auditingInfo = e.auditingInfo.splice(-1, 1)
        //   }
        // })
      }
    },
    /* 复选框事件 */
    onCheckBoxChange(item) {
      console.log(item, '*****')
      item.isChecked = !item.isChecked
    },
    /* 获取审核人接口 */
    async getAUditingUserInfoData() {
      const res = await getAUditingUserInfoApi({ name: this.searchUserName })

      this.auditingUserList = res.map(e => {
        this.$set(e, 'isChecked', false)
        return e
      })

      console.log('this.auditingUserList已处理', this.auditingUserList)
    },
    /* 搜索审核人员 */
    onSearchUserInfo() {
      console.log(this.searchUserName, '99999999')
      this.getAUditingUserInfoData()
    },
    /* 取消 */
    onHandlerCancel() {
      this.$refs.popupAuditing.close()
      this.searchUserName = ''
    },
    /* 确定 */
    async onHandlerSubmit() {
      const ids = this.auditingUserList.map(e => {
        if (e.isChecked) return e.id
      })

      let idsStr = ids.filter(e => e != null).join(',')

      const params = {
        id: this.monthDetailsList[0].id,
        user: idsStr
        // state: '2'
      }

      console.log('saveParams保存参数', params)
      uni.showLoading({
        title: '正在提交，请勿重复点击',
        mask: true
      })
      const result = await submitPlanProApi(params)
      uni.hideLoading()

      console.log(result, 'results上报人提交结果')
      if (result.res == 1) {
        uni.showToast({ title: `审核成功`, icon: 'none' })
        setTimeout(() => {
          uni.navigateBack({
            delta: 1,
            success() {
              uni.$emit('updateView')
            }
          })
        }, 500)
      } else {
        uni.showToast({ title: `提交失败！`, icon: 'none' })
      }
    },
    /* 审核完成 */
    async onAuditingComplete() {
      console.log(this.isPass, 'this.isPass---')

      if (this.isPass === null) {
        uni.showToast({ title: '请选择审核意见', icon: 'none' })
      } else if (this.isPass === 0) {
        // 走审核通过的逻辑
        updateInfPlanContentProApi({ id: JSON.stringify(this.monthDetailsList) }).then(async res => {
          console.log('修改结果---', res)

          if (res.res == 1 && this.roles == 24) {
            this.getAUditingUserInfoData()
            this.$refs.popupAuditing.open('center')
          }
          if (res.res == 1 && this.roles == 25) {
            const params = {
              id: this.monthDetailsList[0].id,
              user: ''
              // state: '2'
            }
            const result = await submitPlanProApi(params)
            console.log(result, 'results上报人提交结果')
            if (result.res == 1) {
              uni.showToast({ title: `审核成功`, icon: 'none' })
              setTimeout(() => {
                uni.navigateBack({
                  delta: 1,
                  success() {
                    uni.$emit('updateView')
                  }
                })
              }, 500)
            } else {
              uni.showToast({ title: `审核失败！`, icon: 'none' })
            }
          }
        })
      } else {
        // 审核不通过
        if (this.remarks === '') {
          uni.showToast({
            title: '请填写不通过意见',
            icon: 'none'
          })

          return false
        } else {
          // 走驳回接口
          const params = {
            remarks: this.remarks,
            id: this.monthDetailsList[0].id
          }

          console.log('params', params)
          const reject = await setAuditingRejectProApi(params)

          if (reject.res == 1) {
            uni.showToast({
              title: '驳回成功',
              icon: 'none'
            })
            setTimeout(() => {
              uni.navigateBack({
                delta: 1,
                success() {
                  uni.$emit('updateView')
                }
              })
            }, 500)
          } else {
            uni.showToast({
              title: `驳回失败，${reject.resMsg}`,
              icon: 'none'
            })
          }
          console.log('审核驳回结果', reject)
        }
      }
    },
    onChangeIsPass(value) {
      console.log(value, '-------------')

      if (value === 0) {
        this.remarks = ''
      }
    }
  },

  onLoad(options) {
    // this.state = options.state
    this.month = options.month
    this.params.planTime = options.month
    this.params.proId = options.id
    this.proId = options.id
    this.isView = options.isView
    // console.log('options.state', options.state, options.month)
    Promise.all([this.getRiskLevelListData(), this.getControlLevelListData()]).then(res => {
      // this.params.proId = options.id
      this.getPlanDetailData()
    })
    this.getAUditingProcessData()
  },
  onReady() {
    let that = this
    uni.getSystemInfo({
      //调用uni-app接口获取屏幕高度
      success(res) {
        //成功回调函数
        that._data.pH = res.windowHeight
        let titleH = uni.createSelectorQuery().select('.scroll-content')
        let bottom = uni.createSelectorQuery().select('.revoke')
        bottom
          .boundingClientRect(res => {
            const bottomHeight = res.height

            titleH
              .boundingClientRect(data => {
                let pH = that._data.pH
                that._data.navHeight = pH - data.top - bottomHeight - 16
              })
              .exec()
          })
          .exec()
      }
    })
  }
}
</script>

<style lang="scss" scoped>
.item-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10rpx 0;
  font-size: 22rpx;
  border-bottom: 1px solid #ccc;
}
::v-deep .uni-input-input:disabled {
  -webkit-text-fill-color: #333;
}

.revoke {
  width: 94%;
  // padding: 12px 0;
  position: fixed;
  bottom: 12px;
  left: 3%;
  height: 70rpx;
  border-radius: 16rpx;
  text-align: center;
  line-height: 70rpx;
  color: #fff;
  background-color: #00337a;
  // background-color: #fff;

  .auditing-complete {
    width: 98%;
    height: 70rpx;
    margin: 0 auto;
    border-radius: 16rpx;
    text-align: center;
    line-height: 70rpx;
    color: #fff;
    background-color: #00337a;
  }

  view {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
}

.header-left {
  width: 100%;
  display: flex;
  justify-content: space-between;
  white-space: nowrap;

  text {
    width: 16.66%;
    padding: 12rpx 0;
    text-align: center;
    display: inline-block;
    color: #ccc;
  }
}

.active-form-page {
  border-bottom: 1px solid #003778;
  color: #003778 !important;
}

.process-container {
  padding: 20rpx;
  background-color: #fff;
  border-top: 2px solid #ccc;

  h1 {
    margin-bottom: 20rpx;
    font-size: 40rpx;
    letter-spacing: 2px;
  }

  .process-item {
    display: flex;
    justify-content: space-between;
  }

  .process-item view:first-child {
    position: relative;
    width: 20%;
    height: 80rpx;
    color: #fff;
    // background-color: #00337a;
    border-radius: 12rpx;

    image {
      width: 100%;
      height: 80rpx;
    }

    .type-icon {
      // box-sizing: border-box;
      position: absolute;
      bottom: 0;
      right: 0;
      height: 35rpx;
      width: 35rpx;
      border-radius: 50%;
      text-align: center;
      line-height: 35rpx;
      transform: translate(25%, 25%);
      border: 3px solid #fff;
      background-color: green;
    }
  }
  .process-item .box-2 {
    flex: 1;
    padding-left: 26rpx;
    display: flex;
    flex-direction: column;

    .text_1 {
      font-size: 28rpx;
      color: #7e7e7e;
    }
    .text_2 {
      width: 100%;
      display: flex;
      // display: block;
      justify-content: space-between;
      align-items: center;
      margin-top: 16rpx;
      font-size: 24rpx;
      color: #000;
    }
  }

  .process-item .box-3 {
    width: 30%;
    font-size: 22rpx;
    color: #333;
  }

  .line {
    margin: 28rpx 0;
    .line-content {
      width: 20%;

      view {
        margin: 0 auto;
        height: 60rpx;
        width: 2px;
        background-color: #00337a;
      }
    }
  }
}
.auditing-content {
  width: 95vw;
  height: 60vh;
  background-color: #eee;

  .auditing-title {
    width: 100%;
    padding-bottom: 4rpx;
    margin-bottom: 16rpx;
    background-color: #fff;

    .title {
      width: 93%;
      margin: 20rpx auto;
      padding: 13rpx 0;
      border: 1px solid #ccc;
      font-size: 26rpx;
      color: #333;
      border-radius: 5rpx;
      box-sizing: border-box;
    }

    .search {
      width: 93%;
      margin: 20rpx auto;
      display: flex;
      justify-content: space-between;
      align-items: center;

      .search-ipt {
        width: 65%;
      }

      .search-btn {
        width: 25%;
        height: 60rpx;
        text-align: center;
        line-height: 60rpx;
        color: #fff;
        border-radius: 12rpx;
        background-color: #003778;
      }
    }
  }

  .user-info {
    width: 93%;
    margin: 0 auto;
    box-sizing: content-box;
    background-color: #fff;
    .user-title,
    .user-content {
      display: flex;
      align-items: center;
      margin-bottom: 8rpx;

      view {
        text-align: center;
      }
    }

    .user-content {
      padding: 15rpx 0;
      border-bottom: 1px solid #ccc;
    }
  }

  .user-btn {
    width: 93%;
    margin: 0 auto;
    padding-top: 28rpx;
    display: flex;
    justify-content: space-around;

    view {
      width: 40%;
      height: 82rpx;
      text-align: center;
      line-height: 82rpx;
      border-radius: 12rpx;
    }
    .btn-cancel {
      background-color: #ccc !important;
      color: #000;
    }

    .btn-submit {
      color: #fff;
      background-color: #003778 !important;
    }
  }
}
::v-deep .uni-forms-item__label {
  font-weight: bold;
  color: #000;
  font-size: 26rpx;
}
</style>