<script setup>
import {reportPage,recessedData} from '@/api/entryWindow/index'
import useCatchStore from "@/stores/modules/catch";
import {listPolice} from "@/api/system/police";
import {timeFormat} from "@/utils/util";
import useUserStore from "@/stores/modules/user";
import {FlowNodeEnum} from "@/enums/flowEnums";
import feedback from "@/utils/feedback";
import {getEntryWindowRecord} from '@/api/report/flow';
const catchStore = useCatchStore();
const userStore = useUserStore();
const uid = userStore.user.userName;
const dict = catchStore.getDicts(["procurementMethod"]);
const tableData = ref([])
const ressDialog =ref(false)
let query = ref({
  current: 1,
  size: 10,
  code:'all'
})
let showRecord =ref(false)
let total = ref(10)
let loading =ref(false)
let polices = ref([])
//审核人
const policeQuery = ref({
  current: 1,
  departBranch: true
});

const recessedForm =ref({
  id:null,
  message:null
})

//退窗进窗方法
const recessedShowFun = async (row,val)=>{
  recessedForm.value.id = row.id;
  //判断退窗进窗
  if(val== 1){
    //进窗
    await feedback.confirm("确定要重新进窗吗？");
    await recessedDataFun()
  }else{
    //退窗
    await feedback.confirm("确定要退窗吗？");
    ressDialog.value=true;
  }

}

const ressDialogClose = ()=>{
  ressDialog.value=false;
  recessedForm.value={
    id:null,
    message:null
  }
}

//打开弹窗
const recordTable =ref();
const  recordLoading =ref(false);
const recordFun = async (row)=>{
  recordLoading.value=true;
  try{
    showRecord.value=true;
    recordTable.value = await  getEntryWindowRecord({id:row.id});
  }catch (e){
    console.log('e',e)
  }finally {
    recordLoading.value=false;
  }


}

//关闭弹窗
const showRecordClose = ()=>{
  showRecord.value=false
}


const handleClick =(val)=>{
  query.value.code=val.props.name;
  getList()
}

const recessedDataFun = async()=>{
  //打开弹窗
 const res = await recessedData(recessedForm.value)
  getList()
  ressDialog.value=false
}
function getPoliceList() {
  listPolice(policeQuery.value).then((data) => {
    polices.value = data.records;
  });
}

getPoliceList()
//根据输入值获取信息
const inputGetList = (val) => {
  query.value.name = val;
  getPoliceList()
}
//查询数据
const getList =async ()=>{
  loading.value=true
  const res = await  reportPage(query.value)
  tableData.value=res.records
  total.value=res.total
  loading.value=false
}
//重置
const reset =()=>{
  query.value = {
    current: 1,
    size: 10,
  };
  getList();
}
getList()

//查看详情
const router = useRouter();
const getDetail =(row,code)=>{
  debugger
  //判断是否为报审人
  let query ={
    isEnd:row.reportType == "结算项目",
    id:row.id,
    backPath:'/entryWindow'
  }
  if(code){
    if(code === 'audit'){
      query.isAudit = true
    }
    else if(code === 'edit' ){
      query.isEdit = true
      query.node = row.node
    }
  }
  else{
    query.node = row.node
    query.disabledVal=true;
  }
  if (row.node=='initial'){
    delete query.disabledVal;
  }
  router.push({
    path:`/report/edit/controlPrice`,
    query: query
  });
}

const isAdminShow = ()=>{
  debugger
  if(userStore.user && userStore.user.roleCodes){
   return  userStore.user.roleCodes.indexOf('admin_1') >= 0
  }else{
    return true;
  }
}
</script>

