头像上传裁剪
This commit is contained in:
parent
7ef82dab29
commit
c3ef53d336
@ -13,18 +13,11 @@ Page({
|
||||
imglist: []
|
||||
},
|
||||
onLoad(options){
|
||||
console.log("onLoad", options)
|
||||
this.setData({
|
||||
order_inquiry_id: options.order_inquiry_id
|
||||
})
|
||||
//获取患者问诊病例
|
||||
api.getDoctorInquiryCase({order_inquiry_id: this.data.order_inquiry_id}).then(response => {
|
||||
console.log(response);
|
||||
this.setData({
|
||||
case_detail: response.data
|
||||
})
|
||||
}).then(res => {
|
||||
this.formatImgList();
|
||||
}).catch(errors => {console.error(errors);})
|
||||
|
||||
},
|
||||
formatImgList(){
|
||||
let diagnose_images = this.data.case_detail.diagnose_images;
|
||||
@ -40,7 +33,15 @@ Page({
|
||||
})
|
||||
},
|
||||
onShow(){
|
||||
|
||||
//获取患者问诊病例
|
||||
api.getDoctorInquiryCase({order_inquiry_id: this.data.order_inquiry_id}).then(response => {
|
||||
console.log(response);
|
||||
this.setData({
|
||||
case_detail: response.data
|
||||
})
|
||||
}).then(res => {
|
||||
this.formatImgList();
|
||||
}).catch(errors => {console.error(errors);})
|
||||
},
|
||||
|
||||
})
|
||||
@ -8,7 +8,7 @@
|
||||
<view class="sex">{{case_detail.sex==1?'男':case_detail.sex==2?'女':'未知'}}|{{case_detail.age}}岁 </view>
|
||||
</view>
|
||||
<view class="info">
|
||||
<view class="height info_item"><text class="info_title">身高:</text><text class="info_val">{{case_detail.height==null?'未知':case_detail.height}}cm</text></view>
|
||||
<view class="height info_item"><text class="info_title">身高:</text><text class="info_val">{{case_detail.height==null?'未知':case_detail.height}}CM</text></view>
|
||||
<view class="weight info_item"><text class="info_title">体重:</text><text class="info_val">{{case_detail.weight==null?'未知':case_detail.weight}}KG</text></view>
|
||||
<view class="minzu info_item"><text class="info_title">民族:</text><text class="info_val">{{case_detail.nation_name==''?'未知':case_detail.nation_name}}</text></view>
|
||||
<view class="zhiye info_item"><text class="info_title">职业:</text><text class="info_val">{{case_detail.job_name==''?'未知':case_detail.job_name}}</text></view>
|
||||
@ -58,8 +58,9 @@
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<view class="main_title" wx:if="{{case_detail.is_allergy_history != null && case_detail.is_family_history != null && case_detail.is_pregnant != null && case_detail.drink_wine_status != null && case_detail.smoke_status != null && case_detail.is_operation != null && case_detail.chemical_compound_status != null && case_detail.chemical_compound_status != null}}">其他信息</view>
|
||||
<view class="data_box orther" wx:if="{{case_detail.is_allergy_history != null && case_detail.is_family_history != null && case_detail.is_pregnant != null && case_detail.drink_wine_status != null && case_detail.smoke_status != null && case_detail.is_operation != null && case_detail.chemical_compound_status != null && case_detail.chemical_compound_status != null}}">
|
||||
|
||||
<view class="main_title" wx:if="{{!(case_detail.is_allergy_history == null && case_detail.is_family_history == null && case_detail.is_pregnant == null && case_detail.drink_wine_status == null && case_detail.smoke_status == null && case_detail.is_operation == null && case_detail.chemical_compound_status == null && case_detail.chemical_compound_status == null)}}">其他信息</view>
|
||||
<view class="data_box orther" wx:if="{{!(case_detail.is_allergy_history == null && case_detail.is_family_history == null && case_detail.is_pregnant == null && case_detail.drink_wine_status == null && case_detail.smoke_status == null && case_detail.is_operation == null && case_detail.chemical_compound_status == null && case_detail.chemical_compound_status == null)}}">
|
||||
<view class="disease_box">
|
||||
<view class="disease_box_item" wx:if="{{case_detail.is_allergy_history != null}}">
|
||||
<view class="title">过敏史:</view>
|
||||
@ -89,7 +90,7 @@
|
||||
<view class="title">接触化学物:</view>
|
||||
<view class="conent">{{case_detail.chemical_compound_status==1?'从不':case_detail.chemical_compound_status==2?'偶尔':case_detail.chemical_compound_status==3?'经常':case_detail.chemical_compound_status==4?'每天':'其他'}}</view>
|
||||
</view>
|
||||
<view class="disease_info" wx:if="{{case_detail.chemical_compound_describe != null}}">
|
||||
<view class="disease_info" wx:if="{{case_detail.chemical_compound_describe != '' && case_detail.chemical_compound_describe != null}}">
|
||||
详细描述:{{case_detail.chemical_compound_describe}}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@ -66,6 +66,9 @@ Page({
|
||||
console.log("onChange: ", detail);
|
||||
if(detail){
|
||||
this.setData({ note: this.data.open_note });
|
||||
wx.vibrateShort({
|
||||
"type": "heavy"
|
||||
})
|
||||
}else{
|
||||
this.setData({ note: this.data.close_note });
|
||||
}
|
||||
|
||||
@ -61,6 +61,9 @@ Page({
|
||||
let check = this.checkPrice(inquiry_price);
|
||||
if(!check) return;
|
||||
this.setData({ note: this.data.open_note });
|
||||
wx.vibrateShort({
|
||||
"type": "heavy"
|
||||
})
|
||||
}else{
|
||||
this.setData({ note: this.data.close_note });
|
||||
}
|
||||
|
||||
@ -47,6 +47,9 @@ Page({
|
||||
},
|
||||
onStepperChange(event) {
|
||||
console.log(event.detail);
|
||||
wx.vibrateShort({
|
||||
"type": "heavy"
|
||||
})
|
||||
this.setData({
|
||||
"info.work_num_day": event.detail
|
||||
});
|
||||
|
||||
@ -12,7 +12,6 @@ Page({
|
||||
license_cert: [],
|
||||
qualification_cert: [],
|
||||
work_cert: [],
|
||||
license_cert_visible: false
|
||||
},
|
||||
onLoad(){
|
||||
api.getDoctorCret().then(response => {
|
||||
@ -24,20 +23,13 @@ Page({
|
||||
})
|
||||
}).catch(errors => {console.error(errors);})
|
||||
},
|
||||
show_license_cert(){
|
||||
console.log("show_license_cert")
|
||||
this.setData({
|
||||
license_cert_visible: true
|
||||
previewImage(e){
|
||||
let name = e.currentTarget.dataset.name;
|
||||
let name_date = this.data[name]
|
||||
|
||||
wx.previewImage({
|
||||
current: name_date[0], // 当前显示图片的http链接
|
||||
urls: name_date // 需要预览的图片http链接列表
|
||||
})
|
||||
},
|
||||
close_license_cert(e) {
|
||||
const {
|
||||
detail: { trigger },
|
||||
} = e;
|
||||
console.log("trigger: ", trigger);
|
||||
console.log("close_license_cert")
|
||||
this.setData({
|
||||
license_cert_visible: false,
|
||||
});
|
||||
},
|
||||
}
|
||||
})
|
||||
@ -2,7 +2,6 @@
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"te-nav-bar": "/commpents/te_navbar",
|
||||
"t-image": "tdesign-miniprogram/image/image",
|
||||
"t-image-viewer": "tdesign-miniprogram/image-viewer/image-viewer"
|
||||
"t-image": "tdesign-miniprogram/image/image"
|
||||
}
|
||||
}
|
||||
@ -12,7 +12,8 @@
|
||||
style="margin: 0 50rpx 0 20rpx;"
|
||||
width="220rpx" height="220rpx"
|
||||
aria-label="img" wx:for="{{license_cert}}"
|
||||
bindtap="show_license_cert" />
|
||||
data-name="license_cert"
|
||||
bindtap="previewImage" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="imgbox_item">
|
||||
@ -25,7 +26,9 @@
|
||||
mode="heightFix"
|
||||
style="margin: 0 50rpx 0 20rpx;"
|
||||
width="220rpx" height="220rpx"
|
||||
aria-label="img" wx:for="{{qualification_cert}}" />
|
||||
aria-label="img" wx:for="{{qualification_cert}}"
|
||||
data-name="qualification_cert"
|
||||
bindtap="previewImage"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="imgbox_item">
|
||||
@ -37,18 +40,10 @@
|
||||
mode="heightFix"
|
||||
style="margin: 0 50rpx 20rpx 20rpx;"
|
||||
width="220rpx" height="220rpx"
|
||||
aria-label="img" wx:for="{{work_cert}}" />
|
||||
aria-label="img" wx:for="{{work_cert}}"
|
||||
data-name="work_cert"
|
||||
bindtap="previewImage"/>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- <t-image-viewer
|
||||
deleteBtn="{{false}}"
|
||||
close-btn="{{true}}"
|
||||
show-index="{{true}}"
|
||||
visible="{{license_cert_visible}}"
|
||||
images="{{license_cert}}"
|
||||
bind:close="close_license_cert"
|
||||
></t-image-viewer> -->
|
||||
|
||||
</view>
|
||||
@ -88,7 +88,11 @@ Page({
|
||||
onChange({ detail }) {
|
||||
console.log("onChange: ", detail);
|
||||
|
||||
|
||||
if(detail){
|
||||
wx.vibrateShort({
|
||||
"type": "heavy"
|
||||
})
|
||||
}
|
||||
//修改开关
|
||||
let params = {};
|
||||
params.inquiry_type = this.data.inquiry_type;//接诊类型(1:专家问诊 2:快速问诊 3:公益问诊 4:问诊购药)
|
||||
@ -98,7 +102,6 @@ Page({
|
||||
console.log(response);
|
||||
}).then(()=>{
|
||||
if(detail){
|
||||
|
||||
let tmplIds = ['G1RIs0RYqsTQ2CuPQWalIMyb6_deuEEbJfajfhGvNzc']
|
||||
let sub_promise = requestSubscribeMessage(tmplIds)
|
||||
sub_promise.then(res => {
|
||||
|
||||
@ -150,6 +150,9 @@ Page({
|
||||
},
|
||||
onStepperChange(event) {
|
||||
console.log(event.detail);
|
||||
wx.vibrateShort({
|
||||
"type": "heavy"
|
||||
})
|
||||
this.setData({
|
||||
"info.work_num_day": event.detail
|
||||
});
|
||||
@ -160,6 +163,9 @@ Page({
|
||||
},
|
||||
|
||||
onColumnChange(e) {
|
||||
wx.vibrateShort({
|
||||
"type": "heavy"
|
||||
})
|
||||
console.log('picker pick:', e);
|
||||
},
|
||||
|
||||
|
||||
@ -525,23 +525,26 @@ Component({
|
||||
},
|
||||
// 获取消息ID
|
||||
handleLongPress(e) {
|
||||
for (let index = 0; index < this.data.messageList.length; index++) {
|
||||
// for (let index = 0; index < this.data.messageList.length; index++) {
|
||||
|
||||
if (this.data.messageList[index].status === 'success') {
|
||||
// if (this.data.messageList[index].status === 'success') {
|
||||
const { index } = e.currentTarget.dataset;
|
||||
let message = this.data.messageList[index];
|
||||
// let message = this.data.messageList[index];
|
||||
// console.log(message)
|
||||
if(message.type === 'TIMCustomElem'){
|
||||
return
|
||||
}
|
||||
// if(message.type === 'TIMCustomElem'){
|
||||
// return
|
||||
// }
|
||||
|
||||
this.setData({
|
||||
messageID: e.currentTarget.id,
|
||||
selectedMessage: this.data.messageList[index],
|
||||
Show: true,
|
||||
});
|
||||
}
|
||||
}
|
||||
wx.vibrateShort({
|
||||
"type": "heavy"
|
||||
})
|
||||
// }
|
||||
// }
|
||||
},
|
||||
// 更新 messagelist
|
||||
updateMessageByID(deleteMessageID) {
|
||||
|
||||
1142
commpents/image-cropper/image-cropper.js
Normal file
1142
commpents/image-cropper/image-cropper.js
Normal file
File diff suppressed because it is too large
Load Diff
3
commpents/image-cropper/image-cropper.json
Normal file
3
commpents/image-cropper/image-cropper.json
Normal file
@ -0,0 +1,3 @@
|
||||
{
|
||||
"component": true
|
||||
}
|
||||
32
commpents/image-cropper/image-cropper.wxml
Normal file
32
commpents/image-cropper/image-cropper.wxml
Normal file
@ -0,0 +1,32 @@
|
||||
<view class='image-cropper' catchtouchmove='_preventTouchMove' wx:if="{{show_cropper}}">
|
||||
<view class='main' id="main" bindtouchend="_cutTouchEnd" bindtouchstart="_cutTouchStart" bindtouchmove="_cutTouchMove">
|
||||
<view class='content'>
|
||||
<view class='content_top bg_gray {{_flag_bright?"":"bg_black"}}' style="height:{{cut_top}}px;transition-property:{{_cut_animation?'':'background'}}"></view>
|
||||
<view class='content_middle' style="height:{{height}}px;">
|
||||
<view class='content_middle_left bg_gray {{_flag_bright?"":"bg_black"}}' style="width:{{cut_left}}px;transition-property:{{_cut_animation?'':'background'}}"></view>
|
||||
<view class='content_middle_middle' style="width:{{width}}px;height:{{height}}px;transition-duration: .3s;transition-property:{{_cut_animation?'':'background'}};">
|
||||
<view class="border border-top-left"></view>
|
||||
<view class="border border-top-right"></view>
|
||||
<view class="border border-right-top"></view>
|
||||
<view class="border border-right-bottom"></view>
|
||||
<view class="border border-bottom-right"></view>
|
||||
<view class="border border-bottom-left"></view>
|
||||
<view class="border border-left-bottom"></view>
|
||||
<view class="border border-left-top"></view>
|
||||
</view>
|
||||
<view class='content_middle_right bg_gray {{_flag_bright?"":"bg_black"}}' style="transition-property:{{_cut_animation?'':'background'}}"></view>
|
||||
</view>
|
||||
<view class='content_bottom bg_gray {{_flag_bright?"":"bg_black"}}' style="transition-property:{{_cut_animation?'':'background'}}"></view>
|
||||
</view>
|
||||
<image bindload="imageLoad" bindtouchstart="_start" bindtouchmove="_move" bindtouchend="_end" style="width:{{img_width ? img_width + 'px' : 'auto'}};height:{{img_height ? img_height + 'px' : 'auto'}};transform:translate3d({{_img_left-img_width/2}}px,{{_img_top-img_height/2}}px,0) scale({{scale}}) rotate({{angle}}deg);transition-duration:{{_cut_animation?.4:0}}s;" class='img' src='{{imgSrc}}'></image>
|
||||
</view>
|
||||
<canvas canvas-id='image-cropper' disable-scroll="true" style="width:{{_canvas_width * export_scale}}px;height:{{_canvas_height * export_scale}}px;left:{{canvas_left}}px;top:{{canvas_top}}px" class='image-cropper-canvas'></canvas>
|
||||
<view class="btn_box">
|
||||
<view class="btn">
|
||||
<button bindtap="cnacle" class="btn_cancle">取消</button>
|
||||
</view>
|
||||
<view class="btn">
|
||||
<button bindtap="_click" class="btn_confirm">确定</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
144
commpents/image-cropper/image-cropper.wxss
Normal file
144
commpents/image-cropper/image-cropper.wxss
Normal file
@ -0,0 +1,144 @@
|
||||
.image-cropper{
|
||||
background:rgba(14, 13, 13,.8);
|
||||
position: fixed;
|
||||
top:0;
|
||||
left:0;
|
||||
width:100vw;
|
||||
height:100vh;
|
||||
z-index: 2;
|
||||
}
|
||||
.image-cropper .main{
|
||||
position: absolute;
|
||||
width:100vw;
|
||||
height:100vh;
|
||||
overflow: hidden;
|
||||
}
|
||||
.image-cropper .content{
|
||||
z-index: 9;
|
||||
position: absolute;
|
||||
width:100vw;
|
||||
height:100vh;
|
||||
display: flex;
|
||||
flex-direction:column;
|
||||
pointer-events:none;
|
||||
}
|
||||
.image-cropper .bg_black{
|
||||
background: rgba(0, 0, 0, 0.8)!important;
|
||||
}
|
||||
.image-cropper .bg_gray{
|
||||
background: rgba(0, 0, 0, 0.45);
|
||||
transition-duration: .35s;
|
||||
}
|
||||
.image-cropper .content>.content_top{
|
||||
pointer-events:none;
|
||||
}
|
||||
.image-cropper .content>.content_middle{
|
||||
display: flex;
|
||||
height: 200px;
|
||||
width:100%;
|
||||
}
|
||||
.image-cropper .content_middle_middle{
|
||||
width:200px;
|
||||
box-sizing:border-box;
|
||||
position: relative;
|
||||
transition-duration: .3s;
|
||||
}
|
||||
.image-cropper .content_middle_right{
|
||||
flex: auto;
|
||||
}
|
||||
.image-cropper .content>.content_bottom{
|
||||
flex: auto;
|
||||
}
|
||||
.image-cropper .img{
|
||||
z-index: 2;
|
||||
top:0;
|
||||
left:0;
|
||||
position: absolute;
|
||||
border:none;
|
||||
width:100%;
|
||||
backface-visibility: hidden;
|
||||
transform-origin:center;
|
||||
}
|
||||
.image-cropper .image-cropper-canvas{
|
||||
position: fixed;
|
||||
background: white;
|
||||
width:150px;
|
||||
height:150px;
|
||||
z-index: 10;
|
||||
top:-200%;
|
||||
pointer-events:none;
|
||||
}
|
||||
.image-cropper .border{
|
||||
background: white;
|
||||
pointer-events:auto;
|
||||
position:absolute;
|
||||
}
|
||||
.image-cropper .border-top-left{
|
||||
left:-2.5px;
|
||||
top:-2.5px;
|
||||
height:2.5px;
|
||||
width:33rpx;
|
||||
}
|
||||
.image-cropper .border-top-right{
|
||||
right:-2.5px;
|
||||
top:-2.5px;
|
||||
height:2.5px;
|
||||
width:33rpx;
|
||||
}
|
||||
.image-cropper .border-right-top{
|
||||
top:-1px;
|
||||
width:2.5px;
|
||||
height:30rpx;
|
||||
right:-2.5px;
|
||||
}
|
||||
.image-cropper .border-right-bottom{
|
||||
width:2.5px;
|
||||
height:30rpx;
|
||||
right:-2.5px;
|
||||
bottom:-1px;
|
||||
}
|
||||
.image-cropper .border-bottom-left{
|
||||
height:2.5px;
|
||||
width:33rpx;
|
||||
bottom:-2.5px;
|
||||
left:-2.5px;
|
||||
}
|
||||
.image-cropper .border-bottom-right{
|
||||
height:2.5px;
|
||||
width:33rpx;
|
||||
bottom:-2.5px;
|
||||
right:-2.5px;
|
||||
}
|
||||
.image-cropper .border-left-top{
|
||||
top:-1px;
|
||||
width:2.5px;
|
||||
height:30rpx;
|
||||
left:-2.5px;
|
||||
}
|
||||
.image-cropper .border-left-bottom{
|
||||
width:2.5px;
|
||||
height:30rpx;
|
||||
left:-2.5px;
|
||||
bottom:-1px;
|
||||
}
|
||||
.btn_box{
|
||||
z-index: 9;
|
||||
position: absolute;
|
||||
display: flex;
|
||||
bottom: 0rpx;
|
||||
justify-content: center;
|
||||
width: 100vw;
|
||||
}
|
||||
.btn{
|
||||
font-weight: 600;
|
||||
text-align: center;
|
||||
margin: 60rpx 20rpx;
|
||||
flex: 1;
|
||||
}
|
||||
.btn_cancle{
|
||||
/* width: 100rpx; */
|
||||
}
|
||||
.btn_confirm{
|
||||
background-color: #3CC7C0;
|
||||
color: #fff;
|
||||
}
|
||||
@ -85,8 +85,11 @@ Component({
|
||||
zhuanchang_note: '请选择专长',
|
||||
jianjie_show: false,
|
||||
shanchang_show: false,
|
||||
show_cropper: false,
|
||||
img_cropper_src: '',
|
||||
img_cropper_width: 250, //宽度
|
||||
img_cropper_height: 250, //高度
|
||||
},
|
||||
|
||||
options: {
|
||||
addGlobalClass: true,
|
||||
styleIsolation: 'apply-shared'
|
||||
@ -901,6 +904,16 @@ Component({
|
||||
})
|
||||
},
|
||||
doUploadPhoto(event) {
|
||||
const { file } = event.detail;
|
||||
this.setData({
|
||||
photoEvent: event,
|
||||
img_cropper_src: file.url,
|
||||
show_cropper: true
|
||||
})
|
||||
this.loadimage()
|
||||
},
|
||||
OSSUpload(fileurl){
|
||||
let event = this.data.photoEvent
|
||||
console.log("index douploadFIle: ", event);
|
||||
const scene = event.currentTarget.dataset.scene;
|
||||
const field_name = event.currentTarget.dataset.field_name;
|
||||
@ -919,7 +932,7 @@ Component({
|
||||
const ossAccessKeyId = response.data.accessid;
|
||||
const policy = response.data.policy;
|
||||
const key = response.data.dir+filename;
|
||||
const filePath = file.url; // 待上传文件的文件路径。
|
||||
const filePath = fileurl; // 待上传文件的文件路径。
|
||||
wx.uploadFile({
|
||||
url: host, // 开发者服务器的URL。
|
||||
filePath: filePath,
|
||||
@ -982,6 +995,29 @@ Component({
|
||||
},
|
||||
moveZhuanChang(){
|
||||
|
||||
}
|
||||
},
|
||||
cropperload(e) {
|
||||
console.log("cropper初始化完成");
|
||||
},
|
||||
loadimage(e) {
|
||||
this.cropper = this.selectComponent("#image-cropper");
|
||||
//重置图片角度、缩放、位置
|
||||
this.cropper.imgReset();
|
||||
this.triggerEvent('showPageMeta');
|
||||
},
|
||||
clickcut(e) {
|
||||
console.log(e);
|
||||
// //点击裁剪框阅览图片
|
||||
// wx.previewImage({
|
||||
// current: e.detail.url, // 当前显示图片的http链接
|
||||
// urls: [e.detail.url] // 需要预览的图片http链接列表
|
||||
// })
|
||||
|
||||
this.OSSUpload(e.detail.url)
|
||||
this.setData({
|
||||
show_cropper: false
|
||||
})
|
||||
this.triggerEvent('hidePageMeta');
|
||||
},
|
||||
}
|
||||
})
|
||||
|
||||
@ -21,6 +21,7 @@
|
||||
"van-icon": "@vant/weapp/icon/index",
|
||||
"van-search": "@vant/weapp/search/index",
|
||||
"van-empty": "@vant/weapp/empty/index",
|
||||
"van-image": "@vant/weapp/image/index"
|
||||
"van-image": "@vant/weapp/image/index",
|
||||
"image-cropper": "/commpents/image-cropper/image-cropper"
|
||||
}
|
||||
}
|
||||
|
||||
@ -366,3 +366,5 @@
|
||||
|
||||
|
||||
<van-toast id="van-toast" />
|
||||
|
||||
<image-cropper show_cropper="{{show_cropper}}" id="image-cropper" limit_move="{{true}}" disable_rotate="{{true}}" width="{{img_cropper_width}}" height="{{img_cropper_height}}" imgSrc="{{img_cropper_src}}" disable_height="{{true}}" disable_width="{{true}}" disable_ratio="{{true}}" min_scale="0.1" max_scale="5" bindload="cropperload" bindimageload="loadimage" bindtapcut="clickcut"></image-cropper>
|
||||
Loading…
x
Reference in New Issue
Block a user