vue自定义页面

image.png

         <!-- 数据列表显示 -->
            <div class="cf flex-1 fs" style="font-size: 14px;">
                <!-- 数据 -->
                <div class="flex-1">
                    <div
                        class="rf"
                        style="
                            background-color: white;
                            width: 100%;
                            display: flex;
                            flex-direction: column;
                            margin-top: 10px;
                        "
                        v-for="(item, index) in dataList"
                        :key="index"
                        @click="detailHandle(item)"
                    >
                        <div class="item_1" style="display: flex; width: 100%; margin-left: 10px">
                            <div
                                style="
                                    display: flex;
                                    justify-content: flex-start;
                                    width: 50%;
                                    align-items: center;
                                "
                            >
                                <span style="margin-right: 10px; font-weight: bold">编号</span>
                                <span>{{ item.a }}</span>
                            </div>
                            <div
                                style="
                                    display: flex;
                                    flex-direction: row-reverse;
                                    align-items: center;
                                    width: 50%;
                                "
                            >
                                <span
                                    style="
                                        height: 30px;
                                        width: 30px;
                                        background-color: red;
                                        font-weight: bold;
                                        text-align: center;
                                        display: block;
                                        line-height: 30px;
                                        color: white;
                                        margin-right: 30px;
                                    "
                                >
                                    {{ item.e }}
                                </span>
                                <span style="margin-right: 30px; font-weight: bold">优先度</span>
                            </div>
                        </div>
                        <div class="item_2" style="display: flex; width: 100%; margin-left: 10px">
                            <div
                                style="
                                    display: flex;
                                    justify-content: flex-start;
                                    align-items: center;
                                "
                            >
                                <span style="margin-right: 10px; font-weight: bold">物品</span>
                                <span style="">{{ item.b }}</span>
                            </div>
                        </div>
                        <div class="item_3" style="display: flex; width: 100%; margin-left: 10px">
                            <div
                                style="
                                    display: flex;
                                    justify-content: flex-start;
                                    width: 60%;
                                    align-items: center;
                                "
                            >
                                <span style="margin-right: 10px; font-weight: bold">仓库</span>
                                <span style="">{{ item.c }}</span>
                            </div>
                            <div
                                style="
                                    display: flex;
                                    flex-direction: row-reverse;
                                    align-items: center;
                                    width: 40%;
                                    margin-right: 20px;
                                "
                            >
                                <span>
                                    {{ item.d }}
                                </span>
                                <span style="margin-right: 30px; font-weight: bold">推荐仓位</span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>