<template>
  <div class="container">
    <header class="mb-20">
      <el-form :label-width="150">
        <el-row>
          <el-col :span="6">
            <el-form-item label="报审类型" prop="reportType">
              <el-select  v-model="query.reportType" clearable>
                <el-option value="项目控制价" label="项目控制价"></el-option>
                <el-option value="结算项目" label="结算项目"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="项目名称" prop="reportName">
              <el-input  v-model="query.reportName"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="项目类别" prop="projectType">
              <el-select  v-model="query.projectType" clearable>
                <el-option value="服务类" label="服务类"></el-option>
                <el-option value="工程类" label="工程类"></el-option>
                <el-option value="货物类" label="货物类"></el-option>
                <el-option value="信息化类" label="信息化类"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="审计单位" prop="auditUnitId">
              <depart-tree-select  v-model="query.auditUnitId" :size="'default'" placeholder="" clearable/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="6">
            <el-form-item label="项目单位" prop="projectUnitId">
              <depart-tree-select  v-model="query.projectUnitId" :size="'default'" placeholder="" clearable/>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="项目负责人" prop="projectPrincipal">
              <el-input  v-model="query.projectPrincipal"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6" >
            <el-form-item label="负责人联系方式" prop="projectPhone">
              <el-input  v-model="query.projectPhone"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6" >
            <el-form-item  label="报审金额（元）" prop="reportMoney">
              <el-input  type="number" v-model="query.reportMoney"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="6">
            <el-form-item label="采购方式" prop="purchaseMethod">
              <el-select v-model="query.purchaseMethod" clearable>
                <el-option v-for="(item,index) in dict.procurementMethod"  :key="index"
                           :label="item.dictLabel"
                           :value="item.dictValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item  label="立项日期" prop="projectApprovalTime">
              <el-date-picker
                  v-model="query.projectApprovalTime"
                  style="width: 100%"
                  type="daterange"
                  range-separator="-"
                  start-placeholder="开始服务日期"
                  end-placeholder="结束服务日期"
                  placeholder="选择立项日期"
                  clearable
              />
            </el-form-item>
          </el-col>
          <el-col :span="6" >
            <el-form-item label="报审金额（元）" prop="reportMoney">
              <el-input  type="number" v-model="query.reportMoney"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6" >
            <el-form-item label="立项金额（元）" prop="projectApprovalMoney">
              <el-input  type="number" v-model="query.projectApprovalMoney" clearable></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="6">
            <el-form-item label="报审日期" prop="applicantTime">
              <el-date-picker
                  v-model="query.applicantTime"
                  style="width: 100%"
                  type="daterange"
                  range-separator="-"
                  start-placeholder="开始服务日期"
                  end-placeholder="结束服务日期"
                  placeholder="选择报审日期"
                  clearable
              />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="报审人" prop="applicant">
              <!--                <el-input  v-model="query.applicant"></el-input>-->
              <el-select  v-model="query.applicantId" remote   filterable  :remote-method="inputGetList" clearable >
                <el-option v-for="(item,index) in polices"  :key="index" :value="item.id" :label="item.name"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6" >
            <el-form-item label="申报政府采购日期" prop="applyGovernmentTime">
              <el-date-picker
                  v-model="query.applyGovernmentTime"
                  style="width: 100%"
                  type="daterange"
                  range-separator="-"
                  start-placeholder="开始服务日期"
                  end-placeholder="结束服务日期"
                  placeholder="选择申报政府采购日期"
                  clearable
              />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="采购日期" prop="purchaseTime">
              <el-date-picker
                  v-model="query.purchaseTime"
                  style="width: 100%"
                  type="daterange"
                  range-separator="-"
                  start-placeholder="开始服务日期"
                  end-placeholder="结束服务日期"
                  placeholder="选择采购日期"
                  clearable
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="6">
            <el-form-item label="合同签订日期" prop="contractTime">
              <el-date-picker
                  v-model="query.contractTime"
                  style="width: 100%"
                  type="daterange"
                  range-separator="-"
                  start-placeholder="开始服务日期"
                  end-placeholder="结束服务日期"
                  placeholder="选择报合同签订日期"
                  clearable
              />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="合同金额" prop="contractMount">
              <el-input  type="number" v-model="query.contractMount"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="服务单位" prop="serviceUnit">
              <el-input v-model="query.serviceUnit"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="服务日期" prop="serviceTime">
              <el-date-picker
                  ref="datePicker"
                  clearable
                  v-model="query.serviceTime"
                  type="daterange"
                  range-separator="-"
                  start-placeholder="开始服务日期"
                  end-placeholder="结束服务日期"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div class="flex end">
        <div>
          <el-button type="primary" @click="getList">
            <template #icon>
              <icon name="el-icon-Search"/>
            </template>
            查询
          </el-button
          >
          <el-button @click="reset">重置</el-button>
        </div>
      </div>
    </header>
    <div class="table-container">
      <el-tabs v-model="query.code" @tab-click="handleClick">
        <el-tab-pane label="全部" name="all"></el-tab-pane>
        <el-tab-pane label="进窗" name="0"></el-tab-pane>
        <el-tab-pane label="退窗" name="1"></el-tab-pane>
      </el-tabs>
      <el-table :data="tableData" v-loading="loading">
        <el-table-column label="项目名称" prop="reportName" width="200" />
        <el-table-column
            label="报审类型"
            prop="reportType"
            show-overflow-tooltip
            width="100"
        />
        <el-table-column
            label="项目类别"
            prop="projectType"
            align="center"
            width="100"
        />
        <el-table-column label="状态" align="center"
            width="90">
          <template #default="{row}">
            <el-tag :type="row.isRecessed == 0? 'primary':'danger'">{{row.isRecessed== 0 ?'进窗':'退窗' }}</el-tag>
          </template>
        </el-table-column>
        <el-table-column
          label="当前环节"
          prop="node"
          align="center"
          width="120"
        >
          <template #default="{row}">
            <el-tag>{{FlowNodeEnum[row.node]}}</el-tag>
          </template>
        </el-table-column>
        <el-table-column
            label="审计单位"
            prop="auditUnitStr"
            show-overflow-tooltip
            min-width="100"
        />
        <el-table-column
            label="项目单位"
            prop="projectUnitStr"
            show-overflow-tooltip
            min-width="100"
        />
        <el-table-column
            label="项目负责人"
            prop="projectPrincipal"
            width="130"
        />
        <el-table-column
            label="项目负责人联系方式"
            prop="projectPhone"
            width="190"
        >
        </el-table-column>
        <el-table-column
            label="采购方式"
            prop="purchaseMethod"
            align="center"
            width="110"
        />
        <el-table-column
            label="报审金额"
            prop="reportMoney"
            width="120"
        />
        <el-table-column
            label="报审日期"
            prop="applicantTime"
            width="120"
        >
          <template #default="{row}">
            {{timeFormat(row.applicantTime)}}
          </template>
        </el-table-column>
        <el-table-column
            label="立项金额"
            prop="projectApprovalMoney"
            width="120"
        />
        <el-table-column
            label="立项日期"
            prop="projectApprovalTime"
            width="120"
        >
          <template #default="{row}">
            {{timeFormat(row.projectApprovalTime)}}
          </template>
        </el-table-column>
        <el-table-column label="操作" fixed="right" min-width="260px">
          <template #default="{ row }">
            <el-button
                link
                type="primary"
                v-if="row.deleteFlag == 1"
                @click="getDetail(row)"
            >详情</el-button>

            <!-- 未删除：显示正常操作 -->
            <template v-else>
            <el-button link type="primary" v-if="row.applicantId === uid && row.isRecessed == 1" @click="getDetail(row,'edit')">编辑</el-button>
