<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>
|