master
Phoenix 6 months ago
parent b3aeedd37c
commit 6f2bae6d5b

@ -2,7 +2,13 @@
import tabBar from "./util/tabbar"; import tabBar from "./util/tabbar";
export default { export default {
onLaunch: function() { onLaunch: function(options) {
/* if (['pages/confirm-order/index'].includes(options.path)){
uni.redirectTo({
url: `pages/consignment-painting/index?type=confirm`
})
}
console.log(options,'options')*/
// uni.setStorageSync("token",'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJJRCI6MCwiT3BlbklkIjoib01qYXY2NjlHMEtKcFlKNE1qWGhyNEh5cHhBUSIsIk5pY2tOYW1lIjoi5YiY5bCP5benIiwiVGVsTnVtIjoiMTUyNjI0ODE0OTgiLCJBdmF0YXIiOiJodHRwczovL2NkbnMuZm9udHJlZS5jbi9pbnZlbnRvcnkvZmlsZXMvaW1nL2MzNWQ1ODVhLTVjNTMtMTFlZS04OGRmLTAyNDJhYzEzMDAyNS5qcGciLCJJRE51bSI6IjMyMDMyNDE5OTAwNTA5NjY0WCIsImV4cCI6MTY5NTgxMTk4NCwiaXNzIjoibWFsbCJ9.QDDAiN5xFtL7BelKfgbnej_nO52T_UxQ7GFicHnQA2U') // uni.setStorageSync("token",'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJJRCI6MCwiT3BlbklkIjoib01qYXY2NjlHMEtKcFlKNE1qWGhyNEh5cHhBUSIsIk5pY2tOYW1lIjoi5YiY5bCP5benIiwiVGVsTnVtIjoiMTUyNjI0ODE0OTgiLCJBdmF0YXIiOiJodHRwczovL2NkbnMuZm9udHJlZS5jbi9pbnZlbnRvcnkvZmlsZXMvaW1nL2MzNWQ1ODVhLTVjNTMtMTFlZS04OGRmLTAyNDJhYzEzMDAyNS5qcGciLCJJRE51bSI6IjMyMDMyNDE5OTAwNTA5NjY0WCIsImV4cCI6MTY5NTgxMTk4NCwiaXNzIjoibWFsbCJ9.QDDAiN5xFtL7BelKfgbnej_nO52T_UxQ7GFicHnQA2U')
uni.hideTabBar(); uni.hideTabBar();
uni.setStorageSync("tabBar", tabBar); uni.setStorageSync("tabBar", tabBar);

@ -34,106 +34,110 @@
</div> </div>
</div> </div>
</div> </div>
<div class="content-center" :style="{marginTop:`${contentListHeight+10}px`,marginBottom:`${type==='detail'?10:180}px`}"> <scroll-view class="content-center" :style="{marginTop:`${contentListHeight+10}px`,marginBottom:type==='detail'?'30rpx':'180rpx'}" @scroll="scrollDetail" :scroll-into-view="scrollId" scroll-y="true">
<div class="painting-name" v-if="listPaintings.length>1"> <div class="content-scroll" v-for="(item,index) of listPaintings" :id="`item-${index}`">
<div class="wrap1">画作{{currentIndex+1}}</div> <div class="painting-name" v-if="listPaintings.length>1">
<div class="wrap2" style="display: none" @click="itemDelete"></div> <div class="wrap1">画作{{index+1}}</div>
</div> <div class="wrap2" style="display: none" @click="itemDelete"></div>
<div class="content2"> </div>
<u-upload <div class="content2">
:fileList="listPaintings[currentIndex].fileList1" <u-upload
@afterRead="afterRead" :fileList="listPaintings[index].fileList1"
@delete="deletePic" @afterRead="(e)=>{afterRead(e,index)}"
name="6" @delete="(e)=>{deletePic(e,index)}"
multiple name="6"
:maxCount="1" multiple
width="404rpx" :maxCount="1"
height="306rpx" width="404rpx"
> height="306rpx"
<div style="width: 404rpx;height: 306rpx;background: #000;border-radius: 20rpx;display: flex;flex-direction: column;align-items: center;justify-content: center"> >
<div style="margin-bottom: 14rpx"> <div style="width: 404rpx;height: 306rpx;background: #000;border-radius: 20rpx;display: flex;flex-direction: column;align-items: center;justify-content: center">
<image style="width: 38.32rpx;height: 38.2rpx" src="../../static/zu142@3x.png"></image> <div style="margin-bottom: 14rpx">
<image style="width: 38.32rpx;height: 38.2rpx" src="../../static/zu142@3x.png"></image>
</div>
<div style="font-size: 32rpx;color: #fff">上传画作图片</div>
</div> </div>
<div style="font-size: 32rpx;color: #fff">上传画作图片</div>
</div>
</u-upload> </u-upload>
</div> </div>
<div class="content3"> <div class="content3">
<div class="prompt">*扫描自动填入</div> <div class="prompt">*扫描自动填入</div>
<div class="wrap1"> <div class="wrap1">
<div class="wrap1_1"> <div class="wrap1_1">
<div class="wrap1_1_1">画作编号</div> <div class="wrap1_1_1">画作编号</div>
<div class="wrap1_1_2"></div> <div class="wrap1_1_2"></div>
<div class="wrap1_1_3"> <div class="wrap1_1_3">
<input style="color: #939393;font-size: 24rpx;" v-model="listPaintings[currentIndex].artworkNum" disabled placeholder-style="color: #939393;font-size: 24rpx;" placeholder="请输入画作编号"/> <input style="color: #939393;font-size: 24rpx;" disabled v-model="listPaintings[index].artworkNum" placeholder-style="color: #939393;font-size: 24rpx;" placeholder="请输入画作编号"/>
</div> </div>
<div class="wrap1_1_4"></div> <div class="wrap1_1_4"></div>
</div>
<div class="wrap1_1">
<div class="wrap1_1_1">画作名称</div>
<div class="wrap1_1_2"></div>
<div class="wrap1_1_3">
<input style="color: #939393;font-size: 24rpx;" disabled v-model="listPaintings[currentIndex].artworkName" placeholder-style="color: #939393;font-size: 24rpx;" placeholder="请输入画作名称"/>
</div> </div>
<div class="wrap1_1_4"></div> <div class="wrap1_1">
</div> <div class="wrap1_1_1">画作名称</div>
<div class="wrap1_1"> <div class="wrap1_1_2"></div>
<div class="wrap1_1_1">画家名称</div> <div class="wrap1_1_3">
<div class="wrap1_1_2"></div> <input style="color: #939393;font-size: 24rpx;" disabled v-model="listPaintings[index].artworkName" placeholder-style="color: #939393;font-size: 24rpx;" placeholder="请输入画作名称"/>
<div class="wrap1_1_3"> </div>
<input style="color: #939393;font-size: 24rpx;" v-model="listPaintings[currentIndex].artistName" disabled placeholder-style="color: #939393;font-size: 24rpx;" placeholder="请输入画家名称"/> <div class="wrap1_1_4"></div>
</div> </div>
<div class="wrap1_1_4"> <div class="wrap1_1">
<div class="wrap1_1_1">画家名称</div>
<div class="wrap1_1_2"></div>
<div class="wrap1_1_3">
<input style="color: #939393;font-size: 24rpx;" disabled v-model="listPaintings[index].artistName" placeholder-style="color: #939393;font-size: 24rpx;" placeholder="请输入画家名称"/>
</div>
<div class="wrap1_1_4">
</div>
</div> </div>
</div> <div class="wrap1_1">
<div class="wrap1_1"> <div class="wrap1_1_1">画作平尺数</div>
<div class="wrap1_1_1">画作平尺数</div> <div class="wrap1_1_2"></div>
<div class="wrap1_1_2"></div> <div class="wrap1_1_3">
<div class="wrap1_1_3"> <input style="color: #939393;font-size: 24rpx;" disabled v-model="listPaintings[index].artworkSquareSize" placeholder-style="color: #939393;font-size: 24rpx;" placeholder="请输入画作平尺数"/>
<input style="color: #939393;font-size: 24rpx;" v-model="listPaintings[currentIndex].artworkSquareSize" disabled placeholder-style="color: #939393;font-size: 24rpx;" placeholder="请输入画作平尺数"/> </div>
</div> </div>
</div> </div>
<div class="wrap2"></div>
</div> </div>
<div class="wrap2"></div> <div class="content4">
</div> <div class="wrap1">
<div class="content4"> <div class="wrap1_1" >
<div class="wrap1"> <div class="wrap1_1_1">寄存地址</div>
<div class="wrap1_1" > <div class="wrap1_1_2"></div>
<div class="wrap1_1_1">寄存地址</div> <div class="wrap1_1_3">
<div class="wrap1_1_2"></div> <input style="color: #939393;font-size: 24rpx;" disabled :value="listPaintings[index].warehouseID?addressList.find(x=>x.ID===listPaintings[index].warehouseID).address:''" placeholder-style="color: #939393;font-size: 24rpx;"
<div class="wrap1_1_3"> placeholder="请选择寄存地址"/>
<input style="color: #939393;font-size: 24rpx;" disabled :value="listPaintings[currentIndex].warehouseID?addressList.find(x=>x.ID===listPaintings[currentIndex].warehouseID).address:''" placeholder-style="color: #939393;font-size: 24rpx;" </div>
placeholder="请选择寄存地址"/> <div class="wrap1_1_4"></div>
<!-- <div class="wrap1_1_5">
<image src="../../static/zu611@3x.png"></image>
</div>-->
</div> </div>
<div class="wrap1_1_4"></div> <div class="wrap1_1">
<!-- <div class="wrap1_1_5"> <div class="wrap1_1_1">寄存时长</div>
<image src="../../static/zu611@3x.png"></image> <div class="wrap1_1_2"></div>
</div>--> <div class="wrap1_1_3">
</div> <input style="color: #939393;font-size: 24rpx;" :value="listPaintings[index].endAt" disabled placeholder-style="color: #939393;font-size: 24rpx;" placeholder="请选择寄存时长"/>
<div class="wrap1_1" > </div>
<div class="wrap1_1_1">寄存时长</div> <!-- <div class="wrap1_1_5">
<div class="wrap1_1_2"></div> <image src="../../static/zu612@3x.png"></image>
<div class="wrap1_1_3"> </div>-->
<input style="color: #939393;font-size: 24rpx;" :value="listPaintings[currentIndex].endAt" disabled placeholder-style="color: #939393;font-size: 24rpx;" placeholder="请选择寄存时长"/>
</div> </div>
<!-- <div class="wrap1_1_5">
<image src="../../static/zu612@3x.png"></image>
</div>-->
</div> </div>
<div class="wrap2"></div>
</div> </div>
<div class="wrap2"></div> <!-- <div class="content7" @click="addPainting">
<div class="wrap1">
<div class="horizontal"></div>
<div class="vertical"></div>
</div>
<div class="wrap2">添加</div>
</div>-->
</div> </div>
<!-- <div class="content7" @click="addPainting"> </scroll-view>
<div class="wrap1">
<div class="horizontal"></div>
<div class="vertical"></div>
</div>
<div class="wrap2">添加</div>
</div>-->
</div>
<div class="content5" v-if="type!=='detail'"> <div class="content5" v-if="type!=='detail'">
<div class="wrap4" v-show="isExpand1" :style="{top:`-${152*listPaintings.length}rpx`}"> <div class="wrap4" v-show="isExpand1" :style="{top:`-${152*listPaintings.length}rpx`}">
<div class="item" v-for="(item,index) in listPaintings"> <div class="item" v-for="(item,index) in listPaintings">
@ -146,7 +150,7 @@
<div class="wrap3" @click="expand1" :style="{transform:`${isExpand1?'':'rotate(180deg)'}`}"> <img src="https://cdns.fontree.cn/fonchain-main/prod/image/default/approval/13639162-2871-4187-abc5-71c2d9f01ac2.png" alt=""></div> <div class="wrap3" @click="expand1" :style="{transform:`${isExpand1?'':'rotate(180deg)'}`}"> <img src="https://cdns.fontree.cn/fonchain-main/prod/image/default/approval/13639162-2871-4187-abc5-71c2d9f01ac2.png" alt=""></div>
<div class="wrap1"> <div class="wrap1">
<div class="wrap1_1">*仅微信付款</div> <div class="wrap1_1">*仅微信付款</div>
<div class="wrap1_2">预计 ¥{{totalMoney}}</div> <div class="wrap1_2">预计 ¥{{totalMoney||'0'}}</div>
</div> </div>
<div class="wrap2" @click="signContract"></div> <div class="wrap2" @click="signContract"></div>
</div> </div>
@ -243,12 +247,13 @@
</div> </div>
</u-popup>--> </u-popup>-->
<u-picker :show="show_1" ref="uPicker" :columns="columns" @confirm="confirmDate" @close="show_1=false" @change="changeHandler"></u-picker> <u-picker :show="show_1" ref="uPicker" :columns="columns" @confirm="confirmDate" @close="show_1=false" @change="changeHandler"></u-picker>
<u-loading-page bgColor="rgba(0,0,0,0.5)" :loading="loading" loading-text="..."></u-loading-page> <u-loading-page bgColor="rgba(0,0,0,0.5)" :loading="loading" loading-text="..."></u-loading-page>
</div> </div>
</template> </template>
<script> <script>
import http from "@/http/api"; import http from "@/http/api";
import {postDataByParams} from "../../http/service"; import {postDataByParams} from "../../http/service";
import {type} from "../../uni_modules/uni-forms/components/uni-forms/utils";
export default { export default {
name: "order-details", name: "order-details",
@ -270,7 +275,15 @@ export default {
days.push(i) days.push(i)
} }
return { return {
columns: [], itemHeight:0,
scrollId:'item-0',
columns: [
[180],
['*'],
[1,2,3,4,5],
['='],
[180]
],
currentIndex:0, currentIndex:0,
listPaintings:[{ listPaintings:[{
expectedPayment:'', expectedPayment:'',
@ -282,12 +295,12 @@ export default {
warehouseID:'', warehouseID:'',
endAt:'' endAt:''
}], }],
type:'',
contentListHeight: 0, contentListHeight: 0,
isExpand:false, isExpand:false,
isExpand1:false, isExpand1:false,
listHeight:308, listHeight:308,
minDate:'', minDate:'',
type:'',
show: false, show: false,
value1: '', value1: '',
loading:false, loading:false,
@ -346,54 +359,75 @@ export default {
} }
}, },
currentEndAt(newValue, oldValue) { currentEndAt(newValue, oldValue) {
console.log(newValue,oldValue)
if (newValue !== oldValue) { if (newValue !== oldValue) {
this.obtainAmount() this.obtainAmount()
} }
}, },
}, },
onLoad(load){ onLoad(load){
if (load.url){
this.url=load.url
this.getDetailUrl()
}
if (load.type==='detail'){ if (load.type==='detail'){
this.getData() this.getData()
this.type=load.type this.type=load.type
}else {
this.listPaintings=uni.getStorageSync('orderingInfo').listPaintings
} }
if (load.type==='scan'){
this.listPaintings=uni.getStorageSync('scanlist')?.map((x)=>{
return {
...x,
expectedPayment:'',
warehouseID:'',
fileList1:[ { url:x.artworkImg }]
}
})
}
this.listPaintings=uni.getStorageSync('orderingInfo').listPaintings
}, },
mounted() { mounted() {
this.columns=[
[180],
['*'],
[1,2,3,4,5],
['='],
[180]
]
this.getCycle() this.getCycle()
if (this.$mp.query.url){ if (this.$mp.query.url){
this.url=this.$mp.query.url this.url=this.$mp.query.url
this.getDetailUrl() this.getDetailUrl()
} }
this.getAddress() this.getAddress()
this.$nextTick(async ()=>{
this.itemHeight= await this.getElementHeight('.content-scroll')
this.$nextTick(()=>{
this.getheight() this.getheight()
}) })
}, },
methods: { methods: {
getElementHeight(selector) {
return new Promise((resolve, reject) => {
const query = uni.createSelectorQuery();
query.select(selector).boundingClientRect(data => {
if (data) {
resolve(data.height); // Promise
} else {
reject(new Error('无法获取元素高度')); // Promise
}
}).exec();
});
},
async scrollDetail(event){
const scrollTop = event.detail.scrollTop; //
const totalHeight = this.listPaintings.length * this.itemHeight;
const scrollPercent = (scrollTop / totalHeight) * 100;
const index = Math.floor(scrollTop / this.itemHeight); //
/* console.log(` ${scrollPercent}%`);
console.log(`滚动到了第 ${index} 个元素的位置`);*/
this.currentIndex=index
},
async getData() { async getData() {
const data1 = { const data1 = {
ID: Number(this.$mp.query.ID) ID: Number(this.$mp.query.ID)
} }
const res1 = await postDataByParams('/api/v2/warehouse/detail', data1) const res1 = await postDataByParams('/api/v2/warehouse/detail', data1)
if (res1.code === 200) { if (res1.code === 200) {
this.listPaintings = res1.data?.map((x)=>{
return {
...x,
expectedPayment:x.money,
endAt:x.days,
fileList1: [{url:x.artworkImg}]
}
})
this.info = res1.data this.info = res1.data
} }
}, },
@ -422,6 +456,7 @@ export default {
}, },
itemClick(index){ itemClick(index){
this.scrollId=`item-${index}`
this.currentIndex=index this.currentIndex=index
}, },
addPainting(){ addPainting(){
@ -432,8 +467,8 @@ export default {
artworkName:'', artworkName:'',
artistName:'', artistName:'',
artworkSquareSize:'', artworkSquareSize:'',
warehouseID:'', warehouseID: this.listPaintings[0].warehouseID,
endAt:'' endAt:this.listPaintings[0].endAt
}) })
this.$nextTick(()=>{ this.$nextTick(()=>{
this.getheight() this.getheight()
@ -473,6 +508,7 @@ export default {
}, },
confirmDate(data){ confirmDate(data){
this.listPaintings[this.currentIndex].endAt=data.value[data.value.length-1] this.listPaintings[this.currentIndex].endAt=data.value[data.value.length-1]
this.obtainAmount()
this.show_1=false this.show_1=false
}, },
openShow1(){ openShow1(){
@ -495,7 +531,6 @@ export default {
success: (res) => { success: (res) => {
const { path } = JSON.parse(res.data).data; const { path } = JSON.parse(res.data).data;
resolve(path); resolve(path);
}, },
}); });
}) })
@ -504,12 +539,12 @@ export default {
this.fileList1=[] this.fileList1=[]
}, },
// //
async afterRead(event) { async afterRead(event,index) {
// multiple true , file // multiple true , file
let lists = [].concat(event.file) let lists = [].concat(event.file)
let fileListLen = this.listPaintings[this.currentIndex].fileList1.length let fileListLen = this.listPaintings[index].fileList1.length
lists.map((item) => { lists.map((item) => {
this.listPaintings[this.currentIndex].fileList1.push({ this.listPaintings[index].fileList1.push({
...item, ...item,
status: 'uploading', status: 'uploading',
message: '上传中' message: '上传中'
@ -517,8 +552,8 @@ export default {
}) })
for (let i = 0; i < lists.length; i++) { for (let i = 0; i < lists.length; i++) {
const result = await this.uploadFilePromise(lists[i].url, 'check') const result = await this.uploadFilePromise(lists[i].url, 'check')
let item = this.listPaintings[this.currentIndex].fileList1[fileListLen] let item = this.listPaintings[index].fileList1[fileListLen]
this.listPaintings[this.currentIndex].fileList1.splice(fileListLen, 1, Object.assign(item, { this.listPaintings[index].fileList1.splice(fileListLen, 1, Object.assign(item, {
status: 'success', status: 'success',
message: '', message: '',
url: result url: result
@ -1124,186 +1159,192 @@ picker-view {
.content-center{ .content-center{
overflow-y: scroll; overflow-y: scroll;
.painting-name{
margin-top: 48rpx; .content-scroll{
align-items: center; .painting-name{
display: flex; margin-top: 48rpx;
justify-content: space-between;
.wrap1{
color: rgba(0, 0, 0, 1);
font-size: 28rpx;
}
.wrap2{
font-size: 28rpx;
display: flex;
justify-content: center;
align-items: center; align-items: center;
color: rgba(118, 196, 88, 1); display: flex;
border-radius: 40rpx; justify-content: space-between;
background-color: #fff; .wrap1{
width: 148rpx; color: rgba(0, 0, 0, 1);
height: 56rpx; font-size: 28rpx;
border: 1px solid rgba(118, 196, 88, 1); }
} .wrap2{
} font-size: 28rpx;
&>.content7{ display: flex;
margin: 0 auto; justify-content: center;
background-color: #fff; align-items: center;
border-radius: 40rpx; color: rgba(118, 196, 88, 1);
width: 228rpx; border-radius: 40rpx;
height: 56rpx; background-color: #fff;
border: 3rpx solid rgba(118, 196, 88, 1); width: 148rpx;
display: flex; height: 56rpx;
justify-content: center; border: 1px solid rgba(118, 196, 88, 1);
align-items: center; }
.wrap2{
color: rgba(118, 196, 88, 1);
font-size: 28rpx;
} }
.wrap1{ & > .content4 {
margin-right: 20rpx; margin-bottom: 24rpx;
box-sizing: border-box; margin-top: 60rpx;
width: 32rpx;
height: 32rpx;
border: 3rpx solid rgba(118, 196, 88, 1);
border-radius: 50%;
background: transparent;
position: relative; .wrap1 {
.horizontal { border: 1rpx dashed #DFE9F0;
position: absolute; background-color: #fff;
left: 50%;
top: 50%;
transform: translate(-50%,-50%);
width: 18rpx;
height: 2rpx;
background-color: rgba(118, 196, 88, 1);
}
.vertical { .wrap1_1 {
position: absolute; position: relative;
left: 50%; height: 114rpx;
top: 50%; display: flex;
transform: translate(-50%,-50%); align-items: center;
width: 2rpx;
height: 18rpx;
background-color: rgba(118, 196, 88, 1);
}
.wrap1_1_4 {
left: 50%;
transform: translateX(-50%);
bottom: 0;
position: absolute;
height: 0;
width: 636rpx;
border-bottom: 0.5px solid #626262;
}
} .wrap1_1_5 {
} right: 42rpx;
& > .content4 { position: absolute;
margin-bottom: 24rpx;
margin-top: 60rpx;
.wrap1 { image {
border: 1rpx dashed #DFE9F0; width: 46.34rpx;
background-color: #fff; height: 20rpx;
}
}
.wrap1_1 { .wrap1_1_2 {
position: relative; margin-right: 36rpx;
height: 114rpx; width: 0;
display: flex; height: 66rpx;
align-items: center; border-left: 0.5px solid #626262;
.wrap1_1_4 { }
left: 50%;
transform: translateX(-50%);
bottom: 0;
position: absolute;
height: 0;
width: 636rpx;
border-bottom: 0.5px solid #626262;
}
.wrap1_1_5 { .wrap1_1_1 {
right: 42rpx; width: 210rpx;
position: absolute; padding-left: 32rpx;
image { color: #626262;
width: 46.34rpx; font-size: 24rpx;
height: 20rpx;
} }
} }
}
}
.wrap1_1_2 { & > .content3 {
margin-right: 36rpx; margin-top: 60rpx;
width: 0;
height: 66rpx;
border-left: 0.5px solid #626262;
} .prompt {
color: #4E964D;
font-size: 16rpx;
margin-bottom: 4rpx;
}
.wrap1_1_1 { .wrap1 {
width: 210rpx; border: 1rpx dashed #DFE9F0;
padding-left: 32rpx; background-color: #fff;
color: #626262; .wrap1_1 {
font-size: 24rpx; position: relative;
height: 114rpx;
display: flex;
align-items: center;
.wrap1_1_4 {
left: 50%;
transform: translateX(-50%);
bottom: 0;
position: absolute;
height: 0;
width: 636rpx;
border-bottom: 0.5px solid #626262;
}
.wrap1_1_2 {
margin-right: 36rpx;
width: 0;
height: 66rpx;
border-left: 0.5px solid #626262;
}
.wrap1_1_1 {
width: 210rpx;
padding-left: 32rpx;
color: #626262;
font-size: 24rpx;
}
} }
} }
} }
}
& > .content3 { & > .content2 {
margin-top: 60rpx;
.prompt { display: flex;
color: #4E964D; justify-content: center;
font-size: 16rpx;
margin-bottom: 4rpx;
}
.wrap1 { image {
border: 1rpx dashed #DFE9F0; width: 404rpx;
height: 306rpx;
}
}
&>.content7{
margin: 0 auto;
background-color: #fff; background-color: #fff;
border-radius: 40rpx;
width: 228rpx;
height: 56rpx;
border: 3rpx solid rgba(118, 196, 88, 1);
display: flex;
justify-content: center;
align-items: center;
.wrap2{
color: rgba(118, 196, 88, 1);
font-size: 28rpx;
}
.wrap1{
margin-right: 20rpx;
box-sizing: border-box;
width: 32rpx;
height: 32rpx;
border: 3rpx solid rgba(118, 196, 88, 1);
border-radius: 50%;
background: transparent;
.wrap1_1 {
position: relative; position: relative;
height: 114rpx; .horizontal {
display: flex;
align-items: center;
.wrap1_1_4 {
left: 50%;
transform: translateX(-50%);
bottom: 0;
position: absolute; position: absolute;
height: 0; left: 50%;
width: 636rpx; top: 50%;
border-bottom: 0.5px solid #626262; transform: translate(-50%,-50%);
width: 18rpx;
height: 2rpx;
background-color: rgba(118, 196, 88, 1);
} }
.wrap1_1_2 { .vertical {
margin-right: 36rpx; position: absolute;
width: 0; left: 50%;
height: 66rpx; top: 50%;
border-left: 0.5px solid #626262; transform: translate(-50%,-50%);
width: 2rpx;
height: 18rpx;
background-color: rgba(118, 196, 88, 1);
} }
.wrap1_1_1 {
width: 210rpx;
padding-left: 32rpx;
color: #626262;
font-size: 24rpx;
}
} }
} }
} }
& > .content2 {
display: flex;
justify-content: center;
image {
width: 404rpx;
height: 306rpx;
}
}
} }
} }
</style> </style>

@ -34,106 +34,110 @@
</div> </div>
</div> </div>
</div> </div>
<div class="content-center" :style="{marginTop:`${contentListHeight+10}px`}"> <scroll-view class="content-center" :style="{marginTop:`${contentListHeight+10}px`}" @scroll="scrollDetail" :scroll-into-view="scrollId" scroll-y="true">
<div class="painting-name" v-if="listPaintings.length>1"> <div class="content-scroll" v-for="(item,index) of listPaintings" :id="`item-${index}`">
<div class="wrap1">画作{{currentIndex+1}}</div> <div class="painting-name" v-if="listPaintings.length>1">
<div class="wrap2" @click="itemDelete"></div> <div class="wrap1">画作{{index+1}}</div>
</div> <div class="wrap2" @click="itemDelete"></div>
<div class="content2">
<u-upload
:fileList="listPaintings[currentIndex].fileList1"
@afterRead="afterRead"
@delete="deletePic"
name="6"
multiple
:maxCount="1"
width="404rpx"
height="306rpx"
>
<div style="width: 404rpx;height: 306rpx;background: #000;border-radius: 20rpx;display: flex;flex-direction: column;align-items: center;justify-content: center">
<div style="margin-bottom: 14rpx">
<image style="width: 38.32rpx;height: 38.2rpx" src="../../static/zu142@3x.png"></image>
</div>
<div style="font-size: 32rpx;color: #fff">上传画作图片</div>
</div> </div>
<div class="content2">
<u-upload
:fileList="listPaintings[index].fileList1"
@afterRead="(e)=>{afterRead(e,index)}"
@delete="(e)=>{deletePic(e,index)}"
name="6"
multiple
:maxCount="1"
width="404rpx"
height="306rpx"
>
<div style="width: 404rpx;height: 306rpx;background: #000;border-radius: 20rpx;display: flex;flex-direction: column;align-items: center;justify-content: center">
<div style="margin-bottom: 14rpx">
<image style="width: 38.32rpx;height: 38.2rpx" src="../../static/zu142@3x.png"></image>
</div>
<div style="font-size: 32rpx;color: #fff">上传画作图片</div>
</div>
</u-upload> </u-upload>
</div>
<div class="content3">
<div class="prompt">*扫描自动填入</div>
<div class="wrap1">
<div class="wrap1_1">
<div class="wrap1_1_1">画作编号</div>
<div class="wrap1_1_2"></div>
<div class="wrap1_1_3">
<input style="color: #939393;font-size: 24rpx;" v-model="listPaintings[currentIndex].artworkNum" placeholder-style="color: #939393;font-size: 24rpx;" placeholder="请输入画作编号"/>
</div>
<div class="wrap1_1_4"></div>
</div> </div>
<div class="wrap1_1"> <div class="content3">
<div class="wrap1_1_1">画作名称</div> <div class="prompt">*扫描自动填入</div>
<div class="wrap1_1_2"></div> <div class="wrap1">
<div class="wrap1_1_3"> <div class="wrap1_1">
<input style="color: #939393;font-size: 24rpx;" v-model="listPaintings[currentIndex].artworkName" placeholder-style="color: #939393;font-size: 24rpx;" placeholder="请输入画作名称"/> <div class="wrap1_1_1">画作编号</div>
<div class="wrap1_1_2"></div>
<div class="wrap1_1_3">
<input style="color: #939393;font-size: 24rpx;" v-model="listPaintings[index].artworkNum" placeholder-style="color: #939393;font-size: 24rpx;" placeholder="请输入画作编号"/>
</div>
<div class="wrap1_1_4"></div>
</div>
<div class="wrap1_1">
<div class="wrap1_1_1">画作名称</div>
<div class="wrap1_1_2"></div>
<div class="wrap1_1_3">
<input style="color: #939393;font-size: 24rpx;" v-model="listPaintings[index].artworkName" placeholder-style="color: #939393;font-size: 24rpx;" placeholder="请输入画作名称"/>
</div>
<div class="wrap1_1_4"></div>
</div>
<div class="wrap1_1">
<div class="wrap1_1_1">画家名称</div>
<div class="wrap1_1_2"></div>
<div class="wrap1_1_3">
<input style="color: #939393;font-size: 24rpx;" v-model="listPaintings[index].artistName" placeholder-style="color: #939393;font-size: 24rpx;" placeholder="请输入画家名称"/>
</div>
<div class="wrap1_1_4">
</div>
</div>
<div class="wrap1_1">
<div class="wrap1_1_1">画作平尺数</div>
<div class="wrap1_1_2"></div>
<div class="wrap1_1_3">
<input style="color: #939393;font-size: 24rpx;" v-model="listPaintings[index].artworkSquareSize" placeholder-style="color: #939393;font-size: 24rpx;" placeholder="请输入画作平尺数"/>
</div>
</div>
</div> </div>
<div class="wrap1_1_4"></div> <div class="wrap2"></div>
</div> </div>
<div class="wrap1_1"> <div class="content4">
<div class="wrap1_1_1">画家名称</div> <div class="wrap1">
<div class="wrap1_1_2"></div> <div class="wrap1_1" @click="show_2=true">
<div class="wrap1_1_3"> <div class="wrap1_1_1">寄存地址</div>
<input style="color: #939393;font-size: 24rpx;" v-model="listPaintings[currentIndex].artistName" placeholder-style="color: #939393;font-size: 24rpx;" placeholder="请输入画家名称"/> <div class="wrap1_1_2"></div>
</div> <div class="wrap1_1_3">
<div class="wrap1_1_4"> <input style="color: #939393;font-size: 24rpx;" disabled :value="listPaintings[index].warehouseID?addressList.find(x=>x.ID===listPaintings[index].warehouseID).address:''" placeholder-style="color: #939393;font-size: 24rpx;"
placeholder="请选择寄存地址"/>
</div>
<div class="wrap1_1_4"></div>
<div class="wrap1_1_5">
<image src="../../static/zu611@3x.png"></image>
</div>
</div>
<div class="wrap1_1" @click="openShow1()">
<div class="wrap1_1_1">寄存时长</div>
<div class="wrap1_1_2"></div>
<div class="wrap1_1_3">
<input style="color: #939393;font-size: 24rpx;" :value="listPaintings[index].endAt" disabled placeholder-style="color: #939393;font-size: 24rpx;" placeholder="请选择寄存时长"/>
</div>
<div class="wrap1_1_5">
<image src="../../static/zu612@3x.png"></image>
</div>
</div>
</div> </div>
<div class="wrap2"></div>
</div> </div>
<div class="wrap1_1"> <div class="content7" @click="addPainting">
<div class="wrap1_1_1">画作平尺数</div> <div class="wrap1">
<div class="wrap1_1_2"></div> <div class="horizontal"></div>
<div class="wrap1_1_3"> <div class="vertical"></div>
<input style="color: #939393;font-size: 24rpx;" v-model="listPaintings[currentIndex].artworkSquareSize" placeholder-style="color: #939393;font-size: 24rpx;" placeholder="请输入画作平尺数"/>
</div> </div>
<div class="wrap2">添加</div>
</div> </div>
</div> </div>
<div class="wrap2"></div> </scroll-view>
</div>
<div class="content4">
<div class="wrap1">
<div class="wrap1_1" @click="show_2=true">
<div class="wrap1_1_1">寄存地址</div>
<div class="wrap1_1_2"></div>
<div class="wrap1_1_3">
<input style="color: #939393;font-size: 24rpx;" disabled :value="listPaintings[currentIndex].warehouseID?addressList.find(x=>x.ID===listPaintings[currentIndex].warehouseID).address:''" placeholder-style="color: #939393;font-size: 24rpx;"
placeholder="请选择寄存地址"/>
</div>
<div class="wrap1_1_4"></div>
<div class="wrap1_1_5">
<image src="../../static/zu611@3x.png"></image>
</div>
</div>
<div class="wrap1_1" @click="openShow1()">
<div class="wrap1_1_1">寄存时长</div>
<div class="wrap1_1_2"></div>
<div class="wrap1_1_3">
<input style="color: #939393;font-size: 24rpx;" :value="listPaintings[currentIndex].endAt" disabled placeholder-style="color: #939393;font-size: 24rpx;" placeholder="请选择寄存时长"/>
</div>
<div class="wrap1_1_5">
<image src="../../static/zu612@3x.png"></image>
</div>
</div>
</div>
<div class="wrap2"></div>
</div>
<div class="content7" @click="addPainting">
<div class="wrap1">
<div class="horizontal"></div>
<div class="vertical"></div>
</div>
<div class="wrap2">添加</div>
</div>
</div>
<div class="content5"> <div class="content5">
<div class="wrap4" v-show="isExpand1" :style="{top:`-${152*listPaintings.length}rpx`}"> <div class="wrap4" v-show="isExpand1" :style="{top:`-${152*listPaintings.length}rpx`}">
<div class="item" v-for="(item,index) in listPaintings"> <div class="item" v-for="(item,index) in listPaintings">
@ -242,7 +246,7 @@
</div> </div>
</div> </div>
</u-popup>--> </u-popup>-->
<u-picker :show="show_1" ref="uPicker" :columns="columns" @confirm="confirmDate" @close="show_1=false" @change="changeHandler"></u-picker> <u-picker :show="show_1" ref="uPicker" :columns="columns" @confirm="confirmDate" @cancel="closeClick" @change="changeHandler"></u-picker>
<u-loading-page bgColor="rgba(0,0,0,0.5)" :loading="loading" loading-text="..."></u-loading-page> <u-loading-page bgColor="rgba(0,0,0,0.5)" :loading="loading" loading-text="..."></u-loading-page>
</div> </div>
</template> </template>
@ -270,6 +274,8 @@ export default {
days.push(i) days.push(i)
} }
return { return {
itemHeight:0,
scrollId:'item-0',
columns: [ columns: [
[180], [180],
['*'], ['*'],
@ -363,7 +369,11 @@ export default {
this.getDetailUrl() this.getDetailUrl()
} }
if (load.type==='detail'){ if (load.type==='detail'){
this.getData() this.getData()
this.type=load.type
}
if (load.type==='confirm'){
this.listPaintings=uni.getStorageSync('orderingInfo').listPaintings
} }
if (load.type==='scan'){ if (load.type==='scan'){
this.listPaintings=uni.getStorageSync('scanlist')?.map((x)=>{ this.listPaintings=uni.getStorageSync('scanlist')?.map((x)=>{
@ -385,11 +395,36 @@ this.getData()
this.getDetailUrl() this.getDetailUrl()
} }
this.getAddress() this.getAddress()
this.$nextTick(()=>{ this.$nextTick(async ()=>{
this.itemHeight= await this.getElementHeight('.content-scroll')
this.getheight() this.getheight()
}) })
}, },
methods: { methods: {
closeClick(){
this.show_1=false
},
getElementHeight(selector) {
return new Promise((resolve, reject) => {
const query = uni.createSelectorQuery();
query.select(selector).boundingClientRect(data => {
if (data) {
resolve(data.height); // Promise
} else {
reject(new Error('无法获取元素高度')); // Promise
}
}).exec();
});
},
async scrollDetail(event){
const scrollTop = event.detail.scrollTop; //
const totalHeight = this.listPaintings.length * this.itemHeight;
const scrollPercent = (scrollTop / totalHeight) * 100;
const index = Math.floor(scrollTop / this.itemHeight); //
/* console.log(` ${scrollPercent}%`);
console.log(`滚动到了第 ${index} 个元素的位置`);*/
this.currentIndex=index
},
async getData() { async getData() {
const data1 = { const data1 = {
ID: Number(this.$mp.query.ID) ID: Number(this.$mp.query.ID)
@ -424,6 +459,7 @@ this.getData()
}, },
itemClick(index){ itemClick(index){
this.scrollId=`item-${index}`
this.currentIndex=index this.currentIndex=index
}, },
addPainting(){ addPainting(){
@ -506,12 +542,12 @@ this.getData()
this.fileList1=[] this.fileList1=[]
}, },
// //
async afterRead(event) { async afterRead(event,index) {
// multiple true , file // multiple true , file
let lists = [].concat(event.file) let lists = [].concat(event.file)
let fileListLen = this.listPaintings[this.currentIndex].fileList1.length let fileListLen = this.listPaintings[index].fileList1.length
lists.map((item) => { lists.map((item) => {
this.listPaintings[this.currentIndex].fileList1.push({ this.listPaintings[index].fileList1.push({
...item, ...item,
status: 'uploading', status: 'uploading',
message: '上传中' message: '上传中'
@ -519,8 +555,8 @@ this.getData()
}) })
for (let i = 0; i < lists.length; i++) { for (let i = 0; i < lists.length; i++) {
const result = await this.uploadFilePromise(lists[i].url, 'check') const result = await this.uploadFilePromise(lists[i].url, 'check')
let item = this.listPaintings[this.currentIndex].fileList1[fileListLen] let item = this.listPaintings[index].fileList1[fileListLen]
this.listPaintings[this.currentIndex].fileList1.splice(fileListLen, 1, Object.assign(item, { this.listPaintings[index].fileList1.splice(fileListLen, 1, Object.assign(item, {
status: 'success', status: 'success',
message: '', message: '',
url: result url: result
@ -1171,186 +1207,191 @@ color: rgba(98, 98, 98, 1);
.content-center{ .content-center{
overflow-y: scroll; overflow-y: scroll;
margin-bottom: 180rpx; margin-bottom: 180rpx;
.painting-name{ .content-scroll{
margin-top: 48rpx; .painting-name{
align-items: center; margin-top: 48rpx;
display: flex;
justify-content: space-between;
.wrap1{
color: rgba(0, 0, 0, 1);
font-size: 28rpx;
}
.wrap2{
font-size: 28rpx;
display: flex;
justify-content: center;
align-items: center; align-items: center;
color: rgba(118, 196, 88, 1); display: flex;
border-radius: 40rpx; justify-content: space-between;
background-color: #fff; .wrap1{
width: 148rpx; color: rgba(0, 0, 0, 1);
height: 56rpx; font-size: 28rpx;
border: 1px solid rgba(118, 196, 88, 1);
}
}
&>.content7{
margin: 0 auto;
background-color: #fff;
border-radius: 40rpx;
width: 228rpx;
height: 56rpx;
border: 3rpx solid rgba(118, 196, 88, 1);
display: flex;
justify-content: center;
align-items: center;
.wrap2{
color: rgba(118, 196, 88, 1);
font-size: 28rpx;
}
.wrap1{
margin-right: 20rpx;
box-sizing: border-box;
width: 32rpx;
height: 32rpx;
border: 3rpx solid rgba(118, 196, 88, 1);
border-radius: 50%;
background: transparent;
position: relative;
.horizontal {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%,-50%);
width: 18rpx;
height: 2rpx;
background-color: rgba(118, 196, 88, 1);
} }
.wrap2{
.vertical { font-size: 28rpx;
position: absolute; display: flex;
left: 50%; justify-content: center;
top: 50%; align-items: center;
transform: translate(-50%,-50%); color: rgba(118, 196, 88, 1);
width: 2rpx; border-radius: 40rpx;
height: 18rpx; background-color: #fff;
background-color: rgba(118, 196, 88, 1); width: 148rpx;
height: 56rpx;
border: 1px solid rgba(118, 196, 88, 1);
} }
}
& > .content4 {
margin-bottom: 24rpx;
margin-top: 60rpx;
.wrap1 {
border: 1rpx dashed #DFE9F0;
background-color: #fff;
} .wrap1_1 {
} position: relative;
& > .content4 { height: 114rpx;
margin-bottom: 24rpx; display: flex;
margin-top: 60rpx; align-items: center;
.wrap1 { .wrap1_1_4 {
border: 1rpx dashed #DFE9F0; left: 50%;
background-color: #fff; transform: translateX(-50%);
bottom: 0;
position: absolute;
height: 0;
width: 636rpx;
border-bottom: 0.5px solid #626262;
}
.wrap1_1 { .wrap1_1_5 {
position: relative; right: 42rpx;
height: 114rpx; position: absolute;
display: flex;
align-items: center;
.wrap1_1_4 { image {
left: 50%; width: 46.34rpx;
transform: translateX(-50%); height: 20rpx;
bottom: 0; }
position: absolute; }
height: 0;
width: 636rpx;
border-bottom: 0.5px solid #626262;
}
.wrap1_1_5 { .wrap1_1_2 {
right: 42rpx; margin-right: 36rpx;
position: absolute; width: 0;
height: 66rpx;
border-left: 0.5px solid #626262;
image {
width: 46.34rpx;
height: 20rpx;
} }
}
.wrap1_1_2 { .wrap1_1_1 {
margin-right: 36rpx; width: 210rpx;
width: 0; padding-left: 32rpx;
height: 66rpx;
border-left: 0.5px solid #626262;
color: #626262;
font-size: 24rpx;
}
} }
}
}
.wrap1_1_1 { & > .content3 {
width: 210rpx; margin-top: 60rpx;
padding-left: 32rpx;
color: #626262; .prompt {
font-size: 24rpx; color: #4E964D;
font-size: 16rpx;
margin-bottom: 4rpx;
}
.wrap1 {
border: 1rpx dashed #DFE9F0;
background-color: #fff;
.wrap1_1 {
position: relative;
height: 114rpx;
display: flex;
align-items: center;
.wrap1_1_4 {
left: 50%;
transform: translateX(-50%);
bottom: 0;
position: absolute;
height: 0;
width: 636rpx;
border-bottom: 0.5px solid #626262;
}
.wrap1_1_2 {
margin-right: 36rpx;
width: 0;
height: 66rpx;
border-left: 0.5px solid #626262;
}
.wrap1_1_1 {
width: 210rpx;
padding-left: 32rpx;
color: #626262;
font-size: 24rpx;
}
} }
} }
} }
}
& > .content3 { & > .content2 {
margin-top: 60rpx;
.prompt { display: flex;
color: #4E964D; justify-content: center;
font-size: 16rpx;
margin-bottom: 4rpx;
}
.wrap1 { image {
border: 1rpx dashed #DFE9F0; width: 404rpx;
height: 306rpx;
}
}
&>.content7{
margin: 0 auto;
background-color: #fff; background-color: #fff;
border-radius: 40rpx;
width: 228rpx;
height: 56rpx;
border: 3rpx solid rgba(118, 196, 88, 1);
display: flex;
justify-content: center;
align-items: center;
.wrap2{
color: rgba(118, 196, 88, 1);
font-size: 28rpx;
}
.wrap1{
margin-right: 20rpx;
box-sizing: border-box;
width: 32rpx;
height: 32rpx;
border: 3rpx solid rgba(118, 196, 88, 1);
border-radius: 50%;
background: transparent;
.wrap1_1 {
position: relative; position: relative;
height: 114rpx; .horizontal {
display: flex;
align-items: center;
.wrap1_1_4 {
left: 50%;
transform: translateX(-50%);
bottom: 0;
position: absolute; position: absolute;
height: 0; left: 50%;
width: 636rpx; top: 50%;
border-bottom: 0.5px solid #626262; transform: translate(-50%,-50%);
width: 18rpx;
height: 2rpx;
background-color: rgba(118, 196, 88, 1);
} }
.wrap1_1_2 { .vertical {
margin-right: 36rpx; position: absolute;
width: 0; left: 50%;
height: 66rpx; top: 50%;
border-left: 0.5px solid #626262; transform: translate(-50%,-50%);
width: 2rpx;
height: 18rpx;
background-color: rgba(118, 196, 88, 1);
} }
.wrap1_1_1 {
width: 210rpx;
padding-left: 32rpx;
color: #626262;
font-size: 24rpx;
}
} }
} }
} }
& > .content2 {
display: flex;
justify-content: center;
image {
width: 404rpx;
height: 306rpx;
}
}
} }
} }
</style> </style>

Loading…
Cancel
Save