[BD2.0] vue3模版-工具页面

后面完善点击之类的

• 1.菜单配置

• 2.页面代码 /src/views/backend/goods/tools.vue

<template>
    <div class="default-main">
        <div class="crud-title">商品工具</div>
        <div class="start-opt">
            <el-row :gutter="20">
                <el-col :xs="24" :span="8">
                    <div class="start-item suspension">
                        <div class="start-item-title">导入商品</div>
                        <div class="start-item-remark">...</div>
                    </div>
                </el-col>
                <el-col :xs="24" :span="8">
                    <div class="start-item suspension">
                        <div class="start-item-title">转让商品</div>
                        <div class="start-item-remark">...</div>
                    </div>
                </el-col>
                <el-col :xs="24" :span="8">
                    <div class="start-item suspension">
                        <div class="start-item-title">设置状态</div>
                        <div class="start-item-remark">...</div>
                    </div>
                </el-col>
            </el-row>
            <el-row justify="center">
                <el-col :span="20" class="ba-markdown crud-tips suspension">
                    <b>注意事项</b>
                    <ol>
                        <li>注意格式</li>
                        <li>注意大小</li>
                        <li>注意内容</li>
                    </ol>
                </el-col>
            </el-row>

        </div>
    </div>
</template>

<script setup lang="ts">
</script>

<style scoped lang="scss">
.crud-title {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--el-font-size-extra-large);
    font-weight: bold;
    padding-top: 120px;
}
.start-opt {
    display: block;
    width: 60%;
    margin: 40px auto;
}
.start-item {
    background-color: #e1eaf9;
    border-radius: var(--el-border-radius-base);
    padding: 25px;
    margin-bottom: 20px;
    cursor: pointer;
}
.start-item-title {
    font-size: var(--el-font-size-large);
    color: var(--ba-color-primary-light);
}
.start-item-remark {
    display: block;
    line-height: 18px;
    min-height: 48px;
    padding-top: 12px;
    color: #92969a;
}
.crud-tips {
    margin-top: 60px;
    padding: 20px;
    background-color: rgba($color: #ffffff, $alpha: 0.6);
    border-radius: var(--el-border-radius-base);
    color: var(--el-color-info);
    b {
        font-size: 15px;
        padding-left: 10px;
    }
}
</style>