<template>
  <div class="app-container">
    <div>
      <HyForm v-bind="searchFormConfig" v-model="searchFormData">
        <template #footer>
          <div class="handle-btns">
            <el-button icon="Refresh" @click="closeSearchFormData"
              >重置</el-button
            >
            <el-button type="primary" icon="Search" @click="getListData"
              >搜索</el-button
            >
          </div>
        </template>
      </HyForm>
    </div>

    <div>
      <JyTable
		ref="table"
        :loading="loading"
        v-bind="contentTableConfig"
        :rowKey="''"
        :listCount="listCount"
        :listData="dataList"
        v-model:page="pageInfo"
        @update:page="getListData"
      > 

        <template #workordercode="scope">
          <a style="color: blue" @click="openCmodal(scope.row)">{{ scope.row['workordercode'] }}</a>
        </template>
  
        <template #handler="scope"> 
            <el-button v-if="checkPermi(['workOrderManagement:deferredReview:tongGuo'])" type="primary" text size="small" @click="tongGuoFn('','通过' , scope.row)" >通过</el-button>
            <el-button v-if="checkPermi(['workOrderManagement:deferredReview:boHui'])" type="primary" text size="small" @click=" yuanYinDis = true" >驳回</el-button> 
        </template>
      </JyTable>
    </div>

    <!-- 弹出框 -->
    <div> 
		<!-- 原因 -->
		<reasonModal  
			v-model:dialogVisible="yuanYinDis" 
			@submit="tongGuoFn($event , '驳回' )"
		></reasonModal> 
    </div>
  </div>
</template>

<script setup name="WorkOrderList">
import { ref, getCurrentInstance } from 'vue'

import HyForm from '@/base-ui/form'
import JyTable from '@/base-ui/table'
import JyForm from '@/base-ui/form'
import { searchFormConfig } from './config/search.config'
import { contentTableConfig } from './config/content.config'
import { modalConfig } from './config/modal.config'
import { Link, User, Search } from '@element-plus/icons-vue'
import { getToken } from '@/utils/auth'
import { useRouter } from 'vue-router'
import { tagTypeFn } from '@/utils/index'


const router = useRouter();

import addOrder from '@/components/workOrder/add-order/add-order'
import handle from '@/components/workOrder/handle'
import reassignment from '@/components/workOrder/reassignment'
import reasonModal from '@/components/workOrder/reasonModal'

import {
  getPageListData,
  deletePageData,
  createPageData,
  editPageData
} from '@/api/main/system/system'

import { checkPermi } from "@/utils/permission";
  
const { proxy } = getCurrentInstance()

// 表格的ref
const table = ref(''); 

// 搜索数据
const searchFormData = ref({}) 

// 表格数据
const dataList = ref([])
// 表格loading
const loading = ref(false)

// 分页数据
const pageInfo = ref({ currentPage: 1, pageSize: 10 })
const listCount = ref(0)
   
// 原因弹出框
const yuanYinDis = ref(false)
  
// 重置搜索框
function closeSearchFormData() {
  searchFormData.value = {}
  getListData()
}

// 获取列表
const getListData = (() => {
  return (function fn(page) {
    dataList.value = []
    loading.value = true

    let params = {
      ...searchFormData.value,
      pageNum: page?.currentPage || pageInfo.value.currentPage,
      pageSize: page?.pageSize || pageInfo.value.pageSize,
	  listType : 8
    }
    getPageListData('/order/workorder', params).then(({ data, total }) => {
      dataList.value = data
      listCount.value = total
      loading.value = false
    })
    return fn
  })()
})()

// 处理弹出框
function openCmodal(rowData) { 
	let query = {
		workordercode : rowData.workordercode,
		type : 'yqsh'
	}

	sessionStorage.setItem('workQuery', JSON.stringify(query)) 
	router.push({ path : '/workHandle' })
} 


// 审核通过
function tongGuoFn( data , type , rowData = {} ){  
	createPageData('/order/workorder/delayaudit' , {
		delayId  : rowData.delayaudit || table.value.rowData.delayaudit ,
		result : type ,
		opinion : data ,
	}).then((data)=>{
		if(data.state === 'success'){
			proxy.$modal.msgSuccess(data.message)	
		}else{
			proxy.$modal.msgError(data.message)	
		}
		getListData()
	})
}


</script>

<style scoped lang="scss">
.header {
  color: red;
}

.handle-btns {
  text-align: right;
  padding: 0 15px 20px 0;
}

.czButt {
  button {
    margin: 0;
  }
}
</style>
