<template>
    <div style="padding: 20px">
        <el-button type="primary" style="margin-bottom: 20px;" @click="showFieid">新增字段</el-button>
        <el-table :data="fieidData" border v-loading="loading" stripe>
            <el-table-column label="docType" prop="docType" align="center" />
            <el-table-column label="同步顺序" prop="paiXu" align="center" />
            <el-table-column label="单据唯一标识" prop="sFormId" align="center" />
            <el-table-column label="单据名称" prop="name" align="center">
                <template #default="scope">
                    {{ scope.row.name === '其他出库' || scope.row.name === '其他入库' ? scope.row.name + '单' : scope.row.name }}
                </template>
            </el-table-column>
            <el-table-column label="方向" prop="direction" align="center" />
            <el-table-column label="创建时间" prop="createTime" align="center" />
            <el-table-column label="操作" width="255" align="center">
                <template #default="scope">
                    <el-link :underline="false" type="primary" @click="showDetails(scope.row)">详情</el-link>
                    <el-divider direction="vertical" />
                    <el-link :underline="false" type="primary" @click="showMap(scope.row.id)">配置映射</el-link>
                    <el-divider direction="vertical" />
                    <el-link :underline="false" type="primary" @click="handleEdit(scope.row)">编辑</el-link>
                    <el-divider direction="vertical" />
                    <el-link :underline="false" type="danger" @click="handleDelete(scope.row.id)">删除
                    </el-link>
                </template>
            </el-table-column>
        </el-table>
        <el-pagination :current-page="currentPage" v-model:page-size="pageSize" :page-sizes="[10, 15, 20]"
            layout="->, total, sizes, prev, pager, next, jumper" :total="total" hide-on-single-page
            @size-change="handleSizeChange" @current-change="handleCurrentChange" style="margin-top: 20px;" />
    </div>
    <new-field ref="newFieldRef" @initCommonConfig="initCommonConfig" :currentPage="currentPage" :pageSize="pageSize" />
    <config-map ref="configMapRef" :kingdeeCommonConfigId="kingdeeCommonConfigId" />
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus';
import { getCommonConfig, deleteCommonConfig } from '@/services/api/systemApi/fieldConfiguration/commonConfig'
import newField from './components/fieldConfiguration/newField.vue';
import configMap from './configMap.vue'

const fieidData = ref()
const loading = ref(true)
const newFieldRef = ref()
const configMapRef = ref()
const currentPage = ref(1)
const pageSize = ref(10)
const total = ref(0)
const kingdeeCommonConfigId = ref() // 配置字段id
const platformProductRelationId: any = sessionStorage.getItem('platformProductRelationId') // 产品id

onMounted(() => {
    initCommonConfig(platformProductRelationId, currentPage.value, pageSize.value)
})

const handleSizeChange = (value: number) => {
    pageSize.value = value
    initCommonConfig(platformProductRelationId, currentPage.value, pageSize.value)
}

const handleCurrentChange = (value: number) => {
    currentPage.value = value
    initCommonConfig(platformProductRelationId, currentPage.value, pageSize.value)
}


const showFieid = () => {
    newFieldRef.value.fieldTitle = '新增场景'
    newFieldRef.value.updateCount = 0
    newFieldRef.value.drawerVisible = true
}

const handleEdit = (row: any) => {
    const data = Object.assign({}, row)
    newFieldRef.value.fieldTitle = '编辑场景'
    data.operation = '' + data.operation
    data.isAutoPerform = '' + data.isAutoPerform
    data.isInTransaction = '' + data.isInTransaction
    newFieldRef.value.fieidForm = data
    newFieldRef.value.updateCount = -1
    newFieldRef.value.drawerVisible = true
}
const showDetails = (row: any) => {
    const data = Object.assign({}, row)
    newFieldRef.value.fieldTitle = '详情'
    data.operation = '' + data.operation
    data.isInTransaction = '' + data.isInTransaction
    newFieldRef.value.fieidForm = data
    newFieldRef.value.disabled = true
    newFieldRef.value.drawerVisible = true
}

const showMap = (id: number) => {
    configMapRef.value.showMap = true
    configMapRef.value.listQuery.kingdeeCommonConfigId = id
    configMapRef.value.init()
}

const handleDelete = (id: number) => {
    ElMessageBox.confirm(
        '确定删除该字段?',
        '配置',
        { confirmButtonText: '确认', cancelButtonText: '取消', type: 'warning' })
        .then(() => {
            deleteCommonConfig(id).then((res: any) => {
                if (res.code === 200) {
                    initCommonConfig(platformProductRelationId, currentPage.value, pageSize.value)
                    ElMessage({ type: 'success', message: '删除成功' })
                }
            })
        })
}

// 通用配置列表数据 
const initCommonConfig = (id: number, pageNo?: number, pageSize?: number, name?: string) => {
    getCommonConfig(id, pageNo, pageSize, name).then((res: any) => {
        if (res.code === 200) {
            fieidData.value = res.data.records
            total.value = res.data.total
            loading.value = false
        }
    })
}

</script>

<style scoped>
</style>