<template> <view :style="{background:'url('+'../../static/bbj1@3x.png'+')'}" class="main"> <view class="title">寄存</view> <view class="order"> <view class="order-item"> <image src="@/static/image/write.png" mode="scaleToFill" style="width: 63rpx;height: 62rpx" /> <view style="color: #fff;margin-top:10rpx">填写下单</view> </view> <view class="order-item" style="background:#76C458 ;"> <image src="@/static/image/scan.png" mode="scaleToFill" style="width: 57rpx;height: 57rpx" /> <view style="color: #fff;margin-top:10rpx" @click="scanOrder">扫码下单</view> </view> </view> <view class="list"> <view style="color: #76C458">目前可用寄存仓库地址</view> <u-divider :dashed="true" lineColor="#4E964D"></u-divider> <view class="list-item"> <view>目前可用地址某某某地区</view> <view>剩余200位置</view> </view> <u-divider :dashed="true" lineColor="#4E964D"></u-divider> <view class="list-item"> <view>目前可用地址某某某地区</view> <view>剩余200位置</view> </view> </view> <tabbar :current="0"></tabbar> </view> </template> <script> import tabbar from "../../components/uiq-tabbar/uiq-tabbar.vue"; export default { name: "index", onLoad() { uni.hideTabBar(); }, components: { tabbar }, methods: { scanOrder() { uni.scanCode({ onlyFromCamera: false, success: res => { console.log("条码类型:" + res.scanType); console.log("条码内容:" + res.result); } }); } } }; </script> <style scoped lang="scss"> .main { box-sizing: border-box; height: 100vh; display: flex; flex-direction: column; align-items: center; padding: 30rpx; .title { margin-top: 40rpx; color: #4e964d; font-size: 32rpx; } .order { width: 100%; margin-top: 40rpx; display: flex; justify-content: space-between; .order-item { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 330rpx; height: 208rpx; border-radius: 20rpx; background: #4e964d; } } .list { margin-top: 40rpx; width: 100%; border-radius: 20rpx; box-sizing: border-box; padding: 12rpx 20rpx; display: flex; flex-direction: column; background: #fff; font-size: 24rpx; .list-item { width: 100%; display: flex; justify-content: space-between; color: #939393; } } } </style>