耀实惠小程序
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.
 
 
 

349 lines
8.2 KiB

<template>
<view class="medicine">
<view class="top"></view>
<view class="steps">
<text>上传处方</text>
<u-icon name="arrow-rightward" size="15"></u-icon>
<text>药师接单与审方</text>
<u-icon name="arrow-rightward" size="15"></u-icon>
<text>审方通过</text>
<u-icon name="arrow-rightward" size="15"></u-icon>
<text>在线支付</text>
<u-icon name="arrow-rightward" size="15"></u-icon>
<text>发货</text>
</view>
<view class="card">
<view class="title_box">
<text class="title">请上传清晰完整的处方照片</text>
<button class="look" @click="lookMode">查看处方示例</button>
</view>
<text class="hint_info">药师将根据您上传的处方单信息为您抓药</text>
<view class="upload">
<u-upload :header="headerOptions" width="200" height="200" :action="action" @on-success="uploadSuccess" @on-error="uploadErr" @on-remove="uploadRemove" ></u-upload>
</view>
</view>
<!-- 用药人 -->
<view class="user">
<view class="to_medicine_man" @click="selectUser" v-if="!drugUserInfo">
<text class="title">添加用药人信息</text>
<u-icon name="arrow-right"></u-icon>
</view>
<select-drug-user v-if="drugUserInfo" :DrugInfo='drugUserInfo' :type="2" @selectUser="selectUser"></select-drug-user>
</view>
<!-- 提交 -->
<view class="footer flex align-center justify-center">
<button @click="toSuccess" class="add_btn">提交处方</button>
</view>
<!-- 示例图片 -->
<view class="mask" v-show="show">
<view class="show_box">
<view class="clear_medicine_pic">
<u-icon name="close" size="40" color="#fff" @click="toCloseShow"></u-icon>
</view>
<image class="medicine_pic" :src="img_url+'medicine_pic.png'" mode=""></image>
</view>
</view>
</view>
</template>
<script>
import config from "@/utils/js/config.js"
import { UPLOAD_IMG, TOKEN_HEADER_NAME } from '@/config/settings.js'
export default {
data() {
return {
action: UPLOAD_IMG,
img_url: config.img_url,
show: false,
drugUserInfo: null,
type: '',
fileList: [],
address: {},
url: '' ,// 保存进来的地址 防止用户添加信息后 返回路径混乱
// 购买的商品数据
goodsId: '',
isSituation: 0,
num: '',
price: '',
goodSkuParam: '',
prescriptionId: 0,
isZone: '',
prescription: null, // 0 从home页来 1 从商品页来
createOrderType: '',
orderType: '',
payType: ''
}
},
onLoad(options) {
// 保存用户从那里来 选择地址后 原来返回
let pages_url = getCurrentPages();
this.url = pages_url[pages_url.length -2].route;
this.orderType = options.orderType;
this.payType = options.payType;
this.createOrderType = options.createOrderType;
this.goodsId = options.goodsId;
this.isSituation = options.isSituation;
this.num = options.num;
this.price = options.price;
this.goodSkuParam = options.goodSkuParam;
this.prescriptionId = options.prescriptionId
this.isZone = options.isZone
this.prescription = this.prescription == 0 ? 0: 1;// 0 从home页来 1 从商品页来
this.type = options.type
uni.$on('uploadDrugUserInfo', obj => {
console.log('-------------')
this.drugUserInfo = obj
})
uni.$on('getAddressId', obj => {
// 获取用户选择的地址
this.drugUserInfo = obj
})
},
onUnload() {
uni.$off('uploadDrugUserInfo');
uni.$off('getAddressId');
this.$tools.navigateTo({
url: this.url
})
},
computed: {
headerOptions () {
return {
[TOKEN_HEADER_NAME]: this.$store.state.userToken
}
}
},
methods: {
// 查看示例图
lookMode() {
this.show = true;
},
toCloseShow() {
this.show = false;
},
toSuccess() {
console.log(this.fileList)
if (!this.fileList.length) return this.$Toast('请上传处方照片')
if (!this.drugUserInfo) return this.$Toast('请添加用药人信息');
this.$api('patter', { drugUserId: this.drugUserInfo.id, pic: this.fileList.join() })
.then(res => {
console.log(res.result.id)
if (res.code === 200) {
if(this.type == 'prescription'){
this.$tools.navigateTo({
url: `/pagesC/subscribe/confirmSubscribe?addressId=${this.drugUserInfo.id}&orderType=${this.orderType}&imgUploadShow=${this.fileList.toString()}&medicineMan=${JSON.stringify(this.drugUserInfo)}&goodsId=${this.goodsId}&num=${this.num}&price=${this.price}&goodSkuParam=${this.goodSkuParam}&prescriptionId=${this.drugUserInfo.id}&createOrderType=${this.createOrderType}&payType=${this.payType}&isZone=${this.isZone}&patterId=${res.result.id}`
})
}else {
uni.navigateTo({
url: "./../success/index"
})
}
}else{
this.$Toast(res.message)
}
}).catch(err => {
this.$Toast(err.message)
})
},
selectUser () {
this.$tools.navigateTo({
url: `/pagesA/my_other_list/prescription/select_medicine_man/index?type=${this.type}&goodsId=${this.goodsId}&isSituation=${this.isSituation}&num=${this.num}&price=${this.price}&goodSkuParam=${this.goodSkuParam}&prescriptionId=${this.prescriptionId}`
})
},
uploadSuccess (res) {
this.fileList.push(res.result)
},
uploadErr (err) {
console.log(res)
},
uploadRemove (index, lists) {
this.fileList.splice(index, 1)
}
}
}
</script>
<style lang="scss" scoped>
.medicine {
padding-bottom: 140rpx;
}
.top{
position: fixed;
z-index: -1;
top: 0;
left: 0;
width: 100%;
height: 636rpx;
background: linear-gradient(180deg,#01aeea, #f1fbff);
}
.steps{
font-size: 28rpx;
color: #E9E9E9;
padding-top: 57rpx;
padding-left: 17rpx;
display: flex;
align-items: center;
text{
padding-right: 7rpx;
padding-left: 7rpx;
}
}
.card{
width: 717rpx;
margin: 0 auto;
margin-top: 60rpx ;
border-radius: 12rpx;
background-color: #fff;
.title_box{
display: flex;
justify-content: space-between;
align-items: center;
padding-top: 17rpx;
box-sizing: border-box;
.title{
font-size: 34rpx;
font-weight: bold;
margin-left: 28rpx;
color: #000;
}
.look{
// width: 136rpx;
height: 48rpx;
padding: 10rpx;
background-color: #eee;
border-radius: 18rpx;
border: 1px solid #01AEEA;
color: #01AEEA;
font-size: 30rpx;
margin-right: 10rpx;
display: flex;
justify-content: center;
align-items: center;
}
}
.hint_info{
display: inline-block;
padding-top: 27rpx;
padding-bottom: 44rpx;
margin-left: 28rpx;
font-size: 30rpx;
box-sizing: border-box;
color: #B7B7B7;
}
.upload{
padding-left: 10rpx;
padding-bottom: 44rpx;
}
}
.user{
width: 717rpx;
margin: 15rpx auto 0;
border-radius: 12rpx;
background-color: #fff;
box-shadow: 0 3px 6px 0 rgba(0,0,0,0.16);
.to_medicine_man{
display: flex;
align-items: center;
justify-content: space-between;
.title{
padding-left: 28rpx;
padding-top: 30rpx;
padding-bottom: 30rpx;
font-size: 32rpx;
}
/deep/ .u-icon__icon{
padding-right: 37rpx;
}
}
}
.footer {
width: 100%;
position: fixed;
left: 0;
bottom: 0;
background: #fff;
height: 120rpx;
}
.add_btn{
width: 668rpx;
height: 88rpx;
border-radius: 38rpx;
background-color: #01AEEA;
text-align: center;
line-height: 88rpx;
color: #fff;
font-size: 32rpx;
}
.mask{
position: fixed;
top: 0;
left: 0;
z-index: 22;
width: 100%;
height: 100%;
background-color: #000;
.show_box{
width: 750rpx;
height: 100vh;
.clear_medicine_pic{
display: flex;
justify-content: flex-end;
padding-top: 42rpx;
padding-right: 46rpx;
padding-bottom: 50rpx;
height: 140rpx;
box-sizing: border-box;
}
.medicine_pic{
width: 750rpx;
height: 1026rpx;
}
}
}
.box {
margin-left: 24rpx;
display: flex;
flex-direction: column;
.name_box {
font-size: 28rpx;
color: #000;
margin-top: 37rpx;
margin-bottom: 17rpx;
.name_btn {
margin-left: 10rpx;
font-size: 24rpx;
color: #0C85FF;
border-radius: 10rpx;
border: 1px solid #0C85FF;
padding: 5rpx 10rpx;
}
}
.other_info {
display: flex;
font-size: 24rpx;
padding-bottom: 23rpx;
color: #000;
text {
margin-right: 38rpx;
}
}
}
</style>