<!--            <el-button link type="primary" v-else-if="row.flowUserId === uid" @click="getDetail(row,'audit')">审批</el-button>-->
            <el-button link type="primary" v-else @click="getDetail(row)">详情</el-button>
            <el-button link type="danger"  v-if="isAdminShow() && row.isRecessed == 0" @click="recessedShowFun(row,0)"> 退窗</el-button>
            <el-button link type="primary" v-if="(isAdminShow() || row.applicantId === uid) && row.isRecessed == 1"  @click="recessedShowFun(row,1)">重新进窗</el-button>
            <el-button link type="primary" @click="recordFun(row)">进退窗记录</el-button>
            </template>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div class="flex end mt-8">
      <el-pagination
          @size-change="getList"
          @current-change="getList"
          :page-sizes="[10, 20, 50]"
          v-model:page-size="query.size"
          v-model:current-page="query.current"
          layout="total, sizes, prev, pager, next"
          :total="total"
      >
      </el-pagination>
    </div>
    <p>
      列表根据权限范围，展示涉及的进退窗项目，可在此列表退窗、重新进窗、查看项目进退窗记录。
    </p>
    <el-dialog v-model="ressDialog" title="退窗意见" destroy-on-close @close="ressDialogClose">
     <el-form>
       <row>
         <el-col :span="24">
          <el-form-item label="退窗意见">
            <el-input :rows="10" type="textarea" v-model="recessedForm.message"></el-input>
          </el-form-item>
         </el-col>
       </row>
     </el-form>
      <footer class="flex end">
        <el-button @click="recessedDataFun" type="primary">确认</el-button>
        <el-button @click="ressDialog = false" >关闭</el-button>
      </footer>
    </el-dialog>

    <el-dialog v-model="showRecord" title="进退窗记录" destroy-on-close @close="showRecordClose">
      <el-table :data="recordTable" v-loading="recordLoading">
        <el-table-column prop="node" label="环节"></el-table-column>
        <el-table-column prop="message" label="内容" show-overflow-tooltip></el-table-column>
        <el-table-column prop="recipient" label="操作人"></el-table-column>
        <el-table-column prop="crtTime" label="操作时间">
          <template #default="{row}">
            {{timeFormat(row.crtTime)}}
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>
  </div>
</template>

<style scoped lang="scss">

</style>
