auth-web/src/pages/data-auth-module/property-management/user-management/detail.vue

<!--
 * @Author: Liugh
 * @Date: 2021-05-17 16:22:06
 * @LastEditTime: 2021-05-18 09:47:22
 * @LastEditors: Do not edit
 * @Description: 
-->
<template>
    <main class="user-attributes-detail">
        <el-form ref="ruleForm" :model="data" label-width="120px">
            <el-row>
                <el-col :span="12" v-for="(item, index) in typeData[infoType]" :key="index">
                    <el-form-item :label="item.label">
                        <span>{{ data[item.value] }}</span>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <Table
            ref="myTable"
            :url="tableUrl"
            :headerData="UserTableData"
            :condition="reportForm"
            v-if="infoType == 'jy'"
        />
    </main>
</template>

<script>
import Table from "@/pages/common/table";
import { UserTableData, typeData } from "../DataConfig";
import * as dynamicManageApi from "@/api/dynamic-manage";
export default {
    name: "user-attributes-detail", // 组件名称
    props: {
        // 接收父组件的数据
        infoType: {
            type: [String, Number],
            default: "jy"
        },
        data: {
            type: Object,
            default() {
                return {
                    name: "测试数据中",
                    sex: "测试数据中",
                    idCard: "测试数据中",
                    province: "测试数据中",
                    number: "测试数据中",
                    typePersonnel: "测试数据中",
                    rank: "测试数据中",
                    categoryPersonnel: "测试数据中",
                    businessDomain: "测试数据中",
                    policeClassification: "测试数据中"
                };
            }
        }
    },
    data() {
        // 组件内部参数
        return {
            // 参数名称及默认值
            UserTableData,
            typeData,
            tableUrl: dynamicManageApi.tableUrl,
            reportForm: {}
        };
    },
    computed: {}, // 计算属性
    watch: {}, // 侦听器（扩展的计算属性）
    components: { Table }, // 注册局部组件
    methods: {}, // 内部方法
    beforeCreate() {}, // 组件创建前
    created() {}, // 组件创建完成后
    beforeMount() {}, // 组件挂载前
    mounted() {}, // 组件挂载完成后
    beforeUpdate() {}, // 组件更新前
    updated() {}, // 组件挂载完成后
    beforeDestroy() {}, // 组件销毁前
    destroyed() {} // 组件销毁完成后
};
</script>
<style lang="scss" scoped></style>