Project-Annex/operationSupport/src/views/communityoperation/advertisingManagement/setpPage/details.vue

<template>
    <div class="formContent">
        <div class="formContent-item_title">广告信息</div>
        <div class="formLabelList">
            <div class="label">广告名称：</div>
            <div class="text">{{ formData.name }}</div>
        </div>
        <div class="formLabelList">
            <div class="label">主题图片：</div>
            <div class="text">
                <el-image :src="formData.cover" fit="cover"> </el-image>
            </div>
        </div>
        <div class="formLabelList">
            <div class="label">广告链接：</div>
            <div class="text">{{ formData.link }}</div>
        </div>
        <div class="formContent-item_title">投放对象</div>
        <div class="formLabelList">
            <div class="label">投放小区：</div>
            <div class="text">{{ formData.communityNames }}</div>
        </div>
        <div class="formContent-item_title">投放时间</div>
        <div class="formLabelList">
            <div class="label">投放日期：</div>
            <div class="text">{{ formData.startTime || '--' }} 至 {{ formData.endTime || '--' }}</div>
        </div>
    </div>
</template>
<script>
export default {
    props: ['params'],
    data() {
        return {
            formData: {}
        };
    },
    methods: {
        getData(id) {
            this.$http.get(`/sc-community/advertising/find/${id}`).then(({ status, msg, data }) => {
                if (status == 0) {
                    this.formData = data;
                } else {
                    this.$message.error(msg);
                }
            });
        }
    },
    created() {
        this.getData(this.params.id);
    }
};
</script>
<style lang="scss" scoped>
@import '@assets/css/public-style.scss';
.formContent {
    .formLabelList {
        display: flex;
        line-height: rem(30);
        margin-bottom: rem(25);
        .label {
            width: rem(80);
        }
        .text {
            .el-image {
                width: rem(540);
                height: rem(270);
            }
        }
    }
}
</style>