<template>
 <div class="h100">
   <common-layout
     ref="layoutRef"
     :table-attrs="{
     'has-operation':true
     }"
     :form-attrs="{
     spanAttrs: {
       span:5
     }
     }"
     :filter-form="processStateTableHomeFilterForm"
     :get-table-list="getTableList"
     :table-header="processStateTableHomeTableHeader"
   >
     <template #DATASOURCE_TYPE="{data}">
       {{getType(data.DATASOURCE_TYPE)}}
     </template>
     <template #DATASOURCE_UNIT_STATUS="{data}">
       <span :class="{error:+data.DATASOURCE_UNIT_STATUS === 2}">{{getStatus(data.DATASOURCE_UNIT_STATUS)}}</span>
     </template>
     <template #addBtn>
       <el-button type="primary" :icon="Plus" @click="openAddModel">新增</el-button>
     </template>
     <template #operation="{data}">
       <el-button type="info" @click="$emit('changeOperation','detail',data)">详情</el-button>
       <el-button type="info" @click="$emit('changeOperation','edit',data)">编辑</el-button>
       <el-button type="info" @click="deleteData(data)">删除</el-button>
     </template>
   </common-layout>
   <template v-if="isAddChooceSerivceDialogIsShow">
     <add-chooce-service-dialog @changeOperation="toDetail" v-model:dialog-visible="isAddChooceSerivceDialogIsShow" />
   </template>
 </div>
</template>

<script>
import CommonLayout from "@/components/CommonLayout.vue";
import {ref} from "vue";
import {processStateTableHomeFilterForm} from "@/data/all-forms";
import {processStateTableHomeTableHeader} from "@/data/all-table-header";
import {Plus} from "@element-plus/icons-vue";
import {deleteProcessTableHomeData, getProcessTableHomeTableData} from "@/service/data-gather-watch/process-table";
import {useActiveGetTableData, usePagination} from "@/unit/use-method/usePagination";
import {handleMes, showConfirm} from "@/unit/element-ui/tip";
import {deleteReportMb} from "@/service/zsk/report-mb";
import {editLoginState} from "@/service/show-platform";
import router from "@/router";
import AddChooceServiceDialog
  from "@/view/other/c-views/data-watch/data-gather-watch/process-table/AddChooceServiceDialog.vue";

export default {
  name: "ProcessTableHome",
  computed: {
    Plus() {
      return Plus
    }
  },
  components: {AddChooceServiceDialog, CommonLayout},
  setup(props,{emit}) {
    useActiveGetTableData(getTableList)
    function openAddModel(){
      // emit('changeOperation','add')
      isAddChooceSerivceDialogIsShow.value = true
    }
    function toDetail(op,item){
      isAddChooceSerivceDialogIsShow.value = false
      emit('changeOperation',op,item)
    }
    const layoutRef =ref(null)
    const isAddChooceSerivceDialogIsShow = ref(false)
   function deleteData(data){
     showConfirm(() => {
       deleteProcessTableHomeData(data.DATASOURCE_ID).then(res => {
         handleMes(res,() => {
           getTableList()
         },()=>{},'删除成功','删除失败')
       })

     },'确定要删除吗','系统提示',{
       confirmButtonText: "确定",
       cancelButtonText: "取消",
       type: "warning"
     })



   }
    function getType(field) {

        if (field == "0") {
          return "入库";
        } else if (field == "1") {
          return "出库";
        }

    }

    function getStatus(field) {
      if (field == "1") {
        return "正常";
      } else if (field == "2") {
        return "异常";
      } else if (field == "0") {
        return "未启用";
      }
    }
    function getTableList(){
      getProcessTableHomeTableData({
        pageIndex:layoutRef.value.pageIndex,
        pageSize:layoutRef.value.pageSize,
        dataSource_name:layoutRef.value.form.dataSource_name ||'',
        DataSource_type:layoutRef.value.form.DataSource_type || '',
        dataSource_status:layoutRef.value.form.dataSource_status || '',
      }).then(res => {
        layoutRef.value.getResData(res.msg[0].Rows||[],res.msg[0].TotalRowCount)

      })

    }
    return {
      layoutRef,
      getTableList,
      processStateTableHomeFilterForm,
      processStateTableHomeTableHeader,
      getType,
      getStatus,
      deleteData,
      isAddChooceSerivceDialogIsShow,
      openAddModel,
      toDetail
    }
  }
}
</script>

<style scoped lang="scss">
.error{
  color: #f00;
}
</style>
