admin/src/views/desk/wbs/edit-formula-dialog.vue

<template>
    <hc-dialog v-model="isShow" is-footer-center title=" 元素公式(WBS级)" widths="56rem" :loading="submitLoading" :footer="false" @close="dialogClose" @save="saveElementHandle">
        <hc-search-input v-model="queryValue" class="mb-4 w-100" @search="getEditEleList" />
        <hc-table :column="tableColumn" :datas="editEleList" :loading="tableLoading">
            <template #action="{ row, index }">
                <el-link type="warning">全局公式</el-link>
                <el-link type="primary">节点公式</el-link>
            </template>
        </hc-table>
    </hc-dialog>
</template>

<script setup>
import { ref, watch } from 'vue'
import mainApi from '~api/wbs/wbsforelement'
import { getArrValue } from 'js-fast-way'
const props = defineProps({
    tableId: {
        type: String,
        default: '',
    },
})
//事件
const emit = defineEmits(['close'])
//双向绑定
// eslint-disable-next-line no-undef
const isShow = defineModel('modelValue', {
    default: false,
})
//监听显示
watch(isShow, (val) => {
    if (val) {
        getEditEleList()
    } else {
        emit('close')
    }
})
const tableId = ref(props.tableId)

//监听数据
watch(
    () => [props.tableId],
    ([tid]) => {
        tableId.value = tid
    },
    { deep: true },
)
//关闭弹窗
const dialogClose = () => {
    isShow.value = false
    emit('close')
}
const submitLoading = ref(false)
const saveElementHandle = async () => {}
const tableColumn = [
    { key: 'eName', name: '元素名称' },
    { key: 'action', name: '操作', width: 150, align: 'center' },
]
const tableLoading = ref(false)
const editEleList = ref([])
const queryValue = ref('')

const getEditEleList = async () => {
    tableLoading.value = true
    const { data } = await mainApi.getTableElements({
        id: tableId.value,
        search: queryValue.value,
        type: 1,
    })
    tableLoading.value = false
    editEleList.value = getArrValue(data)
}
</script>