<template>
  <view>
    <view class="searchbar">
      <uni-easyinput v-model="queryParams.code" :input-border="false" placeholder="搜索变更单号"
                     placeholderStyle="font-size:30rpx" prefixIcon="search" @blur="getList" @clear="getList">
      </uni-easyinput>
    </view>
    <view class="vipData">
      <view>级位变更人数合计:
        <text>{{ statistical.personCount }}</text>
        人
      </view>
    </view>
    <view class="appList">
      <view v-for="(item,index) in list" :key="index" class="appItem">
        <view class="status" @click="goDetail(item)">
          <view>
            <text v-if="userType==1?item.status == 1:item.shenAuditStatus==0" class="text-primary">审核中</text>
            <text v-if="userType==1?item.status == 2:item.shenAuditStatus==1" class="text-success">审核通过</text>
            <text v-if="userType==1?item.status == 3:item.shenAuditStatus==2" class="text-danger">审核拒绝</text>
            <text v-if="userType==1?item.status == 4:item.shenAuditStatus==3" class="text-warning">已撤回</text>
          </view>
        </view>
        
        <view class="name mt0" @click="goDetail(item)">
          <text class="text-primary">{{ item.code }}</text>
          -{{ item.shenMemName }}
        </view>
        <view class="flexbox" @click="goDetail(item)">
          <view>
            变更人数
            <view>
              <text class="text-danger">{{ item.count }}人</text>
            </view>
          </view>
          <view class="w50">
            提交时间
            <view>{{ item.commitTime || '--' }}</view>
          </view>
        </view>
        <view v-if="userType==1?item.status == 1:item.shenAuditStatus==0 " class="func">
          <button @click="audit(item.id,'0')">拒绝</button>
          <button @click="audit(item.id,'1')">同意</button>
        </view>
        <!--        <view v-if="item.status==2" class="func">-->
        <!--          <button @click="handleDelete(item)">撤回</button>-->
        <!--        </view>-->
      </view>
    </view>
    <view v-if="list.length==0" class="nodata">
      <image :src="config.baseUrl_api + '/fs/static/nodata.png'" mode="aspectFit"></image>
      <text>暂无数据</text>
    </view>
  </view>
</template>

<script setup>
import * as api from '@/common/api.js'
import config from '@/config.js'
import {
  ref
} from 'vue'
import {
  onLoad,
  onShow
} from '@dcloudio/uni-app'
import {changeLevelShenAudit} from "@/common/api.js";

const app = getApp();
const queryParams = ref({
  code: '',
  // shenAuditStatus: 0
})
const list = ref([])
const statistical = ref({
  personCount: 0
})
const total = ref(0)
const userType = ref(2)

onShow(() => {
  userType.value = app.globalData.userType
  
  getList()
})

function getList() {
  uni.showLoading({
    title: '加载中'
  })
  statistical.value.personCount = 0
  api.getChangelevelList(queryParams.value).then(res => {
    list.value = res.rows
    list.value.forEach(item => {
      statistical.value.personCount += (item.count * 1)
    })
    total.value = res.total
    uni.hideLoading()
  })
}

function goDetail(item) {
  let path = `/personalVip/changeLevelDetail?rangeId=${item.id}`
  uni.navigateTo({
    url: path
  });
}

function handleDelete(row) {
  uni.showModal({
    title: '提示',
    content: `确定撤回吗`,
    success: function (res) {
      if (res.confirm) {
        api.changeLevelWithDraw([row.id]).then(Response => {
          uni.showToast({
            icon: "none",
            title: '撤回成功！'
          })
          getList()
        })
      }
    }
  })
}

function audit(id, flag) {
  if (flag == 0) {
    // 拒绝
    // 弹出框填写理由
    uni.showModal({
      title: '请输入拒绝理由',
      editable: true,
      success: function (res) {
        if (res.confirm) {
          if (!res.content) {
            uni.showToast({
              title: '请输入拒绝理由',
              icon: 'none'
            })
          } else {
            doApproval(id, flag, res.content)
          }
        }
      }
    })
  } else if (flag == '1') {
    // 二次确认
    uni.showModal({
      title: '提示',
      content: `确定审批通过吗`,
      success: function (res) {
        if (res.confirm) {
          doApproval(id, flag)
        }
      }
    })
  }
}

async function doApproval(id, flag, reason) {
  let obj = {
    flag: flag,
    reason: reason || '',
    ids: [id]
  }
  console.log(obj)
  uni.showLoading({
    title: '加载中'
  })
  if (userType.value == 1) {
    await api.changeLevelAudit(obj)
  } else {
    await api.changeLevelShenAudit(obj)
  }
  uni.hideLoading()
  uni.showToast({
    title: '操作成功',
    icon: 'none'
  })
  getList()
  
}
</script>

<style lang='scss' scoped>
.searchbar {
  display: flex;
  align-items: center;
  padding: 25rpx;
  box-sizing: border-box;
  
  :deep(.uni-easyinput .uni-easyinput__content) {
    border-radius: 35rpx;
    border: none;
    height: 70rpx;
  }
  
  :deep(.uni-easyinput__content-input) {
    font-size: 26rpx;
  }
  
  .invertedbtn-red {
    border-radius: 50px;
    background-color: #fff;
    
    font-size: 30rpx;
    padding: 10rpx 20rpx;
  }
}
</style>