<template>
  <div>
    <div>
    <a-radio-group v-model:value="size" @change="redioChange">
      <a-radio-button value="large">全部</a-radio-button>
      <a-radio-button value="middle">未配置</a-radio-button>
      <a-radio-button value="small">已配置</a-radio-button>
    </a-radio-group>
    <a-button value="small" style="margin-left:20px"  preIcon="ant-design:plus-outlined" @click="handleAddAct">控制活动</a-button>
    <a-button value="small" style="margin-left:20px"  preIcon="ant-design:plus-outlined" @click="handleAddActCollect">控制活动集合</a-button>
    <span style="position: absolute;right: 26px;">还有{{nConfigCount}}项未配置</span>
    </div>
    <BasicTable @register="registerTable" :rowSelection="rowSelection" @fetch-success="fetchCallBack">
        <!-- update-begin-author:taoyan date:2022-5-25 for: VUEN-1112一对多 用户选择 未显示选择条数，及清空 -->
        <template #tableTitle></template>
        <template #action="{ record }">
          <TableAction :actions="getTableAction(record)" :dropDownActions="getDropDownAction(record)"/>
        </template>
        <!-- update-end-author:taoyan date:2022-5-25 for: VUEN-1112一对多 用户选择 未显示选择条数，及清空 -->
    </BasicTable>
    <StProjectCheckModal @register="registerModal" @success="handleSuccess"></StProjectCheckModal>
    <StCaMainRelCollectionProjectModal @register="registerRelModal" @success="handleActSuccess"></StCaMainRelCollectionProjectModal>
    <StCaMainCollectionSelect @register="registerActCollectModal" @success="handleActCollectSuccess"></StCaMainCollectionSelect>
  </div>
</template>
<script setup>
import { ref } from 'vue';
import { checklist, queryNoCheckCount,deleteProjectCheck,addBatchProjectCheck,addByActCollenct} from '../../StProjectConfig.api';
import StProjectCheckModal from './StProjectCheckModal.vue';
import { useModal } from '/@/components/Modal';
import { BasicTable, TableAction } from '/@/components/Table';
import { useListPage } from '/@/hooks/system/useListPage';
import StCaMainRelCollectionProjectModal from '/@/views/standardlib/controlactivity/components/StCaMainRelCollectionProjectModal.vue';
import StCaMainCollectionSelect from '/@/views/standardlib/controlactivity/components/StCaMainCollectionSelect.vue';

const [registerModal, {openModal}] = useModal();
const [registerRelModal, {openModal:openActModal}] = useModal();
const [registerActCollectModal, {openModal:openActCollectModal}] = useModal();
const props = defineProps({
  projectCreId: '',
});
const nConfigCount = ref(0)
const size = ref('large')
const columns = [
 {
  title: '控制活动',
  align:"left",
  dataIndex: 'caName'
 },
 {
  title: '检查内容',
  align:"left",
  dataIndex: 'checkContent',
  customRender:({text}) =>{
      return !text?"-":text
    },
 },
 {
  title: '配置状态',
  align:"left",
  dataIndex: 'configStatus',
  customRender:({text}) =>{
      return '1'==text?"已配置":'未配置'
    },
 }
];
const { prefixCls,tableContext,onExportXls,onImportXls } = useListPage({
    tableProps:{
         title: '',
         api: checklist,
         columns,
         canResize:false,
         useSearchForm: false,
         showIndexColumn: false,
         scroll: { x: false,y:250 },
         actionColumn: {
             width: 160
          },
          showTableSetting: false,
          beforeFetch(params) {
              params = Object.assign(params,{ column: 'caNo', order: 'desc',projectCreId:props.projectCreId})
            },
    },
})
const [registerTable, {setProps,reload},{ rowSelection, selectedRowKeys }] = tableContext
function handleEdit(record) {
     openModal(true, {
       record,
       isUpdate: true,
       showFooter: true,
     });
}
function fetchCallBack(data){
  queryNoCheckCount({projectCreId:props.projectCreId}).then(rep=>{
    console.log("计算为配置项")
    console.log(rep)
    nConfigCount.value = rep
  })
}
function redioChange(e){
  let key = e.target.value
  if(key == 'large'){
    setProps({searchInfo:{configStatus:''}});
  }else if(key == 'middle'){
    setProps({searchInfo:{configStatus:'0'}});
  }else if(key == 'small'){
    setProps({searchInfo:{configStatus:'1'}});
  }
  reload()
}
function handleSuccess(){
  reload()
}
function getTableAction(record){
    return [
    {
      label: '配置',
      onClick: handleEdit.bind(null, record),
    },
    {
      label: '删除',
      onClick: handleDelete.bind(null, record),
    },
  ]
}
function getDropDownAction(record){
       return [
         
       ]
}

function searchByProjectCreId(data){
    // console.log('-调用-')
    // console.log(ids)
    setProps({searchInfo:data});
    reload()
  }


 function handleDelete(record) {
    deleteProjectCheck({id:record.id})
    reload()
}

function handleAddAct() {
  openActModal(true, {
      projectCreId:props.projectCreId,
      isUpdate: false,
      showFooter: true,
  });
}

function handleAddActCollect() {
  openActCollectModal(true, {
        isUpdate: false,
        showFooter: true,
    });
  }

async function handleActSuccess(caNos){
  let parma={}
  parma['projectCreId'] = props.projectCreId
  parma["canos"] = caNos
  parma["configStatus"] = "0"
  await addBatchProjectCheck(parma,function(){
    reload()
  })
}

async function handleActCollectSuccess(cnos) {
  let parma={}
  parma['projectCreId'] = props.projectCreId
  parma["cnos"] = cnos
  parma["configStatus"] = "0"
  await addByActCollenct(parma,function(){
    reload()
  })

}

defineExpose({searchByProjectCreId})
</script>