<template>
    <el-drawer v-model="showMap" size="70%">
        <el-button type="primary" size="small" icon="plus" @click="addMap" style="margin-bottom: 20px;">添加</el-button>
        <el-table :data="mapData" v-loading="loading" border stripe>
            <el-table-column v-for="(item, index) in tableList" :key="index" :label="item.lable" :prop="item.prop"
                :width="item.width" align="center" />
            <el-table-column label="是否是分录字段" prop="isEntryField" align="center" width="130">
                <template #default="scope">
                    <el-tag v-if="scope.row.isEntryField + '' === 'true'" type="success">是</el-tag>
                    <el-tag v-else type="info">否</el-tag>
                </template>
            </el-table-column>
            <el-table-column label="操作" align="center" fixed="right" width="120">
                <template #default="scope">
                    <el-button type="primary" link size="small" @click="editMap(scope.row)">编辑</el-button>
                    <el-divider direction="vertical" />
                    <el-button type="danger" link size="small" @click="delMap(scope.row.id)">删除</el-button>
                </template>
            </el-table-column>
        </el-table>
        <pagination :page-data="listQuery" :total="total" @size-change="sizeChange" @current-change="currentChange" />
    </el-drawer>

    <new-map ref="newMapRef" @init-map="init" />
</template>

<script setup lang='ts'>
import { ref } from 'vue'
import { getMapList, deleteMap } from '@/services/api/configMap'
import { tableList } from './tableData/configMapTable'
import { ElMessageBox, ElMessage } from 'element-plus'
import newMap from './components/configMap/newMap.vue'
import pagination from '@/components/pagination/index.vue'

const showMap = ref(false)
const newMapRef = ref()

const listQuery = ref({
    kingdeeCommonConfigId: 0,
    pageNo: 1,
    pageSize: 10
})
const total = ref(0)
const mapData = ref()
const loading = ref(true)

const addMap = () => {
    newMapRef.value.dialogVisible = true
    newMapRef.value.fromData.kingdeeCommonConfigId = listQuery.value.kingdeeCommonConfigId
    newMapRef.value.title = '新增'
}

const editMap = (data: any) => {
    console.info("data", data.isEntryField)
    newMapRef.value.dialogVisible = true
    newMapRef.value.title = '编辑'
    if (data.isEntryField === 'true' || data.isEntryField === true) data.isEntryField = true
    else data.isEntryField = false
    newMapRef.value.fromData = data
    console.info("data", data)
}

let sizeChange = (val: number) => {
    listQuery.value.pageSize = val
    init()
}

let currentChange = (val: number) => {
    listQuery.value.pageNo = val
    init()
}

const delMap = (id: number) => {
    ElMessageBox.confirm(
        '确认删除?',
        '提示',
        {
            confirmButtonText: '确认',
            cancelButtonText: '取消',
            type: 'warning',
        }
    )
        .then(() => {
            deleteMap(id, listQuery.value.kingdeeCommonConfigId).then((res: any) => {
                if (res.code === 200) {
                    init()
                    ElMessage({
                        type: 'success',
                        message: '删除成功！',
                    })
                }
            })

        })
        .catch(() => { return })
}

const init = () => {
    getMapList(listQuery.value).then((res: any) => {
        console.info("res.data.records", res.data.records)
        if (res.code === 200) {
            mapData.value = res.data.records
            total.value = res.data.total
            loading.value = false
        }
    })
}

defineExpose({
    showMap,
    listQuery,
    init
})
</script>
 
<style lang = "scss" scoped>
</style>