update 调整大屏各个模块参数及样式

2024-05-16 15:53:04 +08:00
parent adca7ae65e
commit 45aec85fad
12 changed files with 238 additions and 89 deletions
@@ -0,0 +1,119 @@
+<template>
+    <Dialog :openVis="visible" width="50%" :title="title" @close="closeDialog" :maskClosable="false">
+        <template #container>
+            <div v-if="useForm" class="form-container">
+                <Form :model="formRecord" :label-width="100" v-bind="formItemLayout">
+                    <a-form-item label="性别">
+                        <a-select v-model:value="formRecord.sex" placeholder="请选择" :options="sexTypeList"></a-select>
+                    </a-form-item>
+                </Form>
+            </div>
+            <BasicTable
+                ref="registerTable"
+                class="table-container"
+                :key="visible"
+                :columns="columns"
+                :api="getPhoneList"
+                :apiParams="formState"
+            ></BasicTable>
+        </template>
+    </Dialog>
+</template>
+<script setup lang="ts">
+    import { computed, nextTick, ref, watch } from 'vue';
+    import Dialog from '/@/components/dialog/Dialog.vue';
+    import { useDialog } from '/@/views/components/dialogHooks.ts';
+    import BasicTable from '/@/components/secondaryScreen/secondMap/components/basicTable/BasicTable.vue';
+    import { Form } from 'ant-design-vue';
+    import { SexType, sexTypeList } from '/@/utils/settings.ts';
+    import { getPhoneList } from '/@/views/yinChuan/yinChuan.api.ts';
+
+    const props = defineProps({
+        record: Object,
+        title: String,
+        useForm: Boolean,
+        labelCol: Object,
+        wrapperCol: Object,
+        setting: Object,
+        phoneType: String,
+    });
+    const formItemLayout = {
+        labelCol: {
+            style: { width: '100px' },
+            ...props.labelCol,
+        },
+        wrapperCol: {
+            span: 6,
+            ...props.wrapperCol,
+        },
+    };
+
+    const columns = [
+        {
+            title: '姓名',
+            dataIndex: 'realName',
+            key: 'realName',
+        },
+        {
+            title: '单位',
+            dataIndex: 'departName',
+            key: 'departName',
+        },
+        {
+            title: '部门',
+            dataIndex: 'orgName',
+            key: 'orgName',
+        },
+        {
+            title: '性别',
+            dataIndex: 'sex_dictText',
+            key: 'sex_dictText',
+        },
+        {
+            title: '时间',
+            dataIndex: 'time',
+            key: 'time',
+        },
+        {
+            title: '电话',
+            dataIndex: 'phone',
+            key: 'phone',
+        },
+    ];
+    const formRecord = ref({
+        sex: SexType.all,
+    });
+    const formState = computed(() => ({
+        ...formRecord.value,
+        dataType: props.setting.dataType,
+        phoneType: props.phoneType,
+        showType: '0',
+    }));
+    const { visible, title, closeDialog, openDialog } = useDialog({ title: props.title });
+    const registerTable = ref();
+    watch(
+        props,
+        () => {
+            registerTable.value?.getRecords();
+        }
+        // {
+        //     immediate: true,
+        // }
+    );
+    defineExpose({
+        openDialog,
+    });
+</script>
+<style scoped lang="less">
+    .form-container {
+        margin: 10px 0;
+    }
+
+    .table-container {
+        margin: 0 10px;
+    }
+
+    :deep(.ant-form-item-label) > label {
+        color: #fff;
+    }
+</style>