120 lines
3.1 KiB
Vue
120 lines
3.1 KiB
Vue
|
<template>
|
|||
|
<view class="content">
|
|||
|
<navBar v-if="!isDetail"> 出库 </navBar>
|
|||
|
<navBar v-if="isDetail"> 画作详情 </navBar>
|
|||
|
<view class="container-box" >
|
|||
|
<span style="font-weight: bold;text-align: center;" v-if="!isDetail">
|
|||
|
保存要出库A000-B3的
|
|||
|
</span>
|
|||
|
<span style="font-weight: bold;text-align: center;margin-top: 20rpx;" v-if="!isDetail"> PT00000004画筒吗?</span>
|
|||
|
<span style="font-weight: bold;text-align: center;" v-if="isDetail">画筒号:</span>
|
|||
|
<span style="font-weight: bold;text-align: center;margin-top: 20rpx;" v-if="isDetail">所在位置:</span>
|
|||
|
<view class="painting-box" >
|
|||
|
<span>画作名称:</span>
|
|||
|
<span style="margin-top: 20rpx;">画家:</span>
|
|||
|
<span style="margin-top: 20rpx;">预览图:</span>
|
|||
|
<view class="image-container">
|
|||
|
<up-image
|
|||
|
:show-loading="true"
|
|||
|
:src="src"
|
|||
|
width="98%"
|
|||
|
height="100px"
|
|||
|
@click="click"
|
|||
|
></up-image>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="button-container">
|
|||
|
<up-button
|
|||
|
style="width: 326rpx; margin: auto; height: 80rpx;"
|
|||
|
color="#BCBCBC"
|
|||
|
throttleTime="5"
|
|||
|
:loading="loading"
|
|||
|
>取消</up-button
|
|||
|
>
|
|||
|
<up-button
|
|||
|
style="width: 326rpx; margin: auto; height: 80rpx;"
|
|||
|
color="#EFC54E"
|
|||
|
throttleTime="5"
|
|||
|
:loading="loading"
|
|||
|
>确认</up-button
|
|||
|
>
|
|||
|
<up-button
|
|||
|
style="width: 426rpx; margin: auto; height: 86rpx;"
|
|||
|
color="#EFC54E"
|
|||
|
throttleTime="5"
|
|||
|
:loading="loading"
|
|||
|
@click="login"
|
|||
|
v-if="isDetail"
|
|||
|
>返回继续扫码</up-button
|
|||
|
>
|
|||
|
</view>
|
|||
|
</template>
|
|||
|
|
|||
|
|
|||
|
<script setup>
|
|||
|
import { ref } from "vue";
|
|||
|
const isDetail = ref(false);
|
|||
|
</script>
|
|||
|
|
|||
|
<style lang="scss" scoped>
|
|||
|
page {
|
|||
|
background: url("@/static/bgp.png") no-repeat;
|
|||
|
background-size: 100% 100%;
|
|||
|
background-attachment: fixed;
|
|||
|
height: 100vh;
|
|||
|
box-sizing: border-box;
|
|||
|
}
|
|||
|
|
|||
|
.content {
|
|||
|
display: flex;
|
|||
|
flex-direction: column;
|
|||
|
align-items: center;
|
|||
|
justify-content: center;
|
|||
|
|
|||
|
.container-box {
|
|||
|
height: 100%;
|
|||
|
width: 98%;
|
|||
|
display: flex;
|
|||
|
flex-direction: column;
|
|||
|
margin-top: 60rpx;
|
|||
|
padding: 40rpx;
|
|||
|
box-sizing: border-box;
|
|||
|
|
|||
|
}
|
|||
|
|
|||
|
|
|||
|
.painting-box {
|
|||
|
height: 100%;
|
|||
|
width: 100%;
|
|||
|
display: flex;
|
|||
|
flex-direction: column;
|
|||
|
margin-top: 60rpx;
|
|||
|
padding: 20rpx;
|
|||
|
box-sizing: border-box;
|
|||
|
background-color: #fff;
|
|||
|
box-shadow: 0 0 6px rgba(219, 218, 218, 0.5);
|
|||
|
}
|
|||
|
.image-container {
|
|||
|
display: flex;
|
|||
|
justify-content: center;
|
|||
|
align-items: center;
|
|||
|
margin-top: 20rpx;
|
|||
|
}
|
|||
|
}
|
|||
|
.button-container {
|
|||
|
display: flex;
|
|||
|
justify-content: space-between;
|
|||
|
width: 100%;
|
|||
|
position: fixed;
|
|||
|
bottom: 20rpx;
|
|||
|
left: 0;
|
|||
|
padding: 0 20rpx;
|
|||
|
box-sizing: border-box;
|
|||
|
background-color: #fff;
|
|||
|
height: 8%;
|
|||
|
}
|
|||
|
</style>
|
|||
|
|