You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
324 lines
9.6 KiB
324 lines
9.6 KiB
<template>
|
|
<view class="coinsDetail-wrap">
|
|
<view :class="{ 'top': id,'bottom':id }">
|
|
<VisitorInfo :visitorInfo="detailItem" />
|
|
</view>
|
|
<view v-if="!id" class="showPriceContent">
|
|
<view :class="['showPriceWrap',detailItem.ancient_coin_status == 0 ? 'green':'orange']">
|
|
<view class="flex-between">
|
|
<view class="label">{{ textObj[detailItem.ancient_coin_status] }}</view>
|
|
<view class="status3" v-if="detailItem.ancient_coin_status == '1' && detailItem.buying_price">进价 {{ detailItem.buying_price }}元</view>
|
|
<view class="flex status3" v-if="detailItem.ancient_coin_status == '2'">
|
|
历史:
|
|
<view v-if="String(detailItem.buying_price).length > 0">{{ detailItem.buying_price }}元进 </view>
|
|
<view v-if="String(detailItem.price).length > 0">
|
|
{{ detailItem.price }}元售
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="inputWrap" :class="{ 'greenBorder': price2Length > 0 && detailItem.ancient_coin_status == 0, 'orangeBorder':price2Length > 0 && detailItem.ancient_coin_status != 0 }">
|
|
<input type="text" placeholder="输入" :focus="isFocus" v-model="price2" >
|
|
<view class="unit">元</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="list-wrap">
|
|
<view class="list-box-com" v-if="detailItem.status =='2' && id">
|
|
<view class="item flex-between">
|
|
<view :class="'left ft30'">
|
|
售价
|
|
</view>
|
|
<view class="right ft30">
|
|
<view class="flex1">
|
|
<input type="text" v-model="price" @blur="updatePrice('price')">
|
|
<view>元</view>
|
|
</view>
|
|
<img class="editImg" :src="cssUrl + 'form_edit.png'" alt="">
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="list-box-com" v-if="id">
|
|
<view class="item flex-between">
|
|
<view :class="'left ft30'">
|
|
进价
|
|
</view>
|
|
<view class="right ft30">
|
|
<view class="flex1">
|
|
<input type="text" v-model="buying_price" @blur="updatePrice('buying_price')">
|
|
<view>元</view>
|
|
</view>
|
|
<img class="editImg" :src="cssUrl + 'form_edit.png'" alt="">
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<ListBox v-if="detailItem.rating_code" leftTitle="评级部门" :rightTitle="detailItem.rating_department" />
|
|
<ListBox v-if="detailItem.rating_code" leftTitle="评级编号" :rightTitle="detailItem.rating_code" />
|
|
<ListBox v-if="detailItem.material" leftTitle="材质" :rightTitle="detailItem.material" />
|
|
<ListBox v-if="detailItem.deal_with" leftTitle="处理" :rightTitle="detailItem.deal_with" />
|
|
<ListBox v-if="detailItem.pay_for_level" leftTitle="赔付等级" :rightTitle="detailItem.pay_for_level" />
|
|
<ListBox v-if="detailItem.grade" leftTitle="分数" :rightTitle="detailItem.grade" />
|
|
<ListBox v-if="detailItem.size" leftTitle="尺寸" :rightTitle="detailItem.size" />
|
|
<ListBox v-if="detailItem.remark" leftTitle="备注" :rightTitle="detailItem.remark" />
|
|
<!-- 详情页面展示 -->
|
|
<ListBox v-if="id" leftTitle="操作人" :rightTitle="detailItem.operator" />
|
|
</view>
|
|
|
|
</view>
|
|
</template>
|
|
<script>
|
|
import ListBox from '@/components/listBox.vue';
|
|
import VisitorInfo from '@/components/visitorInfo.vue';
|
|
|
|
export default {
|
|
name: "coinsDetail",
|
|
props: ['scanCodeDetail'],
|
|
components: {
|
|
VisitorInfo,
|
|
ListBox
|
|
},
|
|
data() {
|
|
return {
|
|
textObj:{
|
|
0:'进价：',
|
|
'1':'售价：',
|
|
'2':'再次入库价：',
|
|
},
|
|
cssUrl: this.cssUrl1,
|
|
visitorInfo: {},
|
|
id: '',
|
|
detailItem: {},
|
|
scan_code_detail: '',
|
|
price: '',
|
|
buying_price:'',
|
|
price2:'',
|
|
isFocus:false
|
|
}
|
|
},
|
|
computed: {
|
|
price2Length() {
|
|
return this.price2.length
|
|
}
|
|
},
|
|
watch: {
|
|
scanCodeDetail(newVal, oldVal) {
|
|
this.detailItem = { ...newVal }//更新
|
|
}
|
|
},
|
|
mounted() {
|
|
if (this.scanCodeDetail && Object.keys(this.scanCodeDetail).length > 0) {
|
|
this.detailItem = { ...this.scanCodeDetail }
|
|
}
|
|
|
|
},
|
|
onLoad(options) {
|
|
// console.log(options,'this.$route.query-=',this.scanCodeDetail);
|
|
const { id } = options;
|
|
// 跳转详情页
|
|
if (id) {
|
|
this.id = id;
|
|
let detailItem = uni.getStorageSync('detail')
|
|
if (detailItem) this.detailItem = JSON.parse(detailItem)
|
|
this.price = this.detailItem.price;
|
|
// this.price1 = this.detailItem.price1 || ''
|
|
this.buying_price = this.detailItem.buying_price;
|
|
|
|
}
|
|
// else{
|
|
// // 扫描后的弹出框信息
|
|
// // scanCodeDetail props传参
|
|
// this.detailItem = {...this.scanCodeDetail}
|
|
// }
|
|
},
|
|
methods:{
|
|
updatePrice(type){
|
|
let params={
|
|
scan_code_detail:JSON.stringify({...this.detailItem}),
|
|
rating_code:this.detailItem.rating_code,
|
|
rating_agency_id:this.detailItem.rating_agency_id
|
|
}
|
|
if(type == 'buying_price'){
|
|
if(!this.buying_price.trim() || !this.buying_price.length)return
|
|
params.buying_price = this.buying_price;
|
|
}else{
|
|
if(!this.price.trim() || !this.price.length)return
|
|
params.price = this.price;
|
|
}
|
|
this.$http.req('/api/update_price', {
|
|
...params
|
|
}, 'POST').then(data => {
|
|
if (data == -1) return
|
|
this.$pop.modelShow(data.msg)
|
|
|
|
}).catch(res => {
|
|
});
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.flex1{
|
|
display: flex;
|
|
align-items: center;
|
|
flex: 1;
|
|
input{
|
|
flex: 1;
|
|
text-align: right;
|
|
}
|
|
}
|
|
.flex-between {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
.status3{
|
|
font-size: 28rpx;
|
|
font-weight: normal;
|
|
line-height: normal;
|
|
text-align: right;
|
|
letter-spacing: 0.24rpx;
|
|
color: #E81F1F;
|
|
gap: 10rpx;
|
|
}
|
|
.label{
|
|
color: #333333;
|
|
font-size: 28rpx;
|
|
letter-spacing: 0.24rpx;
|
|
}
|
|
.green{
|
|
background: #F0F9EB; /* #F0F9EB */
|
|
input{
|
|
border-color: #39D067;
|
|
}
|
|
}
|
|
.orange{
|
|
background: #FFEFE3;
|
|
input{
|
|
border-color: #DCDCDC;
|
|
}
|
|
}
|
|
.bottom{
|
|
margin-bottom: 20rpx;
|
|
}
|
|
.showPriceContent{
|
|
padding: 0 42rpx 24rpx 42rpx;
|
|
background: #fff;
|
|
}
|
|
.showPriceWrap{
|
|
padding: 24rpx;
|
|
font-family: PingFang SC;
|
|
font-size: 28rpx;
|
|
font-weight: normal;
|
|
line-height: normal;
|
|
text-align: right;
|
|
letter-spacing: 0.24rpx;
|
|
color: #333333;
|
|
input{
|
|
text-align: left;
|
|
flex: 1;
|
|
&::placeholder{
|
|
color: #999999;
|
|
}
|
|
}
|
|
.inputWrap{
|
|
// width: 618rpx;
|
|
margin-top: 12rpx;
|
|
height: 86rpx;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
padding: 22rpx 24rpx;
|
|
align-self: stretch;
|
|
border-radius: 10rpx;
|
|
box-sizing: border-box;
|
|
background: #FFFFFF;
|
|
border: 2rpx solid #DCDCDC;
|
|
transition: all .3s;
|
|
font-size: 30rpx;
|
|
font-weight: normal;
|
|
line-height: normal;
|
|
letter-spacing: 0.22rpx;
|
|
color: #000000;
|
|
}
|
|
.unit{
|
|
font-family: PingFang SC;
|
|
font-size: 30rpx;
|
|
font-weight: normal;
|
|
line-height: normal;
|
|
letter-spacing: 0.22rpx;
|
|
color: #333333;
|
|
}
|
|
}
|
|
|
|
.list-box-com {
|
|
width: 100%;
|
|
background: #FFFFFF;
|
|
box-sizing: border-box;
|
|
|
|
.item {
|
|
// width: 692rpx;
|
|
box-sizing: border-box;
|
|
margin: 0 auto;
|
|
display: flex;
|
|
background: #FFFFFF;
|
|
justify-content: space-between;
|
|
line-height: 44rpx;
|
|
font-weight: 400;
|
|
align-items: center;
|
|
padding: 42rpx 0;
|
|
margin: 0 24rpx;
|
|
border-bottom: 2rpx solid #F0F0F0;
|
|
|
|
.left {
|
|
text-align: left;
|
|
font-size: 32rpx;
|
|
font-weight: 500;
|
|
line-height: 44rpx;
|
|
letter-spacing: 2rpx;
|
|
color: #222222;
|
|
}
|
|
|
|
.right {
|
|
flex-grow: 1;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
font-size: 32rpx;
|
|
font-weight: normal;
|
|
line-height: normal;
|
|
text-align: right;
|
|
letter-spacing: 0.24rpx;
|
|
color: #666666;
|
|
gap: 24rpx;
|
|
align-items: center;
|
|
}
|
|
}
|
|
|
|
}
|
|
.greenBorder {
|
|
border: 2rpx solid #39D067 !important;
|
|
transition: all .3s;
|
|
background: #fff;
|
|
}
|
|
.orangeBorder {
|
|
border: 2rpx solid rgba(253, 123, 19, 0.6) !important;
|
|
transition: all .3s;
|
|
background: #fff;
|
|
}
|
|
|
|
.editImg {
|
|
width: 32rpx;
|
|
height: 32rpx;
|
|
}
|
|
|
|
.coinsDetail-wrap {
|
|
.list-wrap {
|
|
padding: 0 18rpx 20rpx 18rpx;
|
|
;
|
|
}
|
|
|
|
.top {
|
|
margin-top: 20rpx;
|
|
}
|
|
}
|
|
</style>
|