EXEED_manage/src/views/QuestManage/_transformResult/index.vue

<template>
    <div class="main-content">
        <h3>title</h3>
        <h3 class="top-title" style="margin-top: 32px">传播数据</h3>
        <div class="top-number">
            <div class="top-number-item">
                <div class="title-style">总播放数</div>
                <div class="number-style">100000</div>
            </div>
        </div>
        <div class="bottom-list">
            <h3 class="top-title">传播数据</h3>
        </div>
    </div>
</template>

<script>
import {defineComponent, reactive, ref, getCurrentInstance} from 'vue'
export default defineComponent({
    name: 'v-transformResult',
    setup() {
        const activeId = reactive({
            value: 0
        });
        const transformData = reactive({
            taskTitle: '',
        });
        const transformList = ref([]);
        const { proxy } = getCurrentInstance();
        return {
            proxy,
            transformData,transformList,
            activeId
        }
    },
    mounted() {
        // this.getApi();
    },
    methods: {
        getApi() {
            if(this.$route.params.id) {
                this.proxy.$post("/task/taskEffect", {id: this.$route.params.id}).then(res => {
                    const data = res.data;
                    console.log(data)
                }).catch(() => {});
            }
        },
    }
})
</script>

<style lang="less">
.form-area {
    width: 600px;
    height: 300px;
}
.img-upload {
    font-size: 28px;
    color: #8c939d;
    width: 135px;
    height: 135px;
    text-align: center;
    border: 1px solid;
}
.top-title {
    color: black;
    font-weight: 600;
    font-size: 14px;
    line-height: 16px;
}
.top-number {
    padding: 16px 0px 16px 0px;
    display: flex;
    justify-content: flex-start;
    .title-style {
        font-weight: 600;
        font-size: 14px;
        line-height: 16px;
    }
    .number-style {
        color: black;
        font-weight: 900;
        font-size: 32px;
        line-height: 28px;
        margin-top: 6px
    }
}
.bottom-list {
    padding: 16px 0px 16px 0px
}
</style>