1.22 分包
This commit is contained in:
zoujiandong
parent
2bd2fd31ac
commit
48a8c3ebab
@ -1,5 +1,5 @@
|
||||
// Pages/index/index.js
|
||||
import { API } from './../../utils/network/api'
|
||||
import { API } from '../../utils/network/api'
|
||||
const api = new API()
|
||||
const app = getApp()
|
||||
Page({
|
||||
|
||||
@ -412,13 +412,7 @@ Page({
|
||||
let multi_point_status = this.data.info.multi_point_status;
|
||||
//绑定结算银行卡
|
||||
var is_bind_bank = this.data.info.is_bind_bank;
|
||||
//是否参加专家图文接诊（0:否 1:是）
|
||||
|
||||
// let is_img_expert_reception = this.data.info.is_img_expert_reception;
|
||||
// //是否参加专家快速接诊（0:否 1:是）
|
||||
// let is_img_quick_reception = this.data.info.is_img_quick_reception;
|
||||
// //是否参加专家公益接诊（0:否 1:是）
|
||||
// let is_img_welfare_reception = this.data.info.is_img_welfare_reception;
|
||||
|
||||
let usertype = wx.getStorageSync('usertype');
|
||||
let userID = wx.getStorageSync('user_id_'+usertype);
|
||||
@ -584,7 +578,7 @@ Page({
|
||||
});
|
||||
wx.setStorageSync('jiesuan_dialog_show', true);
|
||||
}
|
||||
// (is_img_expert_reception + is_img_quick_reception + is_img_welfare_reception) == 0
|
||||
|
||||
let flag=false;
|
||||
if(this.data.doctor_inquiry_config){
|
||||
flag=this.data.doctor_inquiry_config.every((item)=>{
|
||||
@ -620,29 +614,6 @@ Page({
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
|
||||
//开启在线问诊
|
||||
// var is_img_expert_reception = this.data.info.is_img_expert_reception;
|
||||
// if(is_img_expert_reception == 0 ){
|
||||
// if(!this.data.default_dialog_show){
|
||||
// this.setData({
|
||||
// // dialog_visible: true,
|
||||
// });
|
||||
// }
|
||||
// this.setData({
|
||||
// "info.info_shiming_status_txt": "开启在线问诊",
|
||||
// "info.info_shiming_status": "info_shiming_status_yes",
|
||||
// shiming_status_url: "/user/pages/yishi/onlinesetup/index",
|
||||
// dialog_content: "请您先前往在线问诊管理中，开通在线问诊",
|
||||
// default_dialog_show: true
|
||||
// })
|
||||
// return false;
|
||||
// }
|
||||
|
||||
|
||||
|
||||
this.setData({
|
||||
"info.info_shiming_status_txt": "去接诊",
|
||||
shiming_status_url: "/Pages/yishi/wenzhen_v2/wenzhen",
|
||||
|
||||
@ -3,7 +3,6 @@
|
||||
"usingComponents": {
|
||||
"t-avatar": "tdesign-miniprogram/avatar/avatar",
|
||||
"van-button": "@vant/weapp/button/index",
|
||||
"t-swiper": "tdesign-miniprogram/swiper/swiper",
|
||||
"t-badge": "tdesign-miniprogram/badge/badge",
|
||||
"t-dialog": "tdesign-miniprogram/dialog/dialog",
|
||||
"van-image": "@vant/weapp/image/index",
|
||||
|
||||
@ -94,18 +94,6 @@
|
||||
</view>
|
||||
<!-- 广告版块 -->
|
||||
<view class="ad">
|
||||
<!-- <t-swiper
|
||||
height="110rpx"
|
||||
duration="{{duration}}"
|
||||
interval="{{interval}}"
|
||||
navigation="{{ { type: 'dots' } }}"
|
||||
list="{{swiperList}}"
|
||||
bind:click="onTapAD"
|
||||
bind:change="onChangeAD"
|
||||
data-url="123"
|
||||
wx:if="{{!skeleton_loading}}"
|
||||
>
|
||||
</t-swiper> -->
|
||||
<swiper class="swiper" indicator-dots="{{true}}" circular="{{true}}" indicator-active-color="#3CC7C0" autoplay="{{true}}" interval="3000">
|
||||
<block wx:for="{{banner}}" wx:key="*this">
|
||||
<swiper-item>
|
||||
@ -210,19 +198,7 @@
|
||||
<view slot="cancel-btn" class="dialog dialog_cancel_btn" bindtap="cancelContactDialog">
|
||||
取消
|
||||
</view>
|
||||
<!-- <view slot="confirm-btn" class="dialog dialog_confirm_btn" open-type="contact">
|
||||
<t-button theme="primary" size="large" open-type="contact">确认</t-button>
|
||||
</view> -->
|
||||
</t-dialog>
|
||||
|
||||
<!-- <van-dialog
|
||||
title="立即联系客服"
|
||||
show="{{ contactKeFu }}"
|
||||
show-cancel-button
|
||||
confirm-button-color="#3CC7C0"
|
||||
confirm-button-open-type="contact"
|
||||
/> -->
|
||||
|
||||
<van-overlay show="{{ overlay_show }}" z-index="999999999999">
|
||||
<van-image class="overlay_show"
|
||||
fit="widthFix"
|
||||
@ -245,7 +221,6 @@
|
||||
确定
|
||||
</view>
|
||||
</t-dialog>
|
||||
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
@ -41,25 +41,6 @@ Page({
|
||||
dot_5: false,
|
||||
},
|
||||
onLoad() {
|
||||
// if(wx.$TUIKit){
|
||||
// wx.$TUIKit.on(wx.$TUIKitTIM.EVENT.MESSAGE_RECEIVED, this.$onMessageReceived, this);
|
||||
// }else{
|
||||
// app.imInit().then(res => {
|
||||
// // console.log("wenzhen onload imInit");
|
||||
// wx.$TUIKit.on(wx.$TUIKitTIM.EVENT.MESSAGE_RECEIVED, this.$onMessageReceived, this);
|
||||
// });
|
||||
// }
|
||||
|
||||
//监听网络状态变化事件
|
||||
wx.onNetworkStatusChange(function (res) {
|
||||
// console.log("onNetworkStatusChange from wenzhen: ")
|
||||
// console.log(res.isConnected)
|
||||
// console.log(res.networkType)
|
||||
// wx.showToast({
|
||||
// title: '网络类型'+res.networkType,
|
||||
// })
|
||||
})
|
||||
|
||||
},
|
||||
initInterval(){
|
||||
let _this = this;
|
||||
@ -90,7 +71,6 @@ Page({
|
||||
this.setData({
|
||||
unreadnnum_inter: unreadnnum_inter
|
||||
})
|
||||
// console.log("app.globalData.unreadnnum_inter: ", app.globalData.unreadnnum_inter);
|
||||
},
|
||||
onShow: function () {
|
||||
//console.log("onShow from wenzhen V2")
|
||||
@ -123,7 +103,6 @@ Page({
|
||||
wx.$TUIKit.on(wx.$TUIKitTIM.EVENT.MESSAGE_RECEIVED, this.$onMessageReceived, this);
|
||||
}else{
|
||||
app.imInit().then(res => {
|
||||
// console.log("wenzhen onload imInit");
|
||||
wx.$TUIKit.on(wx.$TUIKitTIM.EVENT.SDK_READY, this.onSDKReady, this);
|
||||
wx.$TUIKit.on(wx.$TUIKitTIM.EVENT.MESSAGE_RECEIVED, this.$onMessageReceived, this);
|
||||
});
|
||||
@ -173,19 +152,15 @@ Page({
|
||||
this.getConversationList();
|
||||
},
|
||||
getConversationList(){
|
||||
// console.log("getConversationListgetConversationListgetConversationList");
|
||||
app.imInit().then(res => {
|
||||
// console.log("wenzhen onload imInit: ", res);
|
||||
|
||||
|
||||
wx.$TUIKit.getConversationList().then((imResponse) => {
|
||||
// console.log("imResponse.data.conversationList from wenzhen_v2: ", imResponse.data.conversationList);
|
||||
//console.log("监听会话接口列表")
|
||||
console.log(imResponse.data.conversationList)
|
||||
this.setData({
|
||||
conversationList: imResponse.data.conversationList,
|
||||
});
|
||||
}).then(() => {
|
||||
// console.log("开始查询订单状态")
|
||||
this.formatStatus();
|
||||
}).catch(error => {
|
||||
console.error(error)
|
||||
@ -205,95 +180,6 @@ Page({
|
||||
const message = value.data[0];
|
||||
// console.log("message from wenzhen: ",message)
|
||||
this.getConversationList();
|
||||
// let cloudCustomData = JSON.parse(message.cloudCustomData);
|
||||
// let inquiry_type = cloudCustomData.inquiry_type;
|
||||
// let order_inquiry_id = cloudCustomData.order_inquiry_id;
|
||||
// let type = message.type;
|
||||
// let message_txt = "新消息";
|
||||
// console.log(type)
|
||||
// switch (type) {
|
||||
// case TIM.TYPES.MSG_TEXT:
|
||||
// console.log("文本消息");
|
||||
// message_txt = message.payload.text;
|
||||
// break;
|
||||
// case TIM.TYPES.MSG_IMAGE:
|
||||
// console.log("图片消息");
|
||||
// message_txt = "[图片]";
|
||||
// break;
|
||||
// case TIM.TYPES.MSG_AUDIO:
|
||||
// console.log("音频消息")
|
||||
// message_txt = "[语言]";
|
||||
// break;
|
||||
// case TIM.TYPES.MSG_VIDEO:
|
||||
// console.log("视频消息");
|
||||
// message_txt = "[视频]";
|
||||
// break;
|
||||
// case TIM.TYPES.MSG_FILE:
|
||||
// console.log("文件消息")
|
||||
// message_txt = "[文件]";
|
||||
// break;
|
||||
// case TIM.TYPES.MSG_CUSTOM:
|
||||
// console.log("自定义消息")
|
||||
// break;
|
||||
// case TIM.TYPES.MSG_MERGER:
|
||||
// console.log("合并消息")
|
||||
// break;
|
||||
// case TIM.TYPES.MSG_LOCATION:
|
||||
// console.log("位置消息")
|
||||
// message_txt = "[位置]";
|
||||
// break;
|
||||
// case TIM.TYPES.MSG_FACE:
|
||||
// console.log("表情消息")
|
||||
// message_txt = "[表情]";
|
||||
// break;
|
||||
// default:
|
||||
// break;
|
||||
// }
|
||||
// let list_name = "data_list_" + inquiry_type;
|
||||
// let _index = this.data[list_name].findIndex(item => {
|
||||
// return item.order_inquiry_id == order_inquiry_id;
|
||||
// })
|
||||
|
||||
// let new_list = [];
|
||||
// //没有当前会话
|
||||
// if(_index > -1){
|
||||
// let target = list_name + "[" + _index + "].last_message_content.Text";
|
||||
// let target_dot = list_name + "[" + _index + "].message_dot";
|
||||
// console.log("target: ",target);
|
||||
// this.setData({
|
||||
// [target]: message_txt,
|
||||
// [target_dot]: true
|
||||
// })
|
||||
// new_list.push(this.data[list_name][_index]);//先放入目标
|
||||
// }else{
|
||||
// let item = {};
|
||||
// item.inquiry_status = message.inquiry_status;
|
||||
// let txt = {};
|
||||
// txt.Text= message_txt;
|
||||
// item.last_message_content = txt;
|
||||
// item.message_send_time = message.message_send_time;
|
||||
// item.message_seq = message.message_seq;
|
||||
// item.message_type = message.message_type;
|
||||
// item.order_inquiry_id = message.order_inquiry_id;
|
||||
// item.patient_age = message.patient_age;
|
||||
// item.patient_name = message.patient_name;
|
||||
// item.patient_sex = message.patient_sex;
|
||||
// item.to_user_id = message.to_user_id;
|
||||
// item.message_dot = true;
|
||||
// new_list.push(item);
|
||||
// }
|
||||
|
||||
// //置顶
|
||||
// this.data[list_name].forEach((item, index) => {
|
||||
// if(index != _index){
|
||||
// new_list.push(item)
|
||||
// }
|
||||
// })
|
||||
|
||||
// this.setData({
|
||||
// [list_name]: new_list
|
||||
// })
|
||||
|
||||
},
|
||||
formatStatus(){
|
||||
let order_inquiry_id_list = [];
|
||||
@ -612,8 +498,6 @@ Page({
|
||||
params.page = this.data.current_page + 1;
|
||||
this.setData({data_list_6_loading: true})
|
||||
api.getDoctorInquiryFinishMessage(params).then(response => {
|
||||
// console.log(response);
|
||||
|
||||
this.setData({
|
||||
"data_list_6": data_list_6.concat(response.data.data),
|
||||
current_page: response.data.current_page,
|
||||
|
||||
@ -13,8 +13,7 @@
|
||||
"van-tabs": "@vant/weapp/tabs/index",
|
||||
"t-dialog": "tdesign-miniprogram/dialog/dialog",
|
||||
"van-divider": "@vant/weapp/divider/index",
|
||||
"van-loading": "@vant/weapp/loading/index",
|
||||
"van-dialog": "@vant/weapp/dialog/index"
|
||||
"van-loading": "@vant/weapp/loading/index"
|
||||
},
|
||||
"enablePullDownRefresh": true,
|
||||
"onReachBottomDistance": 100
|
||||
|
||||
@ -29,123 +29,6 @@
|
||||
</view>
|
||||
<van-loading size="24px" wx:if="{{data_list_6_loading}}">加载中...</van-loading>
|
||||
</view>
|
||||
<!-- <van-button color="#3CC7C0" custom-style="width: 92vw;margin: 0 auto;border-radius: 10rpx;" block wx:if="{{ !has_data }}">开通图文问诊</van-button> -->
|
||||
|
||||
<!-- <view class="tabs" wx:if="{{ has_data }}" >
|
||||
<t-tabs
|
||||
default-value="{{ message_inquiry_type }}"
|
||||
sticky
|
||||
bind:change="onTabsChange"
|
||||
bind:scroll="onStickyScroll"
|
||||
t-class="custom-tabs"
|
||||
theme="line"
|
||||
swipeable="{{false}}"
|
||||
custom-style="font-size: 32rpx"
|
||||
>
|
||||
<t-tab-panel label="在线问诊" value="1" wx:if="{{data_list_1.length > 0}}">
|
||||
|
||||
<wenzhen-data
|
||||
name="{{ item.patient_name }}"
|
||||
sex="{{ item.patient_sex==1?'男':'女' }}"
|
||||
age="{{ item.patient_age }}"
|
||||
date="{{ item.message_send_time }}"
|
||||
desc="{{ item.last_message_content.Text }}"
|
||||
status="{{ item.inquiry_status }}"
|
||||
order_inquiry_id="{{ item.order_inquiry_id }}"
|
||||
inquiry_type="{{item.inquiry_type}}"
|
||||
from_account="{{item.from_account}}"
|
||||
status_text="{{ item.inquiry_status==1?'待支付':item.inquiry_status==2?'待分配':item.inquiry_status==3?'待接诊':item.inquiry_status==4?'接诊中':item.inquiry_status==5?'已完成':item.inquiry_status==6?'已结束':item.inquiry_status==7?'已取消':'其他' }}"
|
||||
note="{{ item.inquiry_status==3?'不接诊24小时后自动取消':'' }}"
|
||||
message_dot="{{item.message_dot}}"
|
||||
wx:for="{{ data_list_1 }}"
|
||||
/>
|
||||
|
||||
<van-empty description="暂无数据" wx:if="{{data_list_1.length == 0}}" />
|
||||
</t-tab-panel>
|
||||
|
||||
<t-tab-panel label="快速问诊" value="2" wx:if="{{data_list_2.length > 0}}">
|
||||
|
||||
<wenzhen-data
|
||||
name="{{ item.patient_name }}"
|
||||
sex="{{ item.patient_sex==1?'男':'女' }}"
|
||||
age="{{ item.patient_age }}"
|
||||
date="{{ item.message_send_time }}"
|
||||
desc="{{ item.last_message_content.Text }}"
|
||||
status="{{ item.inquiry_status }}"
|
||||
order_inquiry_id="{{ item.order_inquiry_id }}"
|
||||
inquiry_type="{{item.inquiry_type}}"
|
||||
from_account="{{item.from_account}}"
|
||||
status_text="{{ item.inquiry_status==1?'待支付':item.inquiry_status==2?'待分配':item.inquiry_status==3?'待接诊':item.inquiry_status==4?'接诊中':item.inquiry_status==5?'已完成':item.inquiry_status==6?'已结束':item.inquiry_status==7?'已取消':'其他' }}"
|
||||
note="{{ item.inquiry_status==3?'不接诊24小时后自动取消':'' }}"
|
||||
message_dot="{{item.message_dot}}"
|
||||
from_account="{{item.from_account}}"
|
||||
wx:for="{{ data_list_2 }}"
|
||||
/>
|
||||
|
||||
<van-empty description="暂无数据" wx:if="{{data_list_2.length == 0}}" />
|
||||
|
||||
</t-tab-panel>
|
||||
<t-tab-panel label="公益问诊" value="3" wx:if="{{data_list_3.length > 0}}">
|
||||
|
||||
<wenzhen-data
|
||||
name="{{ item.patient_name }}"
|
||||
sex="{{ item.patient_sex==1?'男':'女' }}"
|
||||
age="{{ item.patient_age }}"
|
||||
date="{{ item.message_send_time }}"
|
||||
desc="{{ item.last_message_content.Text }}"
|
||||
status="{{ item.inquiry_status }}"
|
||||
order_inquiry_id="{{ item.order_inquiry_id }}"
|
||||
inquiry_type="{{item.inquiry_type}}"
|
||||
from_account="{{item.from_account}}"
|
||||
status_text="{{ item.inquiry_status==1?'待支付':item.inquiry_status==2?'待分配':item.inquiry_status==3?'待接诊':item.inquiry_status==4?'接诊中':item.inquiry_status==5?'已完成':item.inquiry_status==6?'已结束':item.inquiry_status==7?'已取消':'其他' }}"
|
||||
note="{{ item.inquiry_status==3?'不接诊24小时后自动取消':'' }}"
|
||||
message_dot="{{item.message_dot}}"
|
||||
wx:for="{{ data_list_3 }}"
|
||||
/>
|
||||
|
||||
<van-empty description="暂无数据" wx:if="{{data_list_3.length == 0}}" />
|
||||
|
||||
</t-tab-panel>
|
||||
<t-tab-panel label="问诊购药" value="4" wx:if="{{data_list_4.length > 0}}">
|
||||
|
||||
<wenzhen-data
|
||||
name="{{ item.patient_name }}"
|
||||
sex="{{ item.patient_sex==1?'男':'女' }}"
|
||||
age="{{ item.patient_age }}"
|
||||
date="{{ item.message_send_time }}"
|
||||
desc="{{ item.last_message_content.Text }}"
|
||||
status="{{ item.inquiry_status }}"
|
||||
order_inquiry_id="{{ item.order_inquiry_id }}"
|
||||
inquiry_type="{{item.inquiry_type}}"
|
||||
from_account="{{item.from_account}}"
|
||||
status_text="{{ item.inquiry_status==1?'待支付':item.inquiry_status==2?'待分配':item.inquiry_status==3?'待接诊':item.inquiry_status==4?'接诊中':item.inquiry_status==5?'已完成':item.inquiry_status==6?'已结束':item.inquiry_status==7?'已取消':'其他' }}"
|
||||
note="{{ item.inquiry_status==3?'不接诊24小时后自动取消':'' }}"
|
||||
message_dot="{{item.message_dot}}"
|
||||
wx:for="{{ data_list_4 }}"
|
||||
/>
|
||||
|
||||
<van-empty description="暂无数据" wx:if="{{data_list_4.length == 0}}" />
|
||||
</t-tab-panel>
|
||||
<t-tab-panel label="问诊结束" value="5" wx:if="{{data_list_5.length > 0}}">
|
||||
|
||||
<wenzhen-data
|
||||
name="{{ item.patient_name }}"
|
||||
sex="{{ item.patient_sex==1?'男':'女' }}"
|
||||
age="{{ item.patient_age }}"
|
||||
date="{{ item.message_send_time }}"
|
||||
desc="{{ item.last_message_content.Text }}"
|
||||
status="{{ item.inquiry_status }}"
|
||||
status_text="{{ item.inquiry_status==1?'待支付':item.inquiry_status==2?'待分配':item.inquiry_status==3?'待接诊':item.inquiry_status==4?'接诊中':item.inquiry_status==5?'已完成':item.inquiry_status==6?'已结束':item.inquiry_status==7?'已取消':'其他' }}"
|
||||
note="{{ item.inquiry_status==3?'不接诊24小时后自动取消':'' }}"
|
||||
message_dot="{{item.message_dot}}"
|
||||
wx:for="{{ data_list_5 }}"
|
||||
/>
|
||||
|
||||
<van-empty description="暂无数据" wx:if="{{data_list_5.length == 0}}" />
|
||||
</t-tab-panel>
|
||||
</t-tabs>
|
||||
</view> -->
|
||||
|
||||
<view class="tabs" wx:if="{{ has_data==true }}">
|
||||
<van-tabs
|
||||
color="#3CC7C0"
|
||||
@ -157,23 +40,6 @@
|
||||
wx:if="{{ has_data }}"
|
||||
>
|
||||
<van-tab title="在线问诊" dot="{{dot_1}}" name="1" wx:if="{{data_list_1.length > 0}}">
|
||||
<!-- <wenzhen-data
|
||||
name="{{ item.patient_name }}"
|
||||
sex="{{ item.patient_sex==1?'男':'女' }}"
|
||||
age="{{ item.patient_age }}"
|
||||
date="{{ item.message_send_time }}"
|
||||
desc="{{ item.last_message_content.Text }}"
|
||||
status="{{ item.inquiry_status }}"
|
||||
order_inquiry_id="{{ item.order_inquiry_id }}"
|
||||
inquiry_type="{{item.inquiry_type}}"
|
||||
from_account="{{item.from_account}}"
|
||||
status_text="{{ item.inquiry_status==1?'待支付':item.inquiry_status==2?'待分配':item.inquiry_status==3?'待接诊':item.inquiry_status==4?'接诊中':item.inquiry_status==5?'已完成':item.inquiry_status==6?'已结束':item.inquiry_status==7?'已取消':'其他' }}"
|
||||
note="{{ item.inquiry_status==3?'不接诊24小时后自动取消':'' }}"
|
||||
message_dot="{{item.message_dot}}"
|
||||
wx:for="{{ data_list_1 }}"
|
||||
/> -->
|
||||
|
||||
<!-- aa -->
|
||||
<view class="content" wx:for="{{ data_list_1 }}" wx:key="order_inquiry_id">
|
||||
<view class="content_1">
|
||||
<view class="name">
|
||||
@ -208,22 +74,6 @@
|
||||
<!-- aa -->
|
||||
</van-tab>
|
||||
<van-tab title="快速问诊" dot="{{dot_2}}" name="2" wx:if="{{data_list_2.length > 0}}">
|
||||
<!-- <wenzhen-data
|
||||
name="{{ item.patient_name }}"
|
||||
sex="{{ item.patient_sex==1?'男':'女' }}"
|
||||
age="{{ item.patient_age }}"
|
||||
date="{{ item.message_send_time }}"
|
||||
desc="{{ item.last_message_content.Text }}"
|
||||
status="{{ item.inquiry_status }}"
|
||||
order_inquiry_id="{{ item.order_inquiry_id }}"
|
||||
inquiry_type="{{item.inquiry_type}}"
|
||||
from_account="{{item.from_account}}"
|
||||
status_text="{{ item.inquiry_status==1?'待支付':item.inquiry_status==2?'待分配':item.inquiry_status==3?'待接诊':item.inquiry_status==4?'接诊中':item.inquiry_status==5?'已完成':item.inquiry_status==6?'已结束':item.inquiry_status==7?'已取消':'其他' }}"
|
||||
note="{{ item.inquiry_status==3?'不接诊24小时后自动取消':'' }}"
|
||||
message_dot="{{item.message_dot}}"
|
||||
wx:for="{{ data_list_2 }}"
|
||||
/> -->
|
||||
|
||||
<view class="content" wx:for="{{ data_list_2 }}" wx:key="order_inquiry_id">
|
||||
<view class="content_1">
|
||||
<view class="name">
|
||||
@ -245,7 +95,6 @@
|
||||
</view>
|
||||
<view class="btn" wx:if="{{ item.inquiry_status >= 4 }}">
|
||||
<van-button bind:click="goChat" data-from_account="{{item.from_account}}" data-inquiry_type="{{item.inquiry_type}}" data-order_inquiry_id="{{item.order_inquiry_id}}" data-url="/TUIChatService/pages/index" plain custom-style="padding:0 35rpx; height:67rpx; border-radius: 10rpx;" color="#3CC7C0">问诊详情</van-button>
|
||||
<!-- <van-button bind:click="go" data-url="/user/pages/yishi/chat_session/index" plain custom-style="width:200rpx; border-radius: 10rpx;" color="#3CC7C0">会话列表</van-button> -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="content_4" wx:if="{{ item.inquiry_status == 3 }}">
|
||||
@ -255,22 +104,6 @@
|
||||
</view>
|
||||
</van-tab>
|
||||
<van-tab title="公益问诊" dot="{{dot_3}}" name="3" wx:if="{{data_list_3.length > 0}}">
|
||||
<!-- <wenzhen-data
|
||||
name="{{ item.patient_name }}"
|
||||
sex="{{ item.patient_sex==1?'男':'女' }}"
|
||||
age="{{ item.patient_age }}"
|
||||
date="{{ item.message_send_time }}"
|
||||
desc="{{ item.last_message_content.Text }}"
|
||||
status="{{ item.inquiry_status }}"
|
||||
order_inquiry_id="{{ item.order_inquiry_id }}"
|
||||
inquiry_type="{{item.inquiry_type}}"
|
||||
from_account="{{item.from_account}}"
|
||||
status_text="{{ item.inquiry_status==1?'待支付':item.inquiry_status==2?'待分配':item.inquiry_status==3?'待接诊':item.inquiry_status==4?'接诊中':item.inquiry_status==5?'已完成':item.inquiry_status==6?'已结束':item.inquiry_status==7?'已取消':'其他' }}"
|
||||
note="{{ item.inquiry_status==3?'不接诊24小时后自动取消':'' }}"
|
||||
message_dot="{{item.message_dot}}"
|
||||
wx:for="{{ data_list_3 }}"
|
||||
/> -->
|
||||
|
||||
<view class="content" wx:for="{{ data_list_3 }}" wx:key="order_inquiry_id">
|
||||
<view class="content_1">
|
||||
|
||||
@ -293,7 +126,6 @@
|
||||
</view>
|
||||
<view class="btn" wx:if="{{ item.inquiry_status >= 4 }}">
|
||||
<van-button bind:click="goChat" data-from_account="{{item.from_account}}" data-inquiry_type="{{item.inquiry_type}}" data-order_inquiry_id="{{item.order_inquiry_id}}" data-url="/TUIChatService/pages/index" plain custom-style="padding:0 35rpx; height:67rpx; border-radius: 10rpx;" color="#3CC7C0">问诊详情</van-button>
|
||||
<!-- <van-button bind:click="go" data-url="/user/pages/yishi/chat_session/index" plain custom-style="width:200rpx; border-radius: 10rpx;" color="#3CC7C0">会话列表</van-button> -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="content_4" wx:if="{{ item.inquiry_status == 3 }}">
|
||||
@ -303,22 +135,6 @@
|
||||
</view>
|
||||
</van-tab>
|
||||
<van-tab title="问诊购药" dot="{{dot_4}}" name="4" wx:if="{{data_list_4.length > 0}}">
|
||||
<!-- <wenzhen-data
|
||||
name="{{ item.patient_name }}"
|
||||
sex="{{ item.patient_sex==1?'男':'女' }}"
|
||||
age="{{ item.patient_age }}"
|
||||
date="{{ item.message_send_time }}"
|
||||
desc="{{ item.last_message_content.Text }}"
|
||||
status="{{ item.inquiry_status }}"
|
||||
order_inquiry_id="{{ item.order_inquiry_id }}"
|
||||
inquiry_type="{{item.inquiry_type}}"
|
||||
from_account="{{item.from_account}}"
|
||||
status_text="{{ item.inquiry_status==1?'待支付':item.inquiry_status==2?'待分配':item.inquiry_status==3?'待接诊':item.inquiry_status==4?'接诊中':item.inquiry_status==5?'已完成':item.inquiry_status==6?'已结束':item.inquiry_status==7?'已取消':'其他' }}"
|
||||
note="{{ item.inquiry_status==3?'不接诊24小时后自动取消':'' }}"
|
||||
message_dot="{{item.message_dot}}"
|
||||
wx:for="{{ data_list_4 }}"
|
||||
/> -->
|
||||
|
||||
<view class="content" wx:for="{{ data_list_4 }}" wx:key="order_inquiry_id">
|
||||
<view class="content_1">
|
||||
<view class="name">
|
||||
@ -340,7 +156,6 @@
|
||||
</view>
|
||||
<view class="btn" wx:if="{{ item.inquiry_status >= 4 }}">
|
||||
<van-button bind:click="goChat" data-from_account="{{item.from_account}}" data-inquiry_type="{{item.inquiry_type}}" data-order_inquiry_id="{{item.order_inquiry_id}}" data-url="/TUIChatService/pages/index" plain custom-style="padding:0 35rpx; height:67rpx; border-radius: 10rpx;" color="#3CC7C0">问诊详情</van-button>
|
||||
<!-- <van-button bind:click="go" data-url="/user/pages/yishi/chat_session/index" plain custom-style="width:200rpx; border-radius: 10rpx;" color="#3CC7C0">会话列表</van-button> -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="content_4" wx:if="{{ item.inquiry_status == 3 }}">
|
||||
@ -349,23 +164,7 @@
|
||||
</view>
|
||||
</view>
|
||||
</van-tab>
|
||||
<van-tab title="报告解读" dot="{{dot_5}}" name="5" wx:if="{{data_list_5.length > 0}}">
|
||||
<!-- <wenzhen-data
|
||||
name="{{ item.patient_name }}"
|
||||
sex="{{ item.patient_sex==1?'男':'女' }}"
|
||||
age="{{ item.patient_age }}"
|
||||
date="{{ item.message_send_time }}"
|
||||
desc="{{ item.last_message_content.Text }}"
|
||||
status="{{ item.inquiry_status }}"
|
||||
order_inquiry_id="{{ item.order_inquiry_id }}"
|
||||
inquiry_type="{{item.inquiry_type}}"
|
||||
from_account="{{item.from_account}}"
|
||||
status_text="{{ item.inquiry_status==1?'待支付':item.inquiry_status==2?'待分配':item.inquiry_status==3?'待接诊':item.inquiry_status==4?'接诊中':item.inquiry_status==5?'已完成':item.inquiry_status==6?'已结束':item.inquiry_status==7?'已取消':'其他' }}"
|
||||
note="{{ item.inquiry_status==3?'不接诊24小时后自动取消':'' }}"
|
||||
message_dot="{{item.message_dot}}"
|
||||
wx:for="{{ data_list_2 }}"
|
||||
/> -->
|
||||
|
||||
<van-tab title="报告解读" dot="{{dot_5}}" name="5" wx:if="{{data_list_5.length > 0}}">
|
||||
<view class="content" wx:for="{{ data_list_5 }}" wx:key="order_inquiry_id">
|
||||
<view class="content_1">
|
||||
<view class="name">
|
||||
@ -387,7 +186,6 @@
|
||||
</view>
|
||||
<view class="btn" wx:if="{{ item.inquiry_status >= 4 }}">
|
||||
<van-button bind:click="goChat" data-from_account="{{item.from_account}}" data-inquiry_type="{{item.inquiry_type}}" data-order_inquiry_id="{{item.order_inquiry_id}}" data-url="/TUIChatService/pages/index" plain custom-style="padding:0 35rpx; height:67rpx; border-radius: 10rpx;" color="#3CC7C0">问诊详情</van-button>
|
||||
<!-- <van-button bind:click="go" data-url="/user/pages/yishi/chat_session/index" plain custom-style="width:200rpx; border-radius: 10rpx;" color="#3CC7C0">会话列表</van-button> -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="content_4" wx:if="{{ item.inquiry_status == 3 }}">不接诊72小时后自动取消</view>
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
import { TUIStore, StoreName, NAME } from "../index";
|
||||
import { TUICallKitServer } from "../TUICallService/index";
|
||||
|
||||
const {
|
||||
CALL_STATUS,
|
||||
@ -34,6 +35,7 @@ Component({
|
||||
pusher: TUIStore.getData(StoreName.CALL, PUSHER), // TRTC 本地流
|
||||
playerList: TUIStore.getData(StoreName.CALL, PLAYER), // TRTC 远端流
|
||||
playerProcess: {}, // 经过处理的的远端流(多人通话)
|
||||
timer:null
|
||||
},
|
||||
methods: {
|
||||
// 监听通话状态变更回调
|
||||
@ -41,9 +43,58 @@ Component({
|
||||
this.setData({
|
||||
callStatus: value,
|
||||
});
|
||||
console.log("通话状态该笔");
|
||||
if(value=='idle'){
|
||||
this.sendCustom();
|
||||
}
|
||||
console.log("通话状态该笔:"+value);
|
||||
console.log(this.data.callerUserInfo);
|
||||
console.log(this.data.localUserInfo);
|
||||
},
|
||||
//纠正音视频电话不能携带自定义消息，结束后，主动发条消息
|
||||
sendCustom(){
|
||||
let THIS=this;
|
||||
let {timer}=this.data;
|
||||
if(timer){
|
||||
clearTimeout(timer);
|
||||
}
|
||||
wx.getStorage({
|
||||
key: 'patientInfo',
|
||||
success (res) {
|
||||
let patientInfo=JSON.parse(res.data);
|
||||
let chat=TUICallKitServer.getTim();
|
||||
let message = chat.createCustomMessage({
|
||||
to:patientInfo.patient_user_id,
|
||||
conversationType:"C2C",
|
||||
payload: {
|
||||
data:JSON.stringify({message_type:20,title:'[电话]'}),
|
||||
description:'',
|
||||
extension:''
|
||||
},
|
||||
cloudCustomData:JSON.stringify(patientInfo)
|
||||
});
|
||||
let time=setTimeout(()=>{
|
||||
let promise = chat.sendMessage(message,{
|
||||
messageControlInfo: {
|
||||
excludedFromUnreadCount: true, // 消息不更新会话 unreadCount（消息存漫游）
|
||||
}
|
||||
});
|
||||
promise.then(function(imResponse) {
|
||||
console.log('发送成功');
|
||||
console.log(imResponse);
|
||||
}).catch(function(imError) {
|
||||
// 发送失败
|
||||
console.warn('sendMessage error:', imError);
|
||||
});
|
||||
},1000);
|
||||
THIS.setData({
|
||||
timer:time
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
},
|
||||
// 监听是否群组通话变更回调
|
||||
handleIsGroupChange(value) {
|
||||
|
||||
@ -7,6 +7,9 @@ Component({
|
||||
},
|
||||
callStatus: {
|
||||
type: String,
|
||||
observer(callStatus) {
|
||||
console.log("改编状态："+callStatus);
|
||||
}
|
||||
},
|
||||
callMediaType: {
|
||||
type: Number,
|
||||
@ -39,12 +42,12 @@ Component({
|
||||
IMG_ACCEPT: `${PATH}/dialing.png`,
|
||||
IMG_SPEAKER_FALSE:`${PATH}/speaker-false.png`,
|
||||
IMG_SPEAKER_TRUE:`${PATH}/speaker-true.png`,
|
||||
IMG_AUDIO_TRUE:`${PATH}/audio-true.png`,
|
||||
IMG_AUDIO_FALSE:`${PATH}/audio-false.png`,
|
||||
IMG_CAMERA_TRUE:`${PATH}/camera-true.png`,
|
||||
IMG_CAMERA_FALSE:`${PATH}/camera-false.png`,
|
||||
IMG_TRANS:`${PATH}/trans.png`,
|
||||
IMG_SWITCH_CAMERA:`${PATH}/switch_camera.png`,
|
||||
IMG_AUDIO_TRUE:`${PATH}/doctor_audio_true.png`,
|
||||
IMG_AUDIO_FALSE:`${PATH}/doctor_audio_false.png`,
|
||||
IMG_CAMERA_TRUE:`${PATH}/doctor_camera_true.png`,
|
||||
IMG_CAMERA_FALSE:`${PATH}/doctor_camera_false.png`,
|
||||
IMG_TRANS:`${PATH}/doctor_trans.png`,
|
||||
IMG_SWITCH_CAMERA:`${PATH}/doctor_switch_camera.png`,
|
||||
patient_avatar:wx.getStorageSync('patient_avatar')
|
||||
},
|
||||
methods: {
|
||||
|
||||
@ -76,22 +76,22 @@
|
||||
</view> -->
|
||||
<view class="btn-list">
|
||||
<view wx:if="{{localUserInfo.isVideoAvailable && callRole == 'caller'}}" class="button-container">
|
||||
<view class="btn-normal">
|
||||
<image class="btn-image" src="{{IMG_SWITCH_CAMERA}}" data-device="{{pusher.frontCamera}}" catch:tap="switchCamera" />
|
||||
<view class="btn-normal ">
|
||||
<image class="btn-image newimg" src="{{IMG_SWITCH_CAMERA}}" data-device="{{pusher.frontCamera}}" catch:tap="switchCamera" />
|
||||
</view>
|
||||
<view class="white">切换</view>
|
||||
</view>
|
||||
<view class="button-container" bindtap="switchCallMediaType" wx:if="{{callRole == 'caller'}}">
|
||||
<view class="btn-normal">
|
||||
<image class="btn-image" src="{{IMG_TRANS}} "></image>
|
||||
<image class="btn-image newimg" src="{{IMG_TRANS}} "></image>
|
||||
</view>
|
||||
<view class="white">切换至语音</view>
|
||||
</view>
|
||||
<view class="button-container" bindtap="microPhoneHandler" wx:if="{{callRole == 'caller'}}">
|
||||
<view class="btn-normal">
|
||||
<image class="btn-image" src="{{localUserInfo.isAudioAvailable? IMG_AUDIO_TRUE: IMG_AUDIO_FALSE}} "></image>
|
||||
<image class="btn-image newimg" src="{{localUserInfo.isAudioAvailable? IMG_AUDIO_TRUE: IMG_AUDIO_FALSE}} "></image>
|
||||
</view>
|
||||
<view class="white">麦克风</view>
|
||||
<view class="white">语音</view>
|
||||
</view>
|
||||
<!-- <view class="button-container" bindtap="toggleSoundMode">
|
||||
<view class="btn-normal">
|
||||
@ -116,7 +116,7 @@
|
||||
</view>
|
||||
<text class="white">挂断</text>
|
||||
</view>
|
||||
<view class="btn-list-item other-view" >
|
||||
<!-- <view class="btn-list-item other-view" >
|
||||
<view class="btn-container">
|
||||
<view class="btn-hangup" bindtap="accept">
|
||||
<image class="btn-image" src="{{IMG_ACCEPT}}"></image>
|
||||
@ -124,7 +124,7 @@
|
||||
|
||||
</view>
|
||||
<text class="white">接听</text>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -181,7 +181,7 @@
|
||||
<view class="btn-normal" bindtap="microPhoneHandler">
|
||||
<image class="btn-image" src="{{localUserInfo.isAudioAvailable? IMG_AUDIO_TRUE: IMG_AUDIO_FALSE}} "></image>
|
||||
</view>
|
||||
<view>麦克风</view>
|
||||
<view>语音</view>
|
||||
</view>
|
||||
<view class="button-container">
|
||||
<view class="btn-hangup" bindtap="hangup">
|
||||
@ -200,7 +200,7 @@
|
||||
<!-- 视频通话接听状态按钮 -->
|
||||
<view wx:if="{{callStatus === 'connected' && callMediaType === 2}}" class="invite-calling">
|
||||
<view class="handle-btns">
|
||||
<view class="other-view white">
|
||||
<view class="other-view white" style="margin-bottom: 50rpx;">
|
||||
<text>{{callDuration}}</text>
|
||||
</view>
|
||||
<!-- <view class="btn-operate-item call-switch" catch:tap="switchCallMediaType">
|
||||
@ -209,25 +209,27 @@
|
||||
</view>
|
||||
<text>切到语音通话</text>
|
||||
</view> -->
|
||||
<view class="btn-list">
|
||||
<view class="button-container" bindtap="microPhoneHandler">
|
||||
<view class="btn-normal">
|
||||
<image class="btn-image" src="{{localUserInfo.isAudioAvailable? IMG_AUDIO_TRUE: IMG_AUDIO_FALSE}} "></image>
|
||||
</view>
|
||||
<view class="white">语音</view>
|
||||
</view>
|
||||
<view class="button-container" bindtap="toggleSoundMode">
|
||||
<view class="btn-normal">
|
||||
<image class="btn-image" src="{{isEarPhone ? IMG_SPEAKER_FALSE: IMG_SPEAKER_TRUE}} "></image>
|
||||
</view>
|
||||
<text class="white">扬声器</text>
|
||||
</view>
|
||||
<view class="btn-list" style="width:85%;margin:0 auto;">
|
||||
<view class="button-container" bindtap="switchCamera" wx:if="{{localUserInfo.isVideoAvailable}}">
|
||||
<view class="btn-normal">
|
||||
<image class="btn-image" src="{{IMG_SWITCH_CAMERA}}" data-device="{{pusher.frontCamera}}" src="{{IMG_SWITCH_CAMERA}} "></image>
|
||||
<image class="btn-image newimg" src="{{IMG_SWITCH_CAMERA}}" data-device="{{pusher.frontCamera}}" src="{{IMG_SWITCH_CAMERA}} "></image>
|
||||
</view>
|
||||
<text class="white">摄像头</text>
|
||||
<text class="white">切换</text>
|
||||
</view>
|
||||
<view class="button-container" bindtap="hangup">
|
||||
<view class="btn-normal" style="width:8vh;height:8vh">
|
||||
<image class="btn-image" src="{{IMG_HANGUP}}"></image>
|
||||
<!-- <image class="btn-image" src="{{isEarPhone ? IMG_SPEAKER_FALSE: IMG_SPEAKER_TRUE}} "></image> -->
|
||||
</view>
|
||||
<text class="white">挂断</text>
|
||||
</view>
|
||||
<view class="button-container" bindtap="microPhoneHandler">
|
||||
<view class="btn-normal">
|
||||
<image class="btn-image newimg" src="{{localUserInfo.isAudioAvailable? IMG_AUDIO_TRUE: IMG_AUDIO_FALSE}} "></image>
|
||||
</view>
|
||||
<view class="white">静音</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<!-- <view class="btn-list">
|
||||
<view class="btn-list-item other-view">
|
||||
|
||||
@ -306,8 +306,8 @@
|
||||
}
|
||||
|
||||
.btn-normal {
|
||||
width: 8vh;
|
||||
height: 8vh;
|
||||
/* width: 8vh;
|
||||
height: 8vh; */
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@ -321,6 +321,14 @@
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: none;
|
||||
|
||||
}
|
||||
.btn-image.newimg{
|
||||
background: rgba(0,0,0,0.45);
|
||||
width:56rpx;
|
||||
height:56rpx;
|
||||
padding:25rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.btn-hangup {
|
||||
|
||||
@ -33,10 +33,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
||||
};
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.TUIStore = exports.TUIGlobal = void 0;
|
||||
const tui_core_1 = require("@tencentcloud/tui-core");
|
||||
const tui_core_1 = require("../../min-npm/@tencentcloud/tui-core/index");
|
||||
const index_1 = require("../const/index");
|
||||
// @ts-ignore
|
||||
const tuicall_engine_wx_1 = require("tuicall-engine-wx");
|
||||
const tuicall_engine_wx_1 = require("../../min-npm/tuicall-engine-wx/index");
|
||||
const index_2 = require("../locales/index");
|
||||
const miniProgram_1 = require("./miniProgram");
|
||||
const bellContext_1 = require("./bellContext");
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
import formateTime from '../../../../../utils/formate-time';
|
||||
import constant from '../../../../../utils/constant';
|
||||
import debounce from '../../../../../../../utils/debounce';
|
||||
import debounce from '../../../../../utils/debounce';
|
||||
import { API } from '../../../../../../../utils/network/api'
|
||||
const app = getApp()
|
||||
const api = new API();
|
||||
|
||||
@ -35,7 +35,7 @@
|
||||
<view class="custom-content-text">{{renderDom[0].text}}</view>
|
||||
</view>
|
||||
<view wx:if="{{renderDom[0].type ==='c2cCalling' || renderDom[0].type ==='groupCalling'}}" class="call-message {{isMine?'my-text':'your-text'}}" >
|
||||
<view class="custom-content-text">{{renderDom[0].text}}11</view>
|
||||
<view class="custom-content-text">{{renderDom[0].text}}</view>
|
||||
</view>
|
||||
<!-- <view wx:if="{{renderDom[0].type ==='notSupport'}}" class="message-body-span text-message" >
|
||||
<view class="message-body-span-text">{{renderDom[0].text}}</view>
|
||||
|
||||
@ -38,6 +38,26 @@ Component({
|
||||
type: String,
|
||||
value: {},
|
||||
},
|
||||
isEditTime:{
|
||||
type: Boolean,
|
||||
value: false,
|
||||
observer(isEditTime) {
|
||||
console.log(isEditTime)
|
||||
this.setData({
|
||||
isEditTime
|
||||
});
|
||||
},
|
||||
},
|
||||
videoInfo:{
|
||||
type: Object,
|
||||
value:{},
|
||||
observer(videoInfo){
|
||||
this.setData({
|
||||
videoInfo
|
||||
});
|
||||
}
|
||||
|
||||
},
|
||||
hasCallKit: {
|
||||
type: Boolean,
|
||||
value: false,
|
||||
@ -83,6 +103,9 @@ Component({
|
||||
data: {
|
||||
conversation: {},
|
||||
message: '',
|
||||
showRound:false,
|
||||
showTalk:false,
|
||||
videoInfo:{},
|
||||
baseInfo:{},
|
||||
family_id:'',
|
||||
patient_user_id:'',
|
||||
@ -90,6 +113,7 @@ Component({
|
||||
sendMessageBtn: false,
|
||||
displayFlag: '',
|
||||
isAudio: false,
|
||||
columnsRound:[3,7,15],
|
||||
bottomVal: 0,
|
||||
startPoint: 0,
|
||||
popupToggle: false,
|
||||
@ -123,6 +147,8 @@ Component({
|
||||
recordtime:0,
|
||||
dialog_message: "在线开处方需先进行多点执业认证",
|
||||
message_rounds: 0,
|
||||
times_number:'',
|
||||
duration:'',
|
||||
networkstatus: "wifi",
|
||||
static_host: api.getStaticHost(),
|
||||
formatter(type, value) {
|
||||
@ -306,10 +332,86 @@ Component({
|
||||
* 组件的方法列表
|
||||
*/
|
||||
methods: {
|
||||
sendTalk(){
|
||||
let {order_inquiry_id,duration,times_number}=this.data;
|
||||
this.setData({
|
||||
showTalk:false
|
||||
})
|
||||
api.giveRounds({
|
||||
order_inquiry_id,
|
||||
duration,
|
||||
times_number
|
||||
}).then(response => {
|
||||
if(response.code==200){
|
||||
|
||||
wx.showToast({
|
||||
title: '赠送成功',
|
||||
icon:"none"
|
||||
})
|
||||
}
|
||||
|
||||
}).catch(errors => {
|
||||
console.error(errors);
|
||||
})
|
||||
},
|
||||
changeCustomIpt(event){
|
||||
let {value}= event.detail;
|
||||
this.setData({
|
||||
times_number:value
|
||||
})
|
||||
},
|
||||
openRound(){
|
||||
this.setData({
|
||||
showRound:true
|
||||
})
|
||||
},
|
||||
onCancelRound(){
|
||||
this.setData({
|
||||
showRound:false
|
||||
})
|
||||
},
|
||||
onConfirmRound(event){
|
||||
const { value} = event.detail;
|
||||
this.setData({
|
||||
showRound:false,
|
||||
duration:value
|
||||
})
|
||||
|
||||
},
|
||||
appointmentTime(reservation_time){
|
||||
let {order_inquiry_id}=this.data;
|
||||
api.appointmentTime({
|
||||
order_inquiry_id,
|
||||
reservation_time
|
||||
}).then(response => {
|
||||
if(response.code==200){
|
||||
wx.showToast({
|
||||
title: '预约成功',
|
||||
icon:"none"
|
||||
})
|
||||
}
|
||||
|
||||
}).catch(errors => {
|
||||
console.error(errors);
|
||||
})
|
||||
},
|
||||
async call() {
|
||||
let {baseInfo}=this.data;
|
||||
|
||||
|
||||
console.log(baseInfo)
|
||||
wx.setStorage('patientInfo',{
|
||||
order_inquiry_id:baseInfo.order_inquiry_id,
|
||||
inquiry_type:baseInfo.inquiry_type,
|
||||
inquiry_mode:baseInfo.inquiry_mode,
|
||||
message_rounds:0,
|
||||
patient_user_id:baseInfo.patient_user_id,
|
||||
patient_family_data: {
|
||||
patient_name:baseInfo.patient_family_name,
|
||||
patient_sex:baseInfo.patient_family_sex,
|
||||
patient_age:baseInfo.patient_family_age
|
||||
},
|
||||
is_system:0
|
||||
}
|
||||
)
|
||||
await TUICallKitServer.call({
|
||||
userID: this.data.patient_user_id,
|
||||
type: 2,
|
||||
@ -319,8 +421,6 @@ Component({
|
||||
'test':'111111'
|
||||
}),
|
||||
});
|
||||
await TUICallKitServer.setSelfInfo({ nickName:"夏侯惇22"});
|
||||
console.log('1111111111111111111111')
|
||||
},
|
||||
// 获取消息列表来判断是否发送正在输入状态
|
||||
getMessageList(conversation) {
|
||||
@ -731,11 +831,7 @@ Component({
|
||||
})
|
||||
break;
|
||||
case '12'://预约视频时间
|
||||
this.setData({
|
||||
currentDate:new Date().getTime(),
|
||||
minDate:new Date().getTime(),
|
||||
showTimepicker:true
|
||||
})
|
||||
this.openTimePicker();
|
||||
break;
|
||||
case '13':
|
||||
this.call();
|
||||
@ -744,16 +840,24 @@ Component({
|
||||
break;
|
||||
}
|
||||
},
|
||||
openTimePicker(){
|
||||
this.setData({
|
||||
currentDate:new Date().getTime(),
|
||||
minDate:new Date().getTime(),
|
||||
showTimepicker:true
|
||||
})
|
||||
},
|
||||
cancelTimepicker(){
|
||||
this.setData({
|
||||
showTimepicker:false
|
||||
})
|
||||
},
|
||||
confirmTimepicker(event){
|
||||
console.log(dayjs(event.detail).format('YYYY-MM-DD HH:mm'));
|
||||
let time=dayjs(event.detail).format('YYYY-MM-DD HH:mm');
|
||||
this.setData({
|
||||
showTimepicker:false
|
||||
})
|
||||
this.appointmentTime(time);
|
||||
},
|
||||
goCase(){
|
||||
|
||||
|
||||
@ -7,6 +7,9 @@
|
||||
"van-popup": "@vant/weapp/popup/index",
|
||||
"van-datetime-picker": "@vant/weapp/datetime-picker/index",
|
||||
"ServiceEvaluation": "../MessagePrivate/ServiceEvaluation/index",
|
||||
"van-picker": "@vant/weapp/picker/index",
|
||||
"van-icon": "@vant/weapp/icon/index",
|
||||
"van-overlay": "@vant/weapp/overlay/index",
|
||||
"t-dialog": "tdesign-miniprogram/dialog/dialog"
|
||||
}
|
||||
}
|
||||
|
||||
@ -2,8 +2,8 @@
|
||||
<view class="TUI-commom-function">
|
||||
<view class="TUI-commom-function-item" data-key="10" bindtap="handleCommonFunctions">查看完整病历</view>
|
||||
<view class="TUI-commom-function-item" data-key="11" bindtap="handleCommonFunctions" wx:if="{{baseInfo.multi_point_status == 1 && baseInfo.inquiry_status==4 && baseInfo.multi_point_enable==1}}">在线开处方</view>
|
||||
<view class="TUI-commom-function-item" data-key="12" bindtap="handleCommonFunctions" wx:if="{{baseInfo.multi_point_status == 1 && baseInfo.inquiry_status==4 && baseInfo.multi_point_enable==1}}">预约视频时间</view>
|
||||
<view class="TUI-commom-function-item" data-key="13" bindtap="handleCommonFunctions" wx:if="{{baseInfo.multi_point_status == 1 && baseInfo.inquiry_status==4 && baseInfo.multi_point_enable==1}}">发起视频</view>
|
||||
<view class="TUI-commom-function-item" data-key="12" bindtap="handleCommonFunctions" wx:if="{{baseInfo.multi_point_status == 1 && baseInfo.inquiry_status==4 && baseInfo.multi_point_enable==1 && !videoInfo.is_reservation_time}}">预约视频时间</view>
|
||||
<view class="TUI-commom-function-item" data-key="13" bindtap="handleCommonFunctions" wx:if="{{baseInfo.multi_point_status == 1 && baseInfo.inquiry_status==4 && baseInfo.multi_point_enable==1 && videoInfo.is_reservation_time && videoInfo.is_video==0 }}">发起视频</view>
|
||||
</view>
|
||||
<view class="TUI-message-input">
|
||||
<image class="TUI-icon" bindtap="switchAudio"
|
||||
@ -62,6 +62,11 @@
|
||||
<image mode="widthFix" class="TUI-Extension-icon MY-TUI-Extension-icon" src="{{static_host}}/applet/doctor/static/images/yishi/wenzhenicon.png" />
|
||||
<view class="TUI-Extension-slot-name MY-TUI-Extension-slot-name">问诊表</view>
|
||||
</view>
|
||||
<view class="TUI-Extension-slot MY-TUI-Extension-slot" bindtap="showWenZhenBiao" wx:if="{{baseInfo.inquiry_status==4}}">
|
||||
<image mode="widthFix" class="TUI-Extension-icon MY-TUI-Extension-icon" src="../../../../static/images/talk.png" style="width:70rpx;height:70rpx;padding:18rpx"/>
|
||||
<view class="TUI-Extension-slot-name MY-TUI-Extension-slot-name">赠送沟通</view>
|
||||
</view>
|
||||
|
||||
<!-- <view class="TUI-Extension-slot" bindtap="handleSendPicture">
|
||||
<image class="TUI-Extension-icon" src="../../../../static/assets/take-photo.svg" />
|
||||
<view class="TUI-Extension-slot-name">相机</view>
|
||||
@ -143,15 +148,37 @@
|
||||
确定
|
||||
</view>
|
||||
</t-dialog>
|
||||
<van-overlay show="{{ showTalk }}" z-index="9900">
|
||||
<view class="wrapper">
|
||||
<view class="custombox">
|
||||
<view class="title">赠送患者免费图文回合沟通数</view>
|
||||
<view class="roundBox">
|
||||
<view class="lname">回合数</view>
|
||||
<input type="number" placeholder="" class="ipt" value="{{times_number}}" bindinput="changeCustomIpt" placeholder-style="color: rgba(0,0,0,0.25);font-size:32rpx"/>
|
||||
<view class="name">个沟通回合数</view>
|
||||
</view>
|
||||
<view class="roundBox" bindtap="openRound">
|
||||
<view class="lname">回合周期</view>
|
||||
<input type="number" placeholder="" class="ipt" value="{{duration}}"
|
||||
disabled="{{true}}"
|
||||
placeholder-style="color: rgba(0,0,0,0.25);font-size:32rpx"/>
|
||||
<view class="name">天内使用<van-icon name="arrow" color="rgba(0,0,0,0.65)" style="margin-top:4rpx;margin-left: 5rpx;" /></view>
|
||||
</view>
|
||||
<view class="btnround" bindtap="sendTalk">赠送</view>
|
||||
</view>
|
||||
</view>
|
||||
</van-overlay>
|
||||
|
||||
<van-popup
|
||||
round
|
||||
|
||||
show="{{ showTimepicker}}"
|
||||
position="bottom"
|
||||
custom-style="height: 50%"
|
||||
>
|
||||
<van-datetime-picker
|
||||
bind:cancel="cancelTimepicker"
|
||||
title="预约视频时间"
|
||||
title="{{isEditTime?'修改预约时间':'预约视频时间'}}"
|
||||
bind:confirm="confirmTimepicker"
|
||||
value="{{ currentDate }}"
|
||||
min-date="{{ minDate }}"
|
||||
@ -159,3 +186,14 @@
|
||||
/>
|
||||
|
||||
</van-popup>
|
||||
<van-popup
|
||||
z-index="9901"
|
||||
show="{{ showRound }}"
|
||||
round
|
||||
position="bottom"
|
||||
custom-style="height: 50%"
|
||||
>
|
||||
<van-picker columns="{{ columnsRound }}" show-toolbar
|
||||
title="选择回合天数" bind:cancel="onCancelRound"
|
||||
bind:confirm="onConfirmRound" />
|
||||
</van-popup>
|
||||
|
||||
@ -80,19 +80,21 @@
|
||||
margin: 0 16rpx;
|
||||
}
|
||||
.TUI-Extensions {
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
width: 100vw;
|
||||
height: 100px;
|
||||
margin-left: 14rpx;
|
||||
margin-right: 14rpx;
|
||||
}
|
||||
|
||||
.TUI-Extension-slot {
|
||||
width: 128rpx;
|
||||
height: 170rpx;
|
||||
margin-left: 26rpx;
|
||||
margin-right: 26rpx;
|
||||
/* width: 128rpx;
|
||||
height: 170rpx; */
|
||||
flex:1;
|
||||
|
||||
/* margin-left: 26rpx;
|
||||
margin-right: 26rpx; */
|
||||
margin-top: 24rpx;
|
||||
}
|
||||
|
||||
@ -191,9 +193,10 @@
|
||||
align-items: center;
|
||||
}
|
||||
.MY-TUI-Extension-icon{
|
||||
width: 50%;
|
||||
/* width: 50%; */
|
||||
width: 36%;
|
||||
background-color: #F4F4F4;
|
||||
padding: 30rpx;
|
||||
padding: 26rpx;
|
||||
}
|
||||
.MY-TUI-Extension-slot-name{
|
||||
background-color: #fff;
|
||||
@ -219,4 +222,60 @@
|
||||
}
|
||||
.van-picker__confirm{
|
||||
color: #3CC7C0!important;
|
||||
}
|
||||
.wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
height:100vh;
|
||||
}
|
||||
.custombox{
|
||||
padding:32rpx;
|
||||
width:70%;
|
||||
border-radius: 16rpx;
|
||||
background-color: #fff;
|
||||
}
|
||||
.roundBox{
|
||||
margin: 56rpx 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.custombox .title{
|
||||
text-align: center;
|
||||
font-size: 36rpx;
|
||||
font-weight: 500;
|
||||
color: rgba(0,0,0,0.85)
|
||||
}
|
||||
.custombox .name{
|
||||
font-size: 32rpx;
|
||||
font-weight: 400;
|
||||
color: rgba(0,0,0,0.85);
|
||||
}
|
||||
.custombox .ipt{
|
||||
text-align: center;
|
||||
}
|
||||
.roundBox .name{
|
||||
white-space: nowrap;
|
||||
font-size: 32rpx;
|
||||
font-weight: 400;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: rgba(0,0,0,0.65);
|
||||
}
|
||||
.roundBox .lname{
|
||||
white-space: nowrap;
|
||||
color: rgba(0,0,0,0.85);
|
||||
}
|
||||
.btnround{
|
||||
width:100%;
|
||||
height: 88rpx;
|
||||
background: #3CC7C0;
|
||||
border-radius: 8rpx;
|
||||
font-size: 32rpx;
|
||||
font-weight: 500;
|
||||
color: #FFFFFF;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
@ -1,6 +1,6 @@
|
||||
import logger from '../../../../utils/logger';
|
||||
import constant from '../../../../utils/constant';
|
||||
import { wechatTimeFormat } from '../../../../../../utils/wechatTime'
|
||||
import { wechatTimeFormat } from '../../../../utils/wechatTime'
|
||||
import { API } from '../../../../../../utils/network/api';
|
||||
import Message from 'tdesign-miniprogram/message/index';
|
||||
|
||||
@ -253,44 +253,9 @@ Component({
|
||||
if(message.cloudCustomData){
|
||||
cloudCustomData = message.cloudCustomData;
|
||||
}
|
||||
console.log("11111111111111111111111111")
|
||||
console.log("cloudCustomData:"+cloudCustomData)
|
||||
if(cloudCustomData){
|
||||
cloudCustomDataJson = JSON.parse(cloudCustomData);
|
||||
}else{
|
||||
if(message.type=="TIMCustomElem"){
|
||||
console.log("3333333333333333333");
|
||||
// let {baseInfo}=this.data;
|
||||
// const custommessage = wx.$TUIKit.createCustomMessage({
|
||||
// to: this.getToAccount(),
|
||||
// conversationType: this.data.conversation.type,
|
||||
// payload:{
|
||||
// cloudCustomData: JSON.stringify({
|
||||
// order_inquiry_id:baseInfo.order_inquiry_id,
|
||||
// inquiry_type: baseInfo.inquiry_type,
|
||||
// inquiry_mode:baseInfo.baseInfo.inquiry_mode,
|
||||
// message_type: 0,
|
||||
// is_system: 0,
|
||||
// message_rounds:0,
|
||||
// patient_family_data: baseInfo.patient_family_data
|
||||
// })
|
||||
// },
|
||||
// });
|
||||
// wx.$TUIKit.sendMessage(custommessage).then(res=>{
|
||||
// const firstSendMessage = wx.getStorageSync('isFirstSendMessage');
|
||||
// if (firstSendMessage) {
|
||||
// wx.aegis.reportEvent({
|
||||
// name: 'sendMessage',
|
||||
// ext1: 'sendMessage-success',
|
||||
// ext2: 'imTuikitExternal',
|
||||
// ext3: wx.$chat_SDKAppID,
|
||||
// });
|
||||
// }
|
||||
// }).catch((error)=>{
|
||||
// console.log(error)
|
||||
// });
|
||||
// console.log(444444);
|
||||
}
|
||||
}
|
||||
let is_system = cloudCustomDataJson.is_system;
|
||||
if(is_system != 1){//不是系统消息直接返回
|
||||
|
||||
@ -5,7 +5,7 @@
|
||||
<view style="width: 100%;text-align: center;position: absolute;top: 20rpx;">
|
||||
<van-loading size="24px" wx:if="{{list_first_loading}}" vertical color="#1989fa">加载中...</van-loading>
|
||||
</view>
|
||||
<view class="t-message" wx:if="{{conversation.type !== '@TIM#SYSTEM'}}" wx:for="{{messageList}}" wx:key="index" data-index ='{{index}}'>
|
||||
<view class="t-message" wx:if="{{conversation.type !== '@TIM#SYSTEM'}}" wx:for="{{messageList}}" wx:key="index" hidden="{{!(item.payload.data &&concat.formateText(item.payload.data).message_type!=20 || item.type!='TIMCustomElem')}}" data-index ='{{index}}'>
|
||||
<view class="time-pop-mask" data-value="{{item.time}}" wx:if="{{item.showMessageTime}}">
|
||||
<view class="showmessagetime 1" wx:if="{{item.isShowTime}}">
|
||||
<text class="time" wx:if="{{!item.isDeleted && !item.isRevoked}}">{{item.messageTime}} </text>
|
||||
@ -36,7 +36,7 @@
|
||||
</view>
|
||||
</view>
|
||||
<TipMessage wx:if="{{item.type === 'TIMGroupTipElem'}}" message="{{item}}"/>
|
||||
<view wx:if="{{item.type !== 'TIMGroupTipElem'}}" class="{{item.flow === 'out' ? 't-self-message':'t-recieve-message'}}" >
|
||||
<view wx:if="{{item.type !== 'TIMGroupTipElem' }}" class="{{item.flow === 'out' ? 't-self-message':'t-recieve-message'}}" >
|
||||
<image class="t-message-avatar" wx:if="{{item.flow === 'in' && !item.no_avatar }}" src="{{item.avatar || static_host+'/applet/doctor/static/images/default_photo.png'}}" data-value="{{item}}" bindtap="getMemberProfile" />
|
||||
<!-- <view class="read-receipts" wx:if="{{conversation.type === 'C2C' && item.flow==='out' }}">
|
||||
<view wx:if="{{item.isPeerRead}}" >已读</view>
|
||||
@ -55,7 +55,8 @@
|
||||
<ImageMessage wx:if="{{item.type === 'TIMImageElem'}}" message="{{item}}" isMine="{{item.flow === 'out'}}" />
|
||||
<VideoMessage wx:if="{{item.type === 'TIMVideoFileElem'}}" message="{{item}}" isMine="{{item.flow === 'out'}}"/>
|
||||
<AudioMessage wx:if="{{item.type === 'TIMSoundElem'}}" message="{{item}}" data-index ='{{index}}' messageList="{{messageList}}" bind:closeAudio="closeAudio" id="audio{{item.ID}}" isMine="{{item.flow === 'out'}}"/>
|
||||
<CustomMessage wx:if="{{item.type === 'TIMCustomElem'}}" message="{{item}}" isMine="{{item.flow === 'out'}}" bindtap="handleJumpLink" data-value = "{{item}}" patient_family_data="{{concat.formateText(item.cloudCustomData).patient_family_data}}"/>
|
||||
|
||||
<CustomMessage wx:if="{{item.type === 'TIMCustomElem' && concat.formateText(item.payload.data).message_type!=20}}" message="{{item}}" isMine="{{item.flow === 'out'}}" bindtap="handleJumpLink" data-value = "{{item}}" patient_family_data="{{concat.formateText(item.cloudCustomData).patient_family_data}}"/>
|
||||
<FaceMessage wx:if="{{item.type === 'TIMFaceElem'}}" message="{{item}}" isMine="{{item.flow === 'out'}}"/>
|
||||
<FileMessage wx:if="{{item.type === 'TIMFileElem'}}" message="{{item}}" isMine="{{item.flow === 'out'}}"/>
|
||||
<MergerMessage wx:if="{{item.type === 'TIMRelayElem'}}" message="{{item}}" isMine="{{item.flow === 'out'}}"/>
|
||||
|
||||
@ -38,7 +38,10 @@ Component({
|
||||
},
|
||||
order_inquiry_id: {
|
||||
type: String,
|
||||
value: ''
|
||||
value: '',
|
||||
observer(){
|
||||
this.getAudioMsg();
|
||||
}
|
||||
},
|
||||
from:{
|
||||
type: String,
|
||||
@ -107,6 +110,7 @@ Component({
|
||||
},
|
||||
|
||||
ready() {
|
||||
|
||||
let hasTip=wx.getStorageSync('showNewerTip');
|
||||
if(hasTip){
|
||||
this.setData({
|
||||
@ -156,6 +160,7 @@ Component({
|
||||
*/
|
||||
data: {
|
||||
rest_time:0,
|
||||
videoInfo:{},
|
||||
total_rounds:0,
|
||||
timeData:{},
|
||||
showTip:false,
|
||||
@ -181,6 +186,7 @@ Component({
|
||||
input_area_style:"",
|
||||
KeyboardHeight: 0,
|
||||
showTips: false,
|
||||
isEditTime:false,
|
||||
showGroupTips: false,
|
||||
showAll: false,
|
||||
navbarData: {
|
||||
@ -202,6 +208,33 @@ Component({
|
||||
* 组件的方法列表
|
||||
*/
|
||||
methods: {
|
||||
openTime(){
|
||||
this.selectComponent("#MessageInput").openTimePicker();
|
||||
this.setData({
|
||||
isEditTime:true
|
||||
})
|
||||
},
|
||||
getAudioMsg(){
|
||||
console.log(this.data.order_inquiry_id)
|
||||
api.getVideoMsg(this.data.order_inquiry_id).then(response => {
|
||||
let result=response.data
|
||||
console.log(result);
|
||||
if(result.is_video && !result.is_reservation_time && result.update_number==1){
|
||||
this.setData({
|
||||
isEditTime:false,
|
||||
videoInfo:result
|
||||
})
|
||||
}else{
|
||||
this.setData({
|
||||
isEditTime:true,
|
||||
videoInfo:result
|
||||
})
|
||||
}
|
||||
|
||||
}).catch(errors => {
|
||||
console.error(errors);
|
||||
})
|
||||
},
|
||||
refreshMessageRounds(e){
|
||||
// console.log("TUIchat refreshMessageRounds", e)
|
||||
let message_rounds = e.detail.message_rounds
|
||||
|
||||
@ -7,6 +7,7 @@
|
||||
"van-overlay": "@vant/weapp/overlay/index",
|
||||
"van-count-down": "@vant/weapp/count-down/index",
|
||||
"te-nav-bar": "../../../../commpents/te_navbar/index",
|
||||
"van-icon": "@vant/weapp/icon/index",
|
||||
"t-dialog": "tdesign-miniprogram/dialog/dialog"
|
||||
},
|
||||
"disableScroll":true
|
||||
|
||||
@ -32,12 +32,18 @@
|
||||
<view class="status {{baseInfo.inquiry_status==5?'status_complete':''}}" wx:else="{{baseInfo.inquiry_status!=4}}">{{baseInfo.inquiry_status==1?'待支付':baseInfo.inquiry_status==2?'待分配':baseInfo.inquiry_status==3?'待接诊':baseInfo.inquiry_status==4?'接诊中':baseInfo.inquiry_status==5?'问诊完成':baseInfo.inquiry_status==6?'已结束':baseInfo.inquiry_status==7?'已取消':'未知'}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="yuyuetip" bind:tap="openTime" wx:if="{{isEditTime && videoInfo.is_reservation_time}}">
|
||||
<view >如需要修改视频时间，请点击这里</view>
|
||||
<van-icon name="arrow" size="14px" style="margin-top: 3rpx;" color="#FF9C00" />
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
<!-- <view class="tui-navigatorbar">
|
||||
<image class="tui-navigatorbar-back" bindtap="goBack" src="../../static/assets/ic_back_black.svg" />
|
||||
<view class="conversation-title">{{conversationName}}</view>
|
||||
</view> -->
|
||||
<view class="list-box {{ showTips && 'list-box-notips'}} || {{ showGroupTips && 'list-box-group'}} || {{ showAll && 'list-box-group-notips'}}" style="height: calc(100vh {{baseInfo.inquiry_status==4?'- 197rpx':'- 196rpx'}} - 100rpx - {{navbar_height}}px);"><!-- 100vh -input-area高度 - info高度 -navbar高度 -->
|
||||
<view class="list-box {{ showTips && 'list-box-notips'}} || {{ showGroupTips && 'list-box-group'}} || {{ showAll && 'list-box-group-notips'}}" style="height: calc(100vh {{baseInfo.inquiry_status==4?'- 197rpx':'- 196rpx'}} - 100rpx - {{navbar_height}}px {{(isEditTime && videoInfo.is_reservation_time) ?'- 72rpx':'- 0rpx'}});"><!-- 100vh -input-area高度 - info高度 -navbar高度 -->
|
||||
<!-- <view wx:if="{{showTips}}" class="safetytips-box"> -->
|
||||
<!-- <view class="safetytips">
|
||||
<text>【安全提示】本 APP 仅用于体验腾讯云即时通信 IM 产品功能，不可用于业务洽谈与拓展。请勿轻信汇款、中奖等涉及钱款等信息，勿轻易拨打陌生电话，谨防上当受骗。</text>
|
||||
@ -60,7 +66,9 @@
|
||||
<view class="input-area" style="{{input_area_style}}" >
|
||||
<!-- wx:if="{{showChat}}" -->
|
||||
<view class="message-input" style="{{viewData.style}}" >
|
||||
<MessageInput bind:myhandleExtensions="myhandleExtensions" id="MessageInput" inquiry_type="{{inquiry_type}}" baseInfo="{{baseInfo}}" order_inquiry_id="{{order_inquiry_id}}" conversation="{{conversation}}" from="{{from}}" hasCallKit="{{hasCallKit}}" bind:sendMessage="sendMessage" bind:downKeysBoards="downKeysBoards" bind:pullKeysBoards="pullKeysBoards" bind:showMessageErrorImage="showMessageErrorImage"
|
||||
<MessageInput bind:myhandleExtensions="myhandleExtensions" id="MessageInput" inquiry_type="{{inquiry_type}}" baseInfo="{{baseInfo}}" order_inquiry_id="{{order_inquiry_id}}" conversation="{{conversation}}" from="{{from}}" hasCallKit="{{hasCallKit}}" isEditTime="{{isEditTime}}"
|
||||
videoInfo="{{videoInfo}}"
|
||||
bind:sendMessage="sendMessage" bind:downKeysBoards="downKeysBoards" bind:pullKeysBoards="pullKeysBoards" bind:showMessageErrorImage="showMessageErrorImage"
|
||||
bind:refreshMessageStatus="refreshMessageStatus"
|
||||
bind:inputBindLinechange="inputBindLinechange"
|
||||
bind:handleCall="handleCall" message_rounds="{{message_rounds}}"></MessageInput>
|
||||
|
||||
@ -304,4 +304,17 @@ margin-left: 32rpx;
|
||||
position: absolute;
|
||||
width: 150rpx;
|
||||
height: 150rpx;
|
||||
}
|
||||
.yuyuetip{
|
||||
justify-content: space-between;
|
||||
padding: 0 10rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
width:100%;
|
||||
height: 72rpx;
|
||||
background: #FFFCF2;
|
||||
font-size: 28rpx;
|
||||
font-weight: 400;
|
||||
color: #FF9C00;
|
||||
}
|
||||
39
app.js
39
app.js
@ -44,47 +44,8 @@ App({
|
||||
},1000)
|
||||
return
|
||||
})
|
||||
let loadStatus = false;
|
||||
if (!loadStatus) {
|
||||
// wx.loadFontFace({
|
||||
// global: true,
|
||||
// family: 'AlibabaPuHuiTi',
|
||||
// // source: 'url("https://oss.igandan.com/app/fonts/AlibabaPuHuiTi/STXINGKA.TTF")',
|
||||
// source: 'url("https://docwebsite.oss-cn-beijing.aliyuncs.com/app/fonts/AlibabaPuHuiTi/AlibabaPuHuiTi-2-65-Medium/AlibabaPuHuiTi-2-65-Medium.ttf")',
|
||||
// success() {
|
||||
// loadStatus = true;
|
||||
// console.log("download fonts from oss success");
|
||||
// },
|
||||
// fail(){
|
||||
// console.log("download fonts from oss error");
|
||||
// },
|
||||
// complete(){
|
||||
// console.log("download fonts from oss complete");
|
||||
// }
|
||||
// });
|
||||
}
|
||||
|
||||
// this.aegisInit()
|
||||
// console.warn("app.js wx.aegis: ", wx.aegis);
|
||||
|
||||
//监听网络状态变化事件
|
||||
wx.onNetworkStatusChange(function (res) {
|
||||
// console.log("onNetworkStatusChange: ")
|
||||
// console.log(res.isConnected)
|
||||
// console.log(res.networkType)
|
||||
// wx.showToast({
|
||||
// title: '网络类型'+res.networkType,
|
||||
// })
|
||||
})
|
||||
|
||||
wx.onNetworkWeakChange(function(res){
|
||||
// console.log("onNetworkWeakChange: ")
|
||||
// console.log(res.isConnected)
|
||||
// console.log(res.networkType)
|
||||
})
|
||||
},
|
||||
onShow(){
|
||||
// this.imInit();
|
||||
},
|
||||
imInit(options={},type=1,callback=()=>{}){
|
||||
console.log("imInit")
|
||||
|
||||
21
app.json
21
app.json
@ -106,33 +106,24 @@
|
||||
"list": [
|
||||
{
|
||||
"pagePath": "Pages/yaoshi/home/home",
|
||||
"text": "首页",
|
||||
"iconPath": "/static/images/yaoshi/tabbar_icon/home.png",
|
||||
"selectedIconPath": "/static/images/yaoshi/tabbar_icon/home_select.png"
|
||||
"text": "首页"
|
||||
|
||||
},
|
||||
{
|
||||
"pagePath": "Pages/yaoshi/my/my",
|
||||
"text": "我的",
|
||||
"iconPath": "/static/images/yaoshi/tabbar_icon/my.png",
|
||||
"selectedIconPath": "/static/images/yaoshi/tabbar_icon/my_select.png"
|
||||
"text": "我的"
|
||||
},
|
||||
{
|
||||
"pagePath": "Pages/yishi/index/index",
|
||||
"text": "首页",
|
||||
"iconPath": "/static/images/yishi/tabbar_icon/index.png",
|
||||
"selectedIconPath": "/static/images/yishi/tabbar_icon/index_select.png"
|
||||
"text": "首页"
|
||||
},
|
||||
{
|
||||
"pagePath": "Pages/yishi/wenzhen_v2/wenzhen",
|
||||
"text": "问诊",
|
||||
"iconPath": "/static/images/yishi/tabbar_icon/wenzhen.png",
|
||||
"selectedIconPath": "/static/images/yishi/tabbar_icon/wenzhen_select.png"
|
||||
"text": "问诊"
|
||||
},
|
||||
{
|
||||
"pagePath": "Pages/yishi/my/index",
|
||||
"text": "我的",
|
||||
"iconPath": "/static/images/yishi/tabbar_icon/my.png",
|
||||
"selectedIconPath": "/static/images/yishi/tabbar_icon/my_select.png"
|
||||
"text": "我的"
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
@ -1,4 +1,6 @@
|
||||
// custom-tab-bar/index.js
|
||||
import { API } from '../utils/network/api'
|
||||
const api = new API()
|
||||
const app = getApp()
|
||||
Component({
|
||||
|
||||
@ -15,37 +17,37 @@ Component({
|
||||
{
|
||||
"pagePath": "/Pages/yaoshi/home/home",
|
||||
"text": "首页",
|
||||
"iconPath": "/static/images/yaoshi/tabbar_icon/home.png",
|
||||
"selectedIconPath": "/static/images/yaoshi/tabbar_icon/home_select.png",
|
||||
"iconPath": api.getStaticHost()+"/applet/doctor/static/images/yaoshi/home.png",
|
||||
"selectedIconPath": api.getStaticHost()+"/applet/doctor/static/images/yaoshi/home_select.png",
|
||||
"info": ""
|
||||
},
|
||||
{
|
||||
"pagePath": "/Pages/yaoshi/my/my",
|
||||
"text": "我的",
|
||||
"iconPath": "/static/images/yaoshi/tabbar_icon/my.png",
|
||||
"selectedIconPath": "/static/images/yaoshi/tabbar_icon/my_select.png",
|
||||
"iconPath": api.getStaticHost()+"/applet/doctor/static/images/yaoshi/my.png",
|
||||
"selectedIconPath": api.getStaticHost()+"/applet/doctor/static/images/yaoshi/my_select.png",
|
||||
"info": ""
|
||||
}],
|
||||
"list2":[
|
||||
{
|
||||
"pagePath": "/Pages/yishi/index/index",
|
||||
"text": "首页",
|
||||
"iconPath": "/static/images/yishi/tabbar_icon/index.png",
|
||||
"selectedIconPath": "/static/images/yishi/tabbar_icon/index_select.png",
|
||||
"iconPath": api.getStaticHost()+"/applet/doctor/static/images/yishi/index.png",
|
||||
"selectedIconPath": api.getStaticHost()+"/applet/doctor/static/images/yishi/index_select.png",
|
||||
"info": ""
|
||||
},
|
||||
{
|
||||
"pagePath": "/Pages/yishi/wenzhen_v2/wenzhen",
|
||||
"text": "问诊",
|
||||
"iconPath": "/static/images/yishi/tabbar_icon/wenzhen.png",
|
||||
"selectedIconPath": "/static/images/yishi/tabbar_icon/wenzhen_select.png",
|
||||
"iconPath":api.getStaticHost()+"/applet/doctor/static/images/yishi/wenzhen.png",
|
||||
"selectedIconPath":api.getStaticHost()+"/applet/doctor/static/images/yishi/wenzhen_select.png",
|
||||
"info": "99"
|
||||
},
|
||||
{
|
||||
"pagePath": "/Pages/yishi/my/index",
|
||||
"text": "我的",
|
||||
"iconPath": "/static/images/yishi/tabbar_icon/my.png",
|
||||
"selectedIconPath": "/static/images/yishi/tabbar_icon/my_select.png",
|
||||
"iconPath": api.getStaticHost()+"/applet/doctor/static/images/yishi/my.png",
|
||||
"selectedIconPath":api.getStaticHost()+"/applet/doctor/static/images/yishi/my_select.png",
|
||||
"info": ""
|
||||
}]
|
||||
},
|
||||
@ -112,21 +114,6 @@ Component({
|
||||
if(val == 0) val = '';
|
||||
return val;
|
||||
},
|
||||
// swichNav: function (e) {
|
||||
// console.log(123);
|
||||
// let that = this;
|
||||
// if (this.data.currentTab === e.target.dataset.current) {
|
||||
// return false;
|
||||
// } else {
|
||||
// that.setData({
|
||||
// currentTab: e.target.dataset.current
|
||||
// })
|
||||
// let url = e.currentTarget.dataset.url; // 点击tabbar时，跳转对应的页面
|
||||
// wx.switchTab({
|
||||
// url: url,
|
||||
// })
|
||||
// }
|
||||
// },
|
||||
onChange(e) {
|
||||
const usertype = wx.getStorageSync('usertype');
|
||||
let userID = wx.getStorageSync('user_id_'+usertype);
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
1
miniprogram_npm/@vant/weapp/toast/index.d.ts
vendored
1
miniprogram_npm/@vant/weapp/toast/index.d.ts
vendored
@ -1 +0,0 @@
|
||||
export {};
|
||||
@ -1,31 +0,0 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
var component_1 = require("../common/component");
|
||||
(0, component_1.VantComponent)({
|
||||
props: {
|
||||
show: Boolean,
|
||||
mask: Boolean,
|
||||
message: String,
|
||||
forbidClick: Boolean,
|
||||
zIndex: {
|
||||
type: Number,
|
||||
value: 1000,
|
||||
},
|
||||
type: {
|
||||
type: String,
|
||||
value: 'text',
|
||||
},
|
||||
loadingType: {
|
||||
type: String,
|
||||
value: 'circular',
|
||||
},
|
||||
position: {
|
||||
type: String,
|
||||
value: 'middle',
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
// for prevent touchmove
|
||||
noop: function () { },
|
||||
},
|
||||
});
|
||||
@ -1,9 +0,0 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"van-icon": "../icon/index",
|
||||
"van-loading": "../loading/index",
|
||||
"van-overlay": "../overlay/index",
|
||||
"van-transition": "../transition/index"
|
||||
}
|
||||
}
|
||||
@ -1,36 +0,0 @@
|
||||
<van-overlay
|
||||
wx:if="{{ mask || forbidClick }}"
|
||||
show="{{ show }}"
|
||||
z-index="{{ zIndex }}"
|
||||
custom-style="{{ mask ? '' : 'background-color: transparent;' }}"
|
||||
/>
|
||||
<van-transition
|
||||
show="{{ show }}"
|
||||
custom-style="z-index: {{ zIndex }}"
|
||||
custom-class="van-toast__container"
|
||||
>
|
||||
<view
|
||||
class="van-toast van-toast--{{ (type === 'text' || type === 'html') ? 'text' : 'icon' }} van-toast--{{ position }}"
|
||||
catch:touchmove="noop"
|
||||
>
|
||||
<!-- text only -->
|
||||
<text wx:if="{{ type === 'text' }}">{{ message }}</text>
|
||||
|
||||
<!-- html only -->
|
||||
<rich-text wx:elif="{{ type === 'html' }}" nodes="{{ message }}"></rich-text>
|
||||
|
||||
<!-- with icon -->
|
||||
<block wx:else>
|
||||
<van-loading
|
||||
wx:if="{{ type === 'loading' }}"
|
||||
color="white"
|
||||
type="{{ loadingType }}"
|
||||
custom-class="van-toast__loading"
|
||||
/>
|
||||
<van-icon wx:else class="van-toast__icon" name="{{ type }}" />
|
||||
<text wx:if="{{ message }}" class="van-toast__text">{{ message }}</text>
|
||||
</block>
|
||||
|
||||
<slot />
|
||||
</view>
|
||||
</van-transition>
|
||||
@ -1 +0,0 @@
|
||||
@import '../common/index.wxss';.van-toast{word-wrap:break-word;align-items:center;background-color:var(--toast-background-color,rgba(0,0,0,.7));border-radius:var(--toast-border-radius,8px);box-sizing:initial;color:var(--toast-text-color,#fff);display:flex;flex-direction:column;font-size:var(--toast-font-size,14px);justify-content:center;line-height:var(--toast-line-height,20px);white-space:pre-wrap}.van-toast__container{left:50%;max-width:var(--toast-max-width,70%);position:fixed;top:50%;transform:translate(-50%,-50%);width:-webkit-fit-content;width:fit-content}.van-toast--text{min-width:var(--toast-text-min-width,96px);padding:var(--toast-text-padding,8px 12px)}.van-toast--icon{min-height:var(--toast-default-min-height,88px);padding:var(--toast-default-padding,16px);width:var(--toast-default-width,88px)}.van-toast--icon .van-toast__icon{font-size:var(--toast-icon-size,36px)}.van-toast--icon .van-toast__text{padding-top:8px}.van-toast__loading{margin:10px 0}.van-toast--top{transform:translateY(-30vh)}.van-toast--bottom{transform:translateY(30vh)}
|
||||
28
miniprogram_npm/@vant/weapp/toast/toast.d.ts
vendored
28
miniprogram_npm/@vant/weapp/toast/toast.d.ts
vendored
@ -1,28 +0,0 @@
|
||||
/// <reference types="miniprogram-api-typings" />
|
||||
/// <reference types="miniprogram-api-typings" />
|
||||
declare type ToastMessage = string | number;
|
||||
declare type ToastContext = WechatMiniprogram.Component.TrivialInstance | WechatMiniprogram.Page.TrivialInstance;
|
||||
interface ToastOptions {
|
||||
show?: boolean;
|
||||
type?: string;
|
||||
mask?: boolean;
|
||||
zIndex?: number;
|
||||
context?: (() => ToastContext) | ToastContext;
|
||||
position?: string;
|
||||
duration?: number;
|
||||
selector?: string;
|
||||
forbidClick?: boolean;
|
||||
loadingType?: string;
|
||||
message?: ToastMessage;
|
||||
onClose?: () => void;
|
||||
}
|
||||
declare function Toast(toastOptions: ToastOptions | ToastMessage): WechatMiniprogram.Component.TrivialInstance | undefined;
|
||||
declare namespace Toast {
|
||||
var loading: (options: ToastMessage | ToastOptions) => WechatMiniprogram.Component.TrivialInstance | undefined;
|
||||
var success: (options: ToastMessage | ToastOptions) => WechatMiniprogram.Component.TrivialInstance | undefined;
|
||||
var fail: (options: ToastMessage | ToastOptions) => WechatMiniprogram.Component.TrivialInstance | undefined;
|
||||
var clear: () => void;
|
||||
var setDefaultOptions: (options: ToastOptions) => void;
|
||||
var resetDefaultOptions: () => void;
|
||||
}
|
||||
export default Toast;
|
||||
@ -1,83 +0,0 @@
|
||||
"use strict";
|
||||
var __assign = (this && this.__assign) || function () {
|
||||
__assign = Object.assign || function(t) {
|
||||
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
||||
s = arguments[i];
|
||||
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
||||
t[p] = s[p];
|
||||
}
|
||||
return t;
|
||||
};
|
||||
return __assign.apply(this, arguments);
|
||||
};
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
var validator_1 = require("../common/validator");
|
||||
var defaultOptions = {
|
||||
type: 'text',
|
||||
mask: false,
|
||||
message: '',
|
||||
show: true,
|
||||
zIndex: 1000,
|
||||
duration: 2000,
|
||||
position: 'middle',
|
||||
forbidClick: false,
|
||||
loadingType: 'circular',
|
||||
selector: '#van-toast',
|
||||
};
|
||||
var queue = [];
|
||||
var currentOptions = __assign({}, defaultOptions);
|
||||
function parseOptions(message) {
|
||||
return (0, validator_1.isObj)(message) ? message : { message: message };
|
||||
}
|
||||
function getContext() {
|
||||
var pages = getCurrentPages();
|
||||
return pages[pages.length - 1];
|
||||
}
|
||||
function Toast(toastOptions) {
|
||||
var options = __assign(__assign({}, currentOptions), parseOptions(toastOptions));
|
||||
var context = (typeof options.context === 'function'
|
||||
? options.context()
|
||||
: options.context) || getContext();
|
||||
var toast = context.selectComponent(options.selector);
|
||||
if (!toast) {
|
||||
console.warn('未找到 van-toast 节点，请确认 selector 及 context 是否正确');
|
||||
return;
|
||||
}
|
||||
delete options.context;
|
||||
delete options.selector;
|
||||
toast.clear = function () {
|
||||
toast.setData({ show: false });
|
||||
if (options.onClose) {
|
||||
options.onClose();
|
||||
}
|
||||
};
|
||||
queue.push(toast);
|
||||
toast.setData(options);
|
||||
clearTimeout(toast.timer);
|
||||
if (options.duration != null && options.duration > 0) {
|
||||
toast.timer = setTimeout(function () {
|
||||
toast.clear();
|
||||
queue = queue.filter(function (item) { return item !== toast; });
|
||||
}, options.duration);
|
||||
}
|
||||
return toast;
|
||||
}
|
||||
var createMethod = function (type) { return function (options) {
|
||||
return Toast(__assign({ type: type }, parseOptions(options)));
|
||||
}; };
|
||||
Toast.loading = createMethod('loading');
|
||||
Toast.success = createMethod('success');
|
||||
Toast.fail = createMethod('fail');
|
||||
Toast.clear = function () {
|
||||
queue.forEach(function (toast) {
|
||||
toast.clear();
|
||||
});
|
||||
queue = [];
|
||||
};
|
||||
Toast.setDefaultOptions = function (options) {
|
||||
Object.assign(currentOptions, options);
|
||||
};
|
||||
Toast.resetDefaultOptions = function () {
|
||||
currentOptions = __assign({}, defaultOptions);
|
||||
};
|
||||
exports.default = Toast;
|
||||
@ -1,59 +0,0 @@
|
||||
---
|
||||
title: checkbox-group
|
||||
description: 组合多选框
|
||||
spline: form
|
||||
isComponent: true
|
||||
---
|
||||
|
||||
### 特性及兼容性
|
||||
|
||||
无
|
||||
|
||||
## 引入
|
||||
|
||||
### 引入组件
|
||||
|
||||
在 `app.json` 或 `page.json` 中引入组件：
|
||||
|
||||
```json
|
||||
"usingComponents": {
|
||||
"t-checkbox": "tdesign-miniprogram/checkbox/checkbox",
|
||||
"t-checkbox-group": "tdesign-miniprogram/checkbox-group/checkbox-group"
|
||||
}
|
||||
```
|
||||
|
||||
## 用法
|
||||
|
||||
### 组件方式
|
||||
|
||||
```html
|
||||
<!-- page.wxml -->
|
||||
<t-checkbox-group defaultValue="checkbox1" bind:change="onChange">
|
||||
<t-checkbox title="单行标题" value="checkbox1" />
|
||||
<t-checkbox title="单行标题" label="辅助信息" value="checkbox2" />
|
||||
</t-checkbox-group>
|
||||
```
|
||||
<t-checkbox title="单行标题" value="checkbox1" defaultChecked="{{true}}"/>
|
||||
## API
|
||||
|
||||
### `<t-checkbox-group>` 组件
|
||||
|
||||
组件路径：`tdesign-miniprogram/checkbox-group/checkbox-group`
|
||||
|
||||
#### Props
|
||||
|
||||
| 属性 | 值类型 | 默认值 | 必传 | 说明 |
|
||||
| -------- | --------- | ------ | ---- | ---------------------- |
|
||||
| value | `Array` | `[]` | N | 当前选中项的标识符 |
|
||||
| name | `String` | - | N | 在表单内提交时的标识符 |
|
||||
### Slots
|
||||
|
||||
| 名称 | 说明 |
|
||||
| ---- | ----------------- |
|
||||
| 默认 | `t-checkbox` 组件 |
|
||||
|
||||
#### Events
|
||||
|
||||
| 事件 | event.detail | 说明 |
|
||||
| ----------- | -------------------------- | ------------------------ |
|
||||
| bind:change | {names:当前选中项的标识符} | 当绑定值变化时触发的事件 |
|
||||
@ -1,69 +0,0 @@
|
||||
import { SuperComponent, RelationsOptions } from '../common/src/index';
|
||||
export default class CheckBoxGroup extends SuperComponent {
|
||||
externalClasses: string[];
|
||||
relations: RelationsOptions;
|
||||
data: {
|
||||
prefix: string;
|
||||
classPrefix: string;
|
||||
checkboxOptions: any[];
|
||||
};
|
||||
properties: {
|
||||
borderless: {
|
||||
type: BooleanConstructor;
|
||||
value: boolean;
|
||||
};
|
||||
customStyle?: {
|
||||
type: StringConstructor;
|
||||
value?: string;
|
||||
};
|
||||
disabled?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
max?: {
|
||||
type: NumberConstructor;
|
||||
value?: number;
|
||||
};
|
||||
name?: {
|
||||
type: StringConstructor;
|
||||
value?: string;
|
||||
};
|
||||
options?: {
|
||||
type: ArrayConstructor;
|
||||
value?: import("./type").CheckboxOption[];
|
||||
};
|
||||
value?: {
|
||||
type: ArrayConstructor;
|
||||
value?: import("./type").CheckboxGroupValue;
|
||||
};
|
||||
defaultValue?: {
|
||||
type: ArrayConstructor;
|
||||
value?: import("./type").CheckboxGroupValue;
|
||||
};
|
||||
};
|
||||
observers: {
|
||||
value(): void;
|
||||
};
|
||||
lifetimes: {
|
||||
attached(): void;
|
||||
ready(): void;
|
||||
};
|
||||
controlledProps: {
|
||||
key: string;
|
||||
event: string;
|
||||
}[];
|
||||
$checkAll: any;
|
||||
methods: {
|
||||
getChilds(): any;
|
||||
updateChildren(): void;
|
||||
updateValue({ value, checked, checkAll, indeterminate }: {
|
||||
value: any;
|
||||
checked: any;
|
||||
checkAll: any;
|
||||
indeterminate: any;
|
||||
}): void;
|
||||
initWithOptions(): void;
|
||||
handleInnerChildChange(e: any): void;
|
||||
setCheckall(): void;
|
||||
};
|
||||
}
|
||||
@ -1,151 +0,0 @@
|
||||
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
||||
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
||||
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
||||
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
||||
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
||||
};
|
||||
import { SuperComponent, wxComponent } from '../common/src/index';
|
||||
import config from '../common/config';
|
||||
import props from './props';
|
||||
const { prefix } = config;
|
||||
const name = `${prefix}-checkbox-group`;
|
||||
let CheckBoxGroup = class CheckBoxGroup extends SuperComponent {
|
||||
constructor() {
|
||||
super(...arguments);
|
||||
this.externalClasses = [`${prefix}-class`];
|
||||
this.relations = {
|
||||
'../checkbox/checkbox': {
|
||||
type: 'descendant',
|
||||
},
|
||||
};
|
||||
this.data = {
|
||||
prefix,
|
||||
classPrefix: name,
|
||||
checkboxOptions: [],
|
||||
};
|
||||
this.properties = Object.assign(Object.assign({}, props), { borderless: {
|
||||
type: Boolean,
|
||||
value: false,
|
||||
} });
|
||||
this.observers = {
|
||||
value() {
|
||||
this.updateChildren();
|
||||
},
|
||||
};
|
||||
this.lifetimes = {
|
||||
attached() {
|
||||
this.initWithOptions();
|
||||
},
|
||||
ready() {
|
||||
this.setCheckall();
|
||||
},
|
||||
};
|
||||
this.controlledProps = [
|
||||
{
|
||||
key: 'value',
|
||||
event: 'change',
|
||||
},
|
||||
];
|
||||
this.$checkAll = null;
|
||||
this.methods = {
|
||||
getChilds() {
|
||||
let items = this.$children;
|
||||
if (!items.length) {
|
||||
items = this.selectAllComponents(`.${prefix}-checkbox-option`);
|
||||
}
|
||||
return items || [];
|
||||
},
|
||||
updateChildren() {
|
||||
const items = this.getChilds();
|
||||
const { value } = this.data;
|
||||
if (items.length > 0) {
|
||||
items.forEach((item) => {
|
||||
!item.data.checkAll &&
|
||||
item.setData({
|
||||
checked: value === null || value === void 0 ? void 0 : value.includes(item.data.value),
|
||||
});
|
||||
});
|
||||
if (items.some((item) => item.data.checkAll)) {
|
||||
this.setCheckall();
|
||||
}
|
||||
}
|
||||
},
|
||||
updateValue({ value, checked, checkAll, indeterminate }) {
|
||||
let { value: newValue } = this.data;
|
||||
const { max } = this.data;
|
||||
const keySet = new Set(this.getChilds().map((item) => item.data.value));
|
||||
newValue = newValue.filter((value) => keySet.has(value));
|
||||
if (max && checked && newValue.length === max)
|
||||
return;
|
||||
if (checkAll) {
|
||||
const items = this.getChilds();
|
||||
newValue =
|
||||
!checked && indeterminate
|
||||
? items.map((item) => item.data.value)
|
||||
: items
|
||||
.filter(({ data }) => {
|
||||
if (data.disabled) {
|
||||
return newValue.includes(data.value);
|
||||
}
|
||||
return checked && !data.checkAll;
|
||||
})
|
||||
.map(({ data }) => data.value);
|
||||
}
|
||||
else if (checked) {
|
||||
newValue = newValue.concat(value);
|
||||
}
|
||||
else {
|
||||
const index = newValue.findIndex((v) => v === value);
|
||||
newValue.splice(index, 1);
|
||||
}
|
||||
this._trigger('change', { value: newValue });
|
||||
},
|
||||
initWithOptions() {
|
||||
const { options } = this.data;
|
||||
if (!(options === null || options === void 0 ? void 0 : options.length) || !Array.isArray(options))
|
||||
return;
|
||||
const checkboxOptions = options.map((item) => {
|
||||
const isLabel = ['number', 'string'].includes(typeof item);
|
||||
return isLabel
|
||||
? {
|
||||
label: `${item}`,
|
||||
value: item,
|
||||
}
|
||||
: Object.assign({}, item);
|
||||
});
|
||||
this.setData({
|
||||
checkboxOptions,
|
||||
});
|
||||
},
|
||||
handleInnerChildChange(e) {
|
||||
var _a;
|
||||
const { item } = e.target.dataset;
|
||||
const { checked } = e.detail;
|
||||
const rect = {};
|
||||
if (item.checkAll) {
|
||||
rect.indeterminate = (_a = this.$checkAll) === null || _a === void 0 ? void 0 : _a.data.indeterminate;
|
||||
}
|
||||
this.updateValue(Object.assign(Object.assign(Object.assign({}, item), { checked }), rect));
|
||||
},
|
||||
setCheckall() {
|
||||
const items = this.getChilds();
|
||||
if (!this.$checkAll) {
|
||||
this.$checkAll = items.find((item) => item.data.checkAll);
|
||||
}
|
||||
if (!this.$checkAll)
|
||||
return;
|
||||
const { value } = this.data;
|
||||
const valueSet = new Set(value.filter((val) => val !== this.$checkAll.data.value));
|
||||
const isCheckall = items.every((item) => (item.data.checkAll ? true : valueSet.has(item.data.value)));
|
||||
this.$checkAll.setData({
|
||||
checked: valueSet.size > 0,
|
||||
indeterminate: !isCheckall,
|
||||
});
|
||||
},
|
||||
};
|
||||
}
|
||||
};
|
||||
CheckBoxGroup = __decorate([
|
||||
wxComponent()
|
||||
], CheckBoxGroup);
|
||||
export default CheckBoxGroup;
|
||||
@ -1,6 +0,0 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"t-checkbox": "../checkbox/checkbox"
|
||||
}
|
||||
}
|
||||
@ -1,15 +0,0 @@
|
||||
<view class="{{ classPrefix }} {{prefix}}-class" style="{{customStyle}}">
|
||||
<slot />
|
||||
<block wx:for="{{checkboxOptions}}" wx:key="value">
|
||||
<t-checkbox
|
||||
class="{{prefix}}-checkbox-option"
|
||||
label="{{item.label || item.text || ''}}"
|
||||
value="{{item.value || ''}}"
|
||||
content="{{item.content || ''}}"
|
||||
check-all="{{item.checkAll}}"
|
||||
disabled="{{item.disabled}}"
|
||||
data-item="{{item}}"
|
||||
bind:change="handleInnerChildChange"
|
||||
></t-checkbox>
|
||||
</block>
|
||||
</view>
|
||||
@ -1,3 +0,0 @@
|
||||
import { TdCheckboxGroupProps } from './type';
|
||||
declare const props: TdCheckboxGroupProps;
|
||||
export default props;
|
||||
@ -1,31 +0,0 @@
|
||||
const props = {
|
||||
customStyle: {
|
||||
type: String,
|
||||
value: '',
|
||||
},
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
value: false,
|
||||
},
|
||||
max: {
|
||||
type: Number,
|
||||
value: undefined,
|
||||
},
|
||||
name: {
|
||||
type: String,
|
||||
value: '',
|
||||
},
|
||||
options: {
|
||||
type: Array,
|
||||
value: [],
|
||||
},
|
||||
value: {
|
||||
type: Array,
|
||||
value: null,
|
||||
},
|
||||
defaultValue: {
|
||||
type: Array,
|
||||
value: [],
|
||||
},
|
||||
};
|
||||
export default props;
|
||||
@ -1,38 +0,0 @@
|
||||
export interface TdCheckboxGroupProps {
|
||||
customStyle?: {
|
||||
type: StringConstructor;
|
||||
value?: string;
|
||||
};
|
||||
disabled?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
max?: {
|
||||
type: NumberConstructor;
|
||||
value?: number;
|
||||
};
|
||||
name?: {
|
||||
type: StringConstructor;
|
||||
value?: string;
|
||||
};
|
||||
options?: {
|
||||
type: ArrayConstructor;
|
||||
value?: Array<CheckboxOption>;
|
||||
};
|
||||
value?: {
|
||||
type: ArrayConstructor;
|
||||
value?: CheckboxGroupValue;
|
||||
};
|
||||
defaultValue?: {
|
||||
type: ArrayConstructor;
|
||||
value?: CheckboxGroupValue;
|
||||
};
|
||||
}
|
||||
export declare type CheckboxOption = string | number | CheckboxOptionObj;
|
||||
export interface CheckboxOptionObj {
|
||||
label?: string;
|
||||
value?: string | number;
|
||||
disabled?: boolean;
|
||||
checkAll?: true;
|
||||
}
|
||||
export declare type CheckboxGroupValue = Array<string | number>;
|
||||
@ -1 +0,0 @@
|
||||
export {};
|
||||
@ -1,49 +0,0 @@
|
||||
:: BASE_DOC ::
|
||||
|
||||
## API
|
||||
### Checkbox Props
|
||||
|
||||
name | type | default | description | required
|
||||
-- | -- | -- | -- | --
|
||||
align | String | left | options：left/right | N
|
||||
block | Boolean | true | \- | N
|
||||
check-all | Boolean | false | \- | N
|
||||
checked | Boolean | false | \- | N
|
||||
default-checked | Boolean | undefined | uncontrolled property | N
|
||||
content | String / Slot | - | \- | N
|
||||
content-disabled | Boolean | - | \- | N
|
||||
custom-style | String | - | `0.25.0` | N
|
||||
disabled | Boolean | undefined | \- | N
|
||||
external-classes | Array | - | `['t-class', 't-class-icon', 't-class-label', 't-class-content', 't-class-border']` | N
|
||||
icon | String / Array | 'circle' | Typescript：`'circle' \| 'line' \| 'rectangle' \| string[]` | N
|
||||
indeterminate | Boolean | false | \- | N
|
||||
label | String / Slot | - | \- | N
|
||||
max-content-row | Number | 5 | \- | N
|
||||
max-label-row | Number | 3 | \- | N
|
||||
name | String | - | \- | N
|
||||
readonly | Boolean | false | \- | N
|
||||
value | String / Number | - | Typescript：`string \| number \| boolean` | N
|
||||
|
||||
### Checkbox Events
|
||||
|
||||
name | params | description
|
||||
-- | -- | --
|
||||
change | `(checked: boolean)` | \-
|
||||
|
||||
### CheckboxGroup Props
|
||||
|
||||
name | type | default | description | required
|
||||
-- | -- | -- | -- | --
|
||||
custom-style | String | - | `0.25.0` | N
|
||||
disabled | Boolean | false | \- | N
|
||||
max | Number | undefined | \- | N
|
||||
name | String | - | \- | N
|
||||
options | Array | [] | Typescript：`Array<CheckboxOption>` `type CheckboxOption = string \| number \| CheckboxOptionObj` `interface CheckboxOptionObj { label?: string; value?: string \| number; disabled?: boolean; checkAll?: true }`。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/checkbox-group/type.ts) | N
|
||||
value | Array | [] | Typescript：`CheckboxGroupValue` `type CheckboxGroupValue = Array<string \| number>`。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/checkbox-group/type.ts) | N
|
||||
default-value | Array | undefined | uncontrolled property。Typescript：`CheckboxGroupValue` `type CheckboxGroupValue = Array<string \| number>`。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/checkbox-group/type.ts) | N
|
||||
|
||||
### CheckboxGroup Events
|
||||
|
||||
name | params | description
|
||||
-- | -- | --
|
||||
change | `(value: CheckboxGroupValue, context: CheckboxGroupChangeContext)` | [see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/checkbox-group/type.ts)。<br/>`interface CheckboxGroupChangeContext { e: Event; current: string \| number; option: CheckboxOption \| TdCheckboxProps; type: 'check' \| 'uncheck' }`<br/>
|
||||
@ -1,108 +0,0 @@
|
||||
---
|
||||
title: Checkbox 复选框
|
||||
description: 用于预设的一组选项中执行多项选择，并呈现选择结果。
|
||||
spline: form
|
||||
isComponent: true
|
||||
---
|
||||
|
||||
<span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20lines-85%25-blue" /></span><span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20functions-87%25-blue" /></span><span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20statements-86%25-blue" /></span><span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20branches-76%25-red" /></span>
|
||||
## 引入
|
||||
|
||||
全局引入，在 miniprogram 根目录下的`app.json`中配置，局部引入，在需要引入的页面或组件的`index.json`中配置。
|
||||
|
||||
```json
|
||||
"usingComponents": {
|
||||
"t-checkbox": "tdesign-miniprogram/checkbox/checkbox",
|
||||
"t-checkbox-group": "tdesign-miniprogram/checkbox-group/checkbox-group"
|
||||
}
|
||||
```
|
||||
|
||||
## 代码演示
|
||||
|
||||
### 组件类型
|
||||
|
||||
纵向多选框
|
||||
|
||||
{{ base }}
|
||||
|
||||
横向多选框
|
||||
|
||||
{{ horizontal }}
|
||||
|
||||
带全选多选框
|
||||
|
||||
{{ all }}
|
||||
|
||||
### 组件状态
|
||||
|
||||
多选框状态
|
||||
|
||||
{{ status }}
|
||||
|
||||
### 组件样式
|
||||
|
||||
勾选样式
|
||||
|
||||
{{ type }}
|
||||
|
||||
勾选显示位置
|
||||
|
||||
{{ right }}
|
||||
|
||||
非通栏多选样式
|
||||
|
||||
{{ card }}
|
||||
|
||||
### 组件规格
|
||||
|
||||
多选框尺寸规格
|
||||
|
||||
{{ special }}
|
||||
|
||||
## API
|
||||
### Checkbox Props
|
||||
|
||||
名称 | 类型 | 默认值 | 说明 | 必传
|
||||
-- | -- | -- | -- | --
|
||||
align | String | left | 多选框和内容相对位置。可选项：left/right | N
|
||||
block | Boolean | true | 是否为块级元素 | N
|
||||
check-all | Boolean | false | 用于标识是否为「全选选项」。单独使用无效，需在 CheckboxGroup 中使用 | N
|
||||
checked | Boolean | false | 是否选中 | N
|
||||
default-checked | Boolean | undefined | 是否选中。非受控属性 | N
|
||||
content | String / Slot | - | 多选框内容 | N
|
||||
content-disabled | Boolean | - | 是否禁用组件内容（content）触发选中 | N
|
||||
custom-style | String | - | `0.25.0`。自定义组件样式 | N
|
||||
disabled | Boolean | undefined | 是否禁用组件 | N
|
||||
external-classes | Array | - | 组件类名，分别用于设置 组件外层、多选框图标、主文案、内容 等元素类名。`['t-class', 't-class-icon', 't-class-label', 't-class-content', 't-class-border']` | N
|
||||
icon | String / Array | 'circle' | 自定义选中图标和非选中图标。使用 Array 时表示：`[选中态图标，非选中态图标]`。使用 String 时，值为 circle 表示填充圆形图标、值为 line 表示描边型图标、值为 rectangle 表示填充矩形图标。TS 类型：`'circle' \| 'line' \| 'rectangle' \| string[]` | N
|
||||
indeterminate | Boolean | false | 是否为半选 | N
|
||||
label | String / Slot | - | 主文案 | N
|
||||
max-content-row | Number | 5 | 内容最大行数限制 | N
|
||||
max-label-row | Number | 3 | 主文案最大行数限制 | N
|
||||
name | String | - | HTML 元素原生属性 | N
|
||||
readonly | Boolean | false | 只读状态 | N
|
||||
value | String / Number | - | 多选框的值。TS 类型：`string \| number` | N
|
||||
|
||||
### Checkbox Events
|
||||
|
||||
名称 | 参数 | 描述
|
||||
-- | -- | --
|
||||
change | `(checked: boolean)` | 值变化时触发
|
||||
|
||||
### CheckboxGroup Props
|
||||
|
||||
名称 | 类型 | 默认值 | 说明 | 必传
|
||||
-- | -- | -- | -- | --
|
||||
custom-style | String | - | `0.25.0`。自定义组件样式 | N
|
||||
disabled | Boolean | false | 是否禁用组件 | N
|
||||
max | Number | undefined | 支持最多选中的数量 | N
|
||||
name | String | - | 统一设置内部复选框 HTML 属性 | N
|
||||
options | Array | [] | 以配置形式设置子元素。示例1：`['北京', '上海']` ，示例2: `[{ label: '全选', checkAll: true }, { label: '上海', value: 'shanghai' }]`。checkAll 值为 true 表示当前选项为「全选选项」。TS 类型：`Array<CheckboxOption>` `type CheckboxOption = string \| number \| CheckboxOptionObj` `interface CheckboxOptionObj { label?: string; value?: string \| number; disabled?: boolean; checkAll?: true }`。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/checkbox-group/type.ts) | N
|
||||
value | Array | [] | 选中值。TS 类型：`CheckboxGroupValue` `type CheckboxGroupValue = Array<string \| number>`。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/checkbox-group/type.ts) | N
|
||||
default-value | Array | undefined | 选中值。非受控属性。TS 类型：`CheckboxGroupValue` `type CheckboxGroupValue = Array<string \| number>`。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/checkbox-group/type.ts) | N
|
||||
|
||||
### CheckboxGroup Events
|
||||
|
||||
名称 | 参数 | 描述
|
||||
-- | -- | --
|
||||
change | `(value: CheckboxGroupValue, context: CheckboxGroupChangeContext)` | 值变化时触发。`context.current` 表示当前变化的数据项，如果是全选则为空；`context.type` 表示引起选中数据变化的是选中或是取消选中，`context.option` 表示当前变化的数据项。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/checkbox-group/type.ts)。<br/>`interface CheckboxGroupChangeContext { e: Event; current: string \| number; option: CheckboxOption \| TdCheckboxProps; type: 'check' \| 'uncheck' }`<br/>
|
||||
@ -1,100 +0,0 @@
|
||||
import { SuperComponent, ComponentsOptionsType, RelationsOptions } from '../common/src/index';
|
||||
export default class CheckBox extends SuperComponent {
|
||||
externalClasses: string[];
|
||||
behaviors: string[];
|
||||
relations: RelationsOptions;
|
||||
options: ComponentsOptionsType;
|
||||
properties: {
|
||||
theme: {
|
||||
type: StringConstructor;
|
||||
value: string;
|
||||
};
|
||||
borderless: {
|
||||
type: BooleanConstructor;
|
||||
value: boolean;
|
||||
};
|
||||
align?: {
|
||||
type: StringConstructor;
|
||||
value?: "left" | "right";
|
||||
};
|
||||
block?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
checkAll?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
checked?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
defaultChecked?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
content?: {
|
||||
type: StringConstructor;
|
||||
value?: string;
|
||||
};
|
||||
contentDisabled?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
customStyle?: {
|
||||
type: StringConstructor;
|
||||
value?: string;
|
||||
};
|
||||
disabled?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
externalClasses?: {
|
||||
type: ArrayConstructor;
|
||||
value?: ["t-class", "t-class-icon", "t-class-label", "t-class-content", "t-class-border"];
|
||||
};
|
||||
icon?: {
|
||||
type: null;
|
||||
value?: string[] | "circle" | "rectangle" | "line";
|
||||
};
|
||||
indeterminate?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
label?: {
|
||||
type: StringConstructor;
|
||||
value?: string;
|
||||
};
|
||||
maxContentRow?: {
|
||||
type: NumberConstructor;
|
||||
value?: number;
|
||||
};
|
||||
maxLabelRow?: {
|
||||
type: NumberConstructor;
|
||||
value?: number;
|
||||
};
|
||||
name?: {
|
||||
type: StringConstructor;
|
||||
value?: string;
|
||||
};
|
||||
readonly?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
value?: {
|
||||
type: null;
|
||||
value?: string | number | boolean;
|
||||
};
|
||||
};
|
||||
data: {
|
||||
prefix: string;
|
||||
classPrefix: string;
|
||||
};
|
||||
controlledProps: {
|
||||
key: string;
|
||||
event: string;
|
||||
}[];
|
||||
methods: {
|
||||
onChange(e: WechatMiniprogram.TouchEvent): void;
|
||||
};
|
||||
}
|
||||
@ -1,88 +0,0 @@
|
||||
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
||||
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
||||
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
||||
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
||||
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
||||
};
|
||||
import { SuperComponent, wxComponent } from '../common/src/index';
|
||||
import config from '../common/config';
|
||||
import Props from './props';
|
||||
const { prefix } = config;
|
||||
const name = `${prefix}-checkbox`;
|
||||
let CheckBox = class CheckBox extends SuperComponent {
|
||||
constructor() {
|
||||
super(...arguments);
|
||||
this.externalClasses = [
|
||||
`${prefix}-class`,
|
||||
`${prefix}-class-label`,
|
||||
`${prefix}-class-icon`,
|
||||
`${prefix}-class-content`,
|
||||
`${prefix}-class-border`,
|
||||
];
|
||||
this.behaviors = ['wx://form-field'];
|
||||
this.relations = {
|
||||
'../checkbox-group/checkbox-group': {
|
||||
type: 'ancestor',
|
||||
linked(parent) {
|
||||
const { value, disabled, borderless } = parent.data;
|
||||
const valueSet = new Set(value);
|
||||
const data = {
|
||||
disabled: disabled || this.data.disabled,
|
||||
};
|
||||
if (borderless) {
|
||||
data.borderless = true;
|
||||
}
|
||||
data.checked = valueSet.has(this.data.value);
|
||||
if (this.data.checkAll) {
|
||||
data.checked = valueSet.size > 0;
|
||||
}
|
||||
this.setData(data);
|
||||
},
|
||||
},
|
||||
};
|
||||
this.options = {
|
||||
multipleSlots: true,
|
||||
};
|
||||
this.properties = Object.assign(Object.assign({}, Props), { theme: {
|
||||
type: String,
|
||||
value: 'default',
|
||||
}, borderless: {
|
||||
type: Boolean,
|
||||
value: false,
|
||||
} });
|
||||
this.data = {
|
||||
prefix,
|
||||
classPrefix: name,
|
||||
};
|
||||
this.controlledProps = [
|
||||
{
|
||||
key: 'checked',
|
||||
event: 'change',
|
||||
},
|
||||
];
|
||||
this.methods = {
|
||||
onChange(e) {
|
||||
const { disabled, readonly } = this.data;
|
||||
if (disabled || readonly)
|
||||
return;
|
||||
const { target } = e.currentTarget.dataset;
|
||||
const { contentDisabled } = this.data;
|
||||
if (target === 'text' && contentDisabled) {
|
||||
return;
|
||||
}
|
||||
const checked = !this.data.checked;
|
||||
const parent = this.$parent;
|
||||
if (parent) {
|
||||
parent.updateValue(Object.assign(Object.assign({}, this.data), { checked }));
|
||||
}
|
||||
else {
|
||||
this._trigger('change', { checked });
|
||||
}
|
||||
},
|
||||
};
|
||||
}
|
||||
};
|
||||
CheckBox = __decorate([
|
||||
wxComponent()
|
||||
], CheckBox);
|
||||
export default CheckBox;
|
||||
@ -1,7 +0,0 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"t-cell": "../cell/cell",
|
||||
"t-icon": "../icon/icon"
|
||||
}
|
||||
}
|
||||
@ -1,56 +0,0 @@
|
||||
<wxs src="../common/utils.wxs" module="_" />
|
||||
|
||||
<view
|
||||
style="{{ customStyle }}"
|
||||
class="{{_.cls(classPrefix, [align, theme, ['checked', checked], ['block', block]])}} {{prefix}}-class"
|
||||
aria-role="checkbox"
|
||||
aria-checked="{{checked ? (indeterminate ? 'mixed' : true) : false}}"
|
||||
aria-disabled="{{disabled ? true : false}}"
|
||||
bind:tap="onChange"
|
||||
tabindex="{{tabindex}}"
|
||||
>
|
||||
<view
|
||||
wx:if="{{theme == 'default'}}"
|
||||
class="{{_.cls(classPrefix + '__icon', [align, ['checked', checked], ['disabled', disabled]])}} {{prefix}}-class-icon"
|
||||
>
|
||||
<view wx:if="{{_.isArray(icon)}}" class="{{classPrefix}}__icon">
|
||||
<image src="{{checked ? icon[0] : icon[1]}}" class="{{classPrefix}}__icon-image" webp />
|
||||
</view>
|
||||
<block wx:else>
|
||||
<t-icon
|
||||
wx:if="{{checked && (icon == 'circle' || icon == 'rectangle')}}"
|
||||
name="{{indeterminate ? ('minus-' + icon + '-filled') : ('check-' + icon + '-filled')}}"
|
||||
class="{{_.cls(classPrefix + '__icon-wrapper', [])}}"
|
||||
/>
|
||||
<t-icon
|
||||
wx:if="{{checked && icon == 'line'}}"
|
||||
name="{{indeterminate ? ('minus-' + icon + '-filled') : 'check'}}"
|
||||
class="{{_.cls(classPrefix + '__icon-wrapper', [])}}"
|
||||
/>
|
||||
<view
|
||||
wx:elif="{{!checked && (icon == 'circle' || icon == 'rectangle')}}"
|
||||
class="{{_.cls(classPrefix + '__icon-' + icon, [['disabled', disabled]])}}"
|
||||
/>
|
||||
<view wx:if="{{!checked && icon == 'line'}}" class="placeholder"></view>
|
||||
</block>
|
||||
</view>
|
||||
<view class="{{classPrefix}}__content" data-target="text" catch:tap="onChange">
|
||||
<view
|
||||
class="{{_.cls(classPrefix + '__title', [['disabled', disabled], ['checked', checked]])}} {{prefix}}-class-label"
|
||||
style="-webkit-line-clamp:{{maxLabelRow}}"
|
||||
>
|
||||
{{label}}
|
||||
<slot />
|
||||
<slot name="label" />
|
||||
</view>
|
||||
<view
|
||||
class="{{_.cls(classPrefix + '__description', [['disabled', disabled]])}} {{prefix}}-class-content "
|
||||
style="-webkit-line-clamp:{{maxContentRow}}"
|
||||
>{{content}}<slot name="content"
|
||||
/></view>
|
||||
</view>
|
||||
<view
|
||||
wx:if="{{theme == 'default' && !borderless}}"
|
||||
class="{{_.cls(classPrefix + '__border', [align])}} {{prefix}}-class-border"
|
||||
/>
|
||||
</view>
|
||||
@ -1,202 +0,0 @@
|
||||
.t-float-left {
|
||||
float: left;
|
||||
}
|
||||
.t-float-right {
|
||||
float: right;
|
||||
}
|
||||
@keyframes tdesign-fade-out {
|
||||
from {
|
||||
opacity: 1;
|
||||
}
|
||||
to {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
.hotspot-expanded.relative {
|
||||
position: relative;
|
||||
}
|
||||
.hotspot-expanded::after {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
transform: scale(1.5);
|
||||
}
|
||||
.t-checkbox {
|
||||
display: inline-flex;
|
||||
vertical-align: middle;
|
||||
position: relative;
|
||||
font-size: var(--td-checkbox-font-size, 32rpx);
|
||||
background: var(--td-checkbox-bg-color, var(--td-bg-color-block, #fff));
|
||||
}
|
||||
.t-checkbox:focus {
|
||||
outline: 0;
|
||||
}
|
||||
.t-checkbox--block {
|
||||
display: flex;
|
||||
padding: var(--td-checkbox-vertical-padding, 32rpx);
|
||||
}
|
||||
.t-checkbox--right {
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
.t-checkbox .limit-title-row {
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
}
|
||||
.t-checkbox .image-center {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
.t-checkbox__icon-left {
|
||||
margin-right: 20rpx;
|
||||
width: 40rpx;
|
||||
}
|
||||
.t-checkbox__icon-right {
|
||||
right: 0px;
|
||||
display: contents;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
.t-checkbox__icon-image {
|
||||
width: var(--td-checkbox-icon-size, 48rpx);
|
||||
height: var(--td-checkbox-icon-size, 48rpx);
|
||||
vertical-align: top;
|
||||
}
|
||||
.t-checkbox__icon {
|
||||
position: relative;
|
||||
display: block;
|
||||
width: var(--td-checkbox-icon-size, 48rpx);
|
||||
height: var(--td-checkbox-icon-size, 48rpx);
|
||||
color: var(--td-checkbox-icon-color, var(--td-gray-color-4, #dcdcdc));
|
||||
font-size: var(--td-checkbox-icon-size, 48rpx);
|
||||
}
|
||||
.t-checkbox__icon:empty {
|
||||
display: none;
|
||||
}
|
||||
.t-checkbox__icon--checked {
|
||||
color: var(--td-checkbox-icon-checked-color, var(--td-primary-color, #0052d9));
|
||||
}
|
||||
.t-checkbox__icon--disabled {
|
||||
cursor: not-allowed;
|
||||
color: var(--td-checkbox-icon-disabled-color, var(--td-primary-color-3, #bbd3fb));
|
||||
}
|
||||
.t-checkbox__icon--left {
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
.t-checkbox__icon-circle {
|
||||
width: 84rpx;
|
||||
height: 84rpx;
|
||||
border: 3px solid var(--td-checkbox-icon-color, var(--td-gray-color-4, #dcdcdc));
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%) scale(0.5);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.t-checkbox__icon-circle--disabled {
|
||||
background: var(--td-checkbox-icon-disabled-bg-color, var(--td-gray-color-2, #eeeeee));
|
||||
}
|
||||
.t-checkbox__icon-rectangle {
|
||||
width: 72rpx;
|
||||
height: 72rpx;
|
||||
border: 3px solid var(--td-checkbox-icon-color, var(--td-gray-color-4, #dcdcdc));
|
||||
border-radius: 4rpx;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%) scale(0.5);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.t-checkbox__icon-rectangle--disabled {
|
||||
background: var(--td-checkbox-icon-disabled-bg-color, var(--td-gray-color-2, #eeeeee));
|
||||
}
|
||||
.t-checkbox__icon-line:before,
|
||||
.t-checkbox__icon-line:after {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: 5rpx;
|
||||
border-radius: 2rpx;
|
||||
background: var(--td-checkbox-icon-checked-color, var(--td-primary-color, #0052d9));
|
||||
transform-origin: top center;
|
||||
}
|
||||
.t-checkbox__icon-line:before {
|
||||
height: 16rpx;
|
||||
left: 8rpx;
|
||||
top: 22rpx;
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
.t-checkbox__icon-line::after {
|
||||
height: 26rpx;
|
||||
right: 8rpx;
|
||||
top: 14rpx;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
.t-checkbox__icon-line--disabled::before,
|
||||
.t-checkbox__icon-line--disabled::after {
|
||||
background: var(--td-checkbox-icon-disabled-color, var(--td-primary-color-3, #bbd3fb));
|
||||
}
|
||||
.t-checkbox__content {
|
||||
flex: 1;
|
||||
}
|
||||
.t-checkbox__title {
|
||||
color: var(--td-checkbox-title-color, var(--td-font-gray-1, rgba(0, 0, 0, 0.9)));
|
||||
line-height: var(--td-checkbox-title-line-height, 48rpx);
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
}
|
||||
.t-checkbox__title--disabled {
|
||||
color: var(--td-checkbox-title-disabled-color, var(--td-font-gray-4, rgba(0, 0, 0, 0.26)));
|
||||
}
|
||||
.t-checkbox__description {
|
||||
color: var(--td-checkbox-description-color, var(--td-font-gray-2, rgba(0, 0, 0, 0.6)));
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
font-size: 28rpx;
|
||||
line-height: var(--td-checkbox-description-line-height, 44rpx);
|
||||
}
|
||||
.t-checkbox__description--disabled {
|
||||
color: var(--td-checkbox-description-disabled-color, var(--td-font-gray-4, rgba(0, 0, 0, 0.26)));
|
||||
}
|
||||
.t-checkbox__title + .t-checkbox__description:not(:empty) {
|
||||
margin-top: 8rpx;
|
||||
}
|
||||
.t-checkbox__border {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 96rpx;
|
||||
right: 0;
|
||||
height: 1px;
|
||||
background: var(--td-checkbox-border-color, var(--td-gray-color-3, #e7e7e7));
|
||||
transform: scaleY(0.5);
|
||||
}
|
||||
.t-checkbox__border--right {
|
||||
left: 32rpx;
|
||||
}
|
||||
.t-checkbox--tag {
|
||||
font-size: 28rpx;
|
||||
padding-top: 16rpx;
|
||||
padding-bottom: 16rpx;
|
||||
text-align: center;
|
||||
background-color: #f3f3f3;
|
||||
border-radius: 12rpx;
|
||||
}
|
||||
.t-checkbox--tag.t-checkbox--checked {
|
||||
color: var(--td-checkbox-tag-active-color, var(--td-primary-color, #0052d9));
|
||||
background-color: var(--td-checkbox-tag-active-bg-color, var(--td-primary-color-1, #ecf2fe));
|
||||
}
|
||||
.t-checkbox--tag .t-checkbox__title--checked {
|
||||
color: var(--td-checkbox-tag-active-color, var(--td-primary-color, #0052d9));
|
||||
}
|
||||
.t-checkbox--tag .t-checkbox__content {
|
||||
margin-right: 0;
|
||||
}
|
||||
@ -1,3 +0,0 @@
|
||||
import { TdCheckboxProps } from './type';
|
||||
declare const props: TdCheckboxProps;
|
||||
export default props;
|
||||
@ -1,70 +0,0 @@
|
||||
const props = {
|
||||
align: {
|
||||
type: String,
|
||||
value: 'left',
|
||||
},
|
||||
block: {
|
||||
type: Boolean,
|
||||
value: true,
|
||||
},
|
||||
checkAll: {
|
||||
type: Boolean,
|
||||
value: false,
|
||||
},
|
||||
checked: {
|
||||
type: Boolean,
|
||||
value: null,
|
||||
},
|
||||
defaultChecked: {
|
||||
type: Boolean,
|
||||
value: false,
|
||||
},
|
||||
content: {
|
||||
type: String,
|
||||
},
|
||||
contentDisabled: {
|
||||
type: Boolean,
|
||||
},
|
||||
customStyle: {
|
||||
type: String,
|
||||
value: '',
|
||||
},
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
value: undefined,
|
||||
},
|
||||
externalClasses: {
|
||||
type: Array,
|
||||
},
|
||||
icon: {
|
||||
type: null,
|
||||
value: 'circle',
|
||||
},
|
||||
indeterminate: {
|
||||
type: Boolean,
|
||||
value: false,
|
||||
},
|
||||
label: {
|
||||
type: String,
|
||||
},
|
||||
maxContentRow: {
|
||||
type: Number,
|
||||
value: 5,
|
||||
},
|
||||
maxLabelRow: {
|
||||
type: Number,
|
||||
value: 3,
|
||||
},
|
||||
name: {
|
||||
type: String,
|
||||
value: '',
|
||||
},
|
||||
readonly: {
|
||||
type: Boolean,
|
||||
value: false,
|
||||
},
|
||||
value: {
|
||||
type: null,
|
||||
},
|
||||
};
|
||||
export default props;
|
||||
@ -1,74 +0,0 @@
|
||||
export interface TdCheckboxProps {
|
||||
align?: {
|
||||
type: StringConstructor;
|
||||
value?: 'left' | 'right';
|
||||
};
|
||||
block?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
checkAll?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
checked?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
defaultChecked?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
content?: {
|
||||
type: StringConstructor;
|
||||
value?: string;
|
||||
};
|
||||
contentDisabled?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
customStyle?: {
|
||||
type: StringConstructor;
|
||||
value?: string;
|
||||
};
|
||||
disabled?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
externalClasses?: {
|
||||
type: ArrayConstructor;
|
||||
value?: ['t-class', 't-class-icon', 't-class-label', 't-class-content', 't-class-border'];
|
||||
};
|
||||
icon?: {
|
||||
type: null;
|
||||
value?: 'circle' | 'line' | 'rectangle' | string[];
|
||||
};
|
||||
indeterminate?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
label?: {
|
||||
type: StringConstructor;
|
||||
value?: string;
|
||||
};
|
||||
maxContentRow?: {
|
||||
type: NumberConstructor;
|
||||
value?: number;
|
||||
};
|
||||
maxLabelRow?: {
|
||||
type: NumberConstructor;
|
||||
value?: number;
|
||||
};
|
||||
name?: {
|
||||
type: StringConstructor;
|
||||
value?: string;
|
||||
};
|
||||
readonly?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
value?: {
|
||||
type: null;
|
||||
value?: string | number | boolean;
|
||||
};
|
||||
}
|
||||
@ -1 +0,0 @@
|
||||
export {};
|
||||
@ -1,29 +0,0 @@
|
||||
:: BASE_DOC ::
|
||||
|
||||
## API
|
||||
### Message Props
|
||||
|
||||
name | type | default | description | required
|
||||
-- | -- | -- | -- | --
|
||||
action | String / Slot | - | operation | N
|
||||
align | String | left | options：left/center。Typescript：`MessageAlignType` `type MessageAlignType = 'left' \| 'center'`。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/message/type.ts) | N
|
||||
close-btn | String / Boolean / Object / Slot | false | \- | N
|
||||
content | String / Slot | - | \- | N
|
||||
custom-style `v0.25.0` | String | - | \- | N
|
||||
duration | Number | 3000 | \- | N
|
||||
external-classes | Array | - | `['t-class', 't-class-content', 't-class-icon', 't-class-action', 't-class-close-btn']` | N
|
||||
icon | String / Boolean / Object/ Slot | true | Typescript：`boolean \| 'info' \| 'bell'` | N
|
||||
marquee | Boolean / Object | false | Typescript：`boolean \| DrawMarquee` `interface DrawMarquee { speed?: number; loop?: number; delay?: number }`。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/message/type.ts) | N
|
||||
offset | Array | - | Typescript：`Array<string \| number>` | N
|
||||
theme | String | info | options：info/success/warning/error。Typescript：`MessageThemeList` `type MessageThemeList = 'info' \| 'success' \| 'warning' \| 'error'`。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/message/type.ts) | N
|
||||
visible | Boolean | false | \- | N
|
||||
default-visible | Boolean | false | uncontrolled property | N
|
||||
z-index | Number | 15000 | \- | N
|
||||
|
||||
### Message Events
|
||||
|
||||
name | params | description
|
||||
-- | -- | --
|
||||
action-btn-click | - | \-
|
||||
close-btn-click | - | \-
|
||||
duration-end | \- | \-
|
||||
@ -1,70 +0,0 @@
|
||||
---
|
||||
title: Message 消息通知
|
||||
description: 用于轻量级反馈或提示，不会打断用户操作。
|
||||
spline: message
|
||||
isComponent: true
|
||||
---
|
||||
|
||||
<span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20lines-94%25-blue" /></span><span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20functions-89%25-blue" /></span><span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20statements-94%25-blue" /></span><span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20branches-86%25-blue" /></span>
|
||||
## 引入
|
||||
|
||||
全局引入，在 miniprogram 根目录下的`app.json`中配置，局部引入，在需要引入的页面或组件的`index.json`中配置。
|
||||
|
||||
```json
|
||||
"usingComponents": {
|
||||
"t-message": "tdesign-miniprogram/message/message"
|
||||
}
|
||||
```
|
||||
|
||||
### 引入 API
|
||||
|
||||
若以 API 形式调用 Message，则需在页面 `page.js` 中引入组件 API：
|
||||
|
||||
```js
|
||||
import Message from 'tdesign-miniprogram/message/index';
|
||||
```
|
||||
|
||||
## 代码演示
|
||||
|
||||
### 组件类型
|
||||
|
||||
弹窗内容为纯文本、标题和副标题、带输入框，用 API `Message.info` 方法调用反馈类对话框。
|
||||
|
||||
|
||||
{{ base }}
|
||||
|
||||
|
||||
### 组件状态
|
||||
|
||||
消息通知类型为普通（info）、警示（warning）、成功（success）、错误（error）
|
||||
|
||||
{{ theme }}
|
||||
|
||||
## API
|
||||
### Message Props
|
||||
|
||||
名称 | 类型 | 默认值 | 说明 | 必传
|
||||
-- | -- | -- | -- | --
|
||||
action | String / Slot | - | 操作 | N
|
||||
align | String | left | 文本对齐方式。可选项：left/center。TS 类型：`MessageAlignType` `type MessageAlignType = 'left' \| 'center'`。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/message/type.ts) | N
|
||||
close-btn | String / Boolean / Object / Slot | false | 关闭按钮，可以自定义。值为 true 显示默认关闭按钮，值为 false 不显示关闭按钮。值类型为 string ，如：'user'，则显示组件内置图标，为 'slot' 则表示使用插槽。值类型为 object ，则会透传至 icon 组件。| N
|
||||
content | String / Slot | - | 用于自定义消息弹出内容 | N
|
||||
custom-style `v0.25.0` | String | - | 自定义组件样式 | N
|
||||
duration | Number | 3000 | 消息内置计时器，计时到达时会触发 duration-end 事件。单位：毫秒。值为 0 则表示没有计时器。 | N
|
||||
external-classes | Array | - | 样式类名，分别用于设置 组件外层、消息内容、左侧图标、操作按钮、关闭按钮等元素类名。`['t-class', 't-class-content', 't-class-icon', 't-class-action', 't-class-close-btn']` | N
|
||||
icon | String / Boolean / Object / Slot | true | 消息提醒前面的图标，可以自定义。值为 true 则根据 theme 显示对应的图标，值为 false 则不显示图标。值为 true 显示默认关闭按钮，值为 false 不显示关闭按钮。值类型为 string ，如：'info'，则显示组件内置图标，为 'slot' 则表示使用插槽。值类型为 object ，则会透传至 icon 组件。| N
|
||||
marquee | Boolean / Object | false | 跑马灯效果。speed 指速度控制；loop 指循环播放次数，值为 -1 表示循环播放，值为 0 表示不循环播放；delay 表示延迟多久开始播放。TS 类型：`boolean \| DrawMarquee` `interface DrawMarquee { speed?: number; loop?: number
|
||||
; delay?: number }`。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/message/type.ts) | N
|
||||
offset | Array | - | 相对于 placement 的偏移量，默认单位 rpx。示例：[-10, 20] 或 ['10rpx', '8rpx']。TS 类型：`Array<string \| number>` | N
|
||||
theme | String | info | 消息组件风格。可选项：info/success/warning/error。TS 类型：`MessageThemeList` `type MessageThemeList = 'info' \| 'success' \| 'warning' \| 'error'`。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/message/type.ts) | N
|
||||
visible | Boolean | false | 是否显示，隐藏时默认销毁组件 | N
|
||||
default-visible | Boolean | false | 是否显示，隐藏时默认销毁组件。非受控属性 | N
|
||||
z-index | Number | 15000 | 元素层级，样式默认为 15000 | N
|
||||
|
||||
### Message Events
|
||||
|
||||
名称 | 参数 | 描述
|
||||
-- | -- | --
|
||||
action-btn-click | - | 当操作按钮存在时，用户点击操作按钮时触发
|
||||
close-btn-click | - | 当关闭按钮存在时，用户点击关闭按钮触发
|
||||
duration-end | \- | 计时结束后触发
|
||||
@ -1,17 +0,0 @@
|
||||
/// <reference types="miniprogram-api-typings" />
|
||||
/// <reference types="miniprogram-api-typings" />
|
||||
/// <reference types="miniprogram-api-typings" />
|
||||
import { MessageProps } from './message.interface';
|
||||
declare type Context = WechatMiniprogram.Page.TrivialInstance | WechatMiniprogram.Component.TrivialInstance;
|
||||
interface MessageActionOptionsType extends Optional<MessageProps> {
|
||||
context?: Context;
|
||||
selector?: string;
|
||||
}
|
||||
declare const _default: {
|
||||
info(options: MessageActionOptionsType): WechatMiniprogram.Component.TrivialInstance;
|
||||
success(options: MessageActionOptionsType): WechatMiniprogram.Component.TrivialInstance;
|
||||
warning(options: MessageActionOptionsType): WechatMiniprogram.Component.TrivialInstance;
|
||||
error(options: MessageActionOptionsType): WechatMiniprogram.Component.TrivialInstance;
|
||||
hide(options: MessageActionOptionsType): void;
|
||||
};
|
||||
export default _default;
|
||||
@ -1,46 +0,0 @@
|
||||
var __rest = (this && this.__rest) || function (s, e) {
|
||||
var t = {};
|
||||
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
||||
t[p] = s[p];
|
||||
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
||||
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
||||
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
||||
t[p[i]] = s[p[i]];
|
||||
}
|
||||
return t;
|
||||
};
|
||||
import { MessageType } from './message.interface';
|
||||
import { getInstance } from '../common/utils';
|
||||
const showMessage = function (options, theme = MessageType.info) {
|
||||
const { context, selector = '#t-message' } = options, otherOptions = __rest(options, ["context", "selector"]);
|
||||
const instance = getInstance(context, selector);
|
||||
if (instance) {
|
||||
instance.resetData(() => {
|
||||
instance.setData(Object.assign({ theme }, otherOptions), instance.show.bind(instance));
|
||||
});
|
||||
return instance;
|
||||
}
|
||||
console.error('未找到组件,请确认 selector && context 是否正确');
|
||||
};
|
||||
export default {
|
||||
info(options) {
|
||||
return showMessage(options, MessageType.info);
|
||||
},
|
||||
success(options) {
|
||||
return showMessage(options, MessageType.success);
|
||||
},
|
||||
warning(options) {
|
||||
return showMessage(options, MessageType.warning);
|
||||
},
|
||||
error(options) {
|
||||
return showMessage(options, MessageType.error);
|
||||
},
|
||||
hide(options) {
|
||||
const { context, selector = '#t-message' } = Object.assign({}, options);
|
||||
const instance = getInstance(context, selector);
|
||||
if (!instance) {
|
||||
return;
|
||||
}
|
||||
instance.hide();
|
||||
},
|
||||
};
|
||||
@ -1,36 +0,0 @@
|
||||
/// <reference types="miniprogram-api-typings" />
|
||||
import { SuperComponent, ComponentsOptionsType } from '../common/src/index';
|
||||
import { MessageProps } from './message.interface';
|
||||
export default class Message extends SuperComponent {
|
||||
externalClasses: string[];
|
||||
options: ComponentsOptionsType;
|
||||
properties: MessageProps;
|
||||
data: {
|
||||
prefix: string;
|
||||
classPrefix: string;
|
||||
visible: boolean;
|
||||
loop: number;
|
||||
animation: any[];
|
||||
showAnimation: any[];
|
||||
wrapTop: number;
|
||||
};
|
||||
observers: {
|
||||
marquee(val: any): void;
|
||||
icon(icon: any): void;
|
||||
closeBtn(closeBtn: any): void;
|
||||
};
|
||||
closeTimeoutContext: number;
|
||||
nextAnimationContext: number;
|
||||
resetAnimation: WechatMiniprogram.Animation;
|
||||
ready(): void;
|
||||
memoInitalData(): void;
|
||||
resetData(cb: () => void): void;
|
||||
detached(): void;
|
||||
checkAnimation(): void;
|
||||
clearMessageAnimation(): void;
|
||||
show(): void;
|
||||
hide(): void;
|
||||
reset(): void;
|
||||
handleClose(): void;
|
||||
handleBtnClick(): void;
|
||||
}
|
||||
@ -1,24 +0,0 @@
|
||||
export declare enum MessageType {
|
||||
info = "info",
|
||||
success = "success",
|
||||
warning = "warning",
|
||||
error = "error"
|
||||
}
|
||||
export interface MessageMarquee {
|
||||
speed?: number;
|
||||
loop?: number;
|
||||
delay?: number;
|
||||
}
|
||||
export interface MessageProps {
|
||||
visible?: boolean;
|
||||
content: string;
|
||||
align?: string;
|
||||
theme?: MessageType;
|
||||
icon?: boolean | string;
|
||||
closeBtn?: boolean;
|
||||
action?: string;
|
||||
marquee?: MessageMarquee;
|
||||
offset?: object;
|
||||
duration?: number;
|
||||
zIndex?: number;
|
||||
}
|
||||
@ -1,7 +0,0 @@
|
||||
export var MessageType;
|
||||
(function (MessageType) {
|
||||
MessageType["info"] = "info";
|
||||
MessageType["success"] = "success";
|
||||
MessageType["warning"] = "warning";
|
||||
MessageType["error"] = "error";
|
||||
})(MessageType || (MessageType = {}));
|
||||
@ -1,173 +0,0 @@
|
||||
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
||||
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
||||
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
||||
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
||||
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
||||
};
|
||||
import { SuperComponent, wxComponent } from '../common/src/index';
|
||||
import config from '../common/config';
|
||||
import props from './props';
|
||||
import { getRect, unitConvert, setIcon } from '../common/utils';
|
||||
const { prefix } = config;
|
||||
const name = `${prefix}-message`;
|
||||
const SHOW_DURATION = 500;
|
||||
let Message = class Message extends SuperComponent {
|
||||
constructor() {
|
||||
super(...arguments);
|
||||
this.externalClasses = [
|
||||
`${prefix}-class`,
|
||||
`${prefix}-class-content`,
|
||||
`${prefix}-class-icon`,
|
||||
`${prefix}-class-action`,
|
||||
`${prefix}-class-close-btn`,
|
||||
];
|
||||
this.options = {
|
||||
styleIsolation: 'apply-shared',
|
||||
multipleSlots: true,
|
||||
};
|
||||
this.properties = Object.assign({}, props);
|
||||
this.data = {
|
||||
prefix,
|
||||
classPrefix: name,
|
||||
visible: false,
|
||||
loop: -1,
|
||||
animation: [],
|
||||
showAnimation: [],
|
||||
wrapTop: -999,
|
||||
};
|
||||
this.observers = {
|
||||
marquee(val) {
|
||||
if (JSON.stringify(val) === '{}') {
|
||||
this.setData({
|
||||
marquee: {
|
||||
speed: 50,
|
||||
loop: -1,
|
||||
delay: 5000,
|
||||
},
|
||||
});
|
||||
}
|
||||
},
|
||||
icon(icon) {
|
||||
const obj = setIcon('icon', icon, 'error-circle-filled');
|
||||
this.setData(Object.assign({}, obj));
|
||||
},
|
||||
closeBtn(closeBtn) {
|
||||
const obj = setIcon('closeBtn', closeBtn, 'close');
|
||||
this.setData(Object.assign({}, obj));
|
||||
},
|
||||
};
|
||||
this.closeTimeoutContext = 0;
|
||||
this.nextAnimationContext = 0;
|
||||
this.resetAnimation = wx.createAnimation({
|
||||
duration: 0,
|
||||
timingFunction: 'linear',
|
||||
});
|
||||
}
|
||||
ready() {
|
||||
this.memoInitalData();
|
||||
}
|
||||
memoInitalData() {
|
||||
this.initalData = Object.assign(Object.assign({}, this.properties), this.data);
|
||||
}
|
||||
resetData(cb) {
|
||||
this.setData(Object.assign({}, this.initalData), cb);
|
||||
}
|
||||
detached() {
|
||||
this.clearMessageAnimation();
|
||||
}
|
||||
checkAnimation() {
|
||||
if (!this.properties.marquee) {
|
||||
return;
|
||||
}
|
||||
const speeding = this.properties.marquee.speed;
|
||||
if (this.data.loop > 0) {
|
||||
this.data.loop -= 1;
|
||||
}
|
||||
else if (this.data.loop === 0) {
|
||||
this.setData({ animation: this.resetAnimation.translateX(0).step().export() });
|
||||
return;
|
||||
}
|
||||
if (this.nextAnimationContext) {
|
||||
this.clearMessageAnimation();
|
||||
}
|
||||
const warpID = `#${name}__text-wrap`;
|
||||
const nodeID = `#${name}__text`;
|
||||
Promise.all([getRect(this, nodeID), getRect(this, warpID)]).then(([nodeRect, wrapRect]) => {
|
||||
this.setData({
|
||||
animation: this.resetAnimation.translateX(wrapRect.width).step().export(),
|
||||
}, () => {
|
||||
const durationTime = ((nodeRect.width + wrapRect.width) / speeding) * 1000;
|
||||
const nextAnimation = wx
|
||||
.createAnimation({
|
||||
duration: durationTime,
|
||||
})
|
||||
.translateX(-nodeRect.width)
|
||||
.step()
|
||||
.export();
|
||||
setTimeout(() => {
|
||||
this.nextAnimationContext = setTimeout(this.checkAnimation.bind(this), durationTime);
|
||||
this.setData({ animation: nextAnimation });
|
||||
}, 20);
|
||||
});
|
||||
});
|
||||
}
|
||||
clearMessageAnimation() {
|
||||
clearTimeout(this.nextAnimationContext);
|
||||
this.nextAnimationContext = 0;
|
||||
}
|
||||
show() {
|
||||
const { duration, marquee, offset } = this.properties;
|
||||
this.setData({ visible: true, loop: marquee.loop });
|
||||
this.reset();
|
||||
this.checkAnimation();
|
||||
if (duration && duration > 0) {
|
||||
this.closeTimeoutContext = setTimeout(() => {
|
||||
this.hide();
|
||||
this.triggerEvent('durationEnd', { self: this });
|
||||
}, duration);
|
||||
}
|
||||
const wrapID = `#${name}`;
|
||||
getRect(this, wrapID).then((wrapRect) => {
|
||||
this.setData({ wrapTop: -wrapRect.height }, () => {
|
||||
this.setData({
|
||||
showAnimation: wx
|
||||
.createAnimation({ duration: SHOW_DURATION, timingFunction: 'ease' })
|
||||
.translateY(wrapRect.height + unitConvert(offset[0]))
|
||||
.step()
|
||||
.export(),
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
hide() {
|
||||
this.reset();
|
||||
this.setData({
|
||||
showAnimation: wx
|
||||
.createAnimation({ duration: SHOW_DURATION, timingFunction: 'ease' })
|
||||
.translateY(this.data.wrapTop)
|
||||
.step()
|
||||
.export(),
|
||||
});
|
||||
setTimeout(() => {
|
||||
this.setData({ visible: false, animation: [] });
|
||||
}, SHOW_DURATION);
|
||||
}
|
||||
reset() {
|
||||
if (this.nextAnimationContext) {
|
||||
this.clearMessageAnimation();
|
||||
}
|
||||
clearTimeout(this.closeTimeoutContext);
|
||||
this.closeTimeoutContext = 0;
|
||||
}
|
||||
handleClose() {
|
||||
this.hide();
|
||||
this.triggerEvent('closeBtnClick');
|
||||
}
|
||||
handleBtnClick() {
|
||||
this.triggerEvent('actionBtnClick', { self: this });
|
||||
}
|
||||
};
|
||||
Message = __decorate([
|
||||
wxComponent()
|
||||
], Message);
|
||||
export default Message;
|
||||
@ -1,7 +0,0 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"t-icon": "../icon/icon",
|
||||
"t-button": "../button/button"
|
||||
}
|
||||
}
|
||||
@ -1,56 +0,0 @@
|
||||
<wxs src="./message.wxs" module="this"></wxs>
|
||||
<import src="../common/template/icon.wxml" />
|
||||
|
||||
<block wx:if="{{visible}}">
|
||||
<view
|
||||
class="{{classPrefix}} {{prefix}}-class {{classPrefix}}--{{theme}}"
|
||||
style="{{this.getMessageStyles(zIndex, offset, wrapTop, customStyle)}}"
|
||||
animation="{{showAnimation}}"
|
||||
id="{{classPrefix}}"
|
||||
aria-role="alert"
|
||||
>
|
||||
<view wx:if="{{iconName || !this.isEmptyObj(iconData)}}" class="{{classPrefix}}__icon--left">
|
||||
<slot wx:if="{{iconName === 'slot'}}" name="icon" />
|
||||
<template
|
||||
wx:else
|
||||
is="icon"
|
||||
data="{{tClass: prefix + '-class-icon', ariaHidden: true, name: iconName, ...iconData}}"
|
||||
></template>
|
||||
</view>
|
||||
|
||||
<view
|
||||
class="{{classPrefix}}__text-wrap {{marquee ? '{{classPrefix}}__text-nowrap' : ''}}"
|
||||
style="text-align: {{align}}"
|
||||
id="{{classPrefix}}__text-wrap"
|
||||
>
|
||||
<view class="{{classPrefix}}__text {{prefix}}-class-content" id="{{classPrefix}}__text" animation="{{animation}}">
|
||||
<block wx:if="{{content}}">{{content}}</block>
|
||||
<slot name="content"></slot>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<t-button
|
||||
wx:if="{{action}}"
|
||||
t-class="{{classPrefix}}__btn--right {{prefix}}-class-action"
|
||||
theme="primary"
|
||||
variant="text"
|
||||
size="small"
|
||||
bind:tap="handleBtnClick"
|
||||
>{{action}}</t-button
|
||||
>
|
||||
<slot name="action" />
|
||||
|
||||
<view
|
||||
wx:if="{{ closeBtnName || !this.isEmptyObj(closeBtnData)}}"
|
||||
class="{{classPrefix}}__icon--right"
|
||||
bind:tap="handleClose"
|
||||
>
|
||||
<slot wx:if="{{closeBtnName === 'slot'}}" name="close-btn" />
|
||||
<template
|
||||
wx:else
|
||||
is="icon"
|
||||
data="{{tClass: prefix + '-class-close-btn', ariaRole: 'button', ariaLabel: '关闭', name: closeBtnName, ...closeBtnData}}"
|
||||
></template>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
@ -1,24 +0,0 @@
|
||||
var isEmptyObj = function (obj) {
|
||||
return JSON.stringify(obj) === '{}';
|
||||
};
|
||||
|
||||
var changeNumToStr = function (arr) {
|
||||
return arr.map(function (item) {
|
||||
return typeof item === 'number' ? item + 'rpx' : item;
|
||||
});
|
||||
};
|
||||
|
||||
var getMessageStyles = function (zIndex, offset, wrapTop, customStyle) {
|
||||
var arr = changeNumToStr(offset);
|
||||
var styleOffset = '';
|
||||
styleOffset += 'top:' + changeNumToStr([wrapTop * 2]) + ';';
|
||||
styleOffset += 'right:' + arr[1] + ';';
|
||||
styleOffset += 'left:' + arr[1] + ';';
|
||||
var zIndexStyle = zIndex ? 'z-index:' + zIndex + ';' : '';
|
||||
return zIndexStyle + styleOffset + customStyle;
|
||||
};
|
||||
|
||||
module.exports = {
|
||||
getMessageStyles: getMessageStyles,
|
||||
isEmptyObj: isEmptyObj,
|
||||
};
|
||||
@ -1,92 +0,0 @@
|
||||
.t-float-left {
|
||||
float: left;
|
||||
}
|
||||
.t-float-right {
|
||||
float: right;
|
||||
}
|
||||
@keyframes tdesign-fade-out {
|
||||
from {
|
||||
opacity: 1;
|
||||
}
|
||||
to {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
.hotspot-expanded.relative {
|
||||
position: relative;
|
||||
}
|
||||
.hotspot-expanded::after {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
transform: scale(1.5);
|
||||
}
|
||||
.t-message {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
z-index: 15000;
|
||||
padding: 24rpx 32rpx;
|
||||
box-sizing: border-box;
|
||||
border-radius: var(--td-message-border-radius, var(--td-radius-default, 12rpx));
|
||||
line-height: 1;
|
||||
background-color: var(--td-message-bg-color, var(--td-bg-color-container, var(--td-white-color-1, #fff)));
|
||||
box-shadow: var(--td-message-box-shadow, var(--td-shadow-4, 0 2px 8px 0 rgba(0, 0, 0, 0.06)));
|
||||
}
|
||||
.t-message__text {
|
||||
display: inline-block;
|
||||
color: var(--td-message-content-font-color, var(--td-font-gray-1, rgba(0, 0, 0, 0.9)));
|
||||
font-size: var(--td-font-size-base, 28rpx);
|
||||
line-height: 44rpx;
|
||||
}
|
||||
.t-message__text-wrap {
|
||||
flex: 1 1 auto;
|
||||
overflow-x: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.t-message__text-nowrap {
|
||||
word-break: keep-all;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.t-message--info {
|
||||
color: var(--td-message-info-color, var(--td-primary-color, #0052d9));
|
||||
}
|
||||
.t-message--success {
|
||||
color: var(--td-message-success-color, var(--td-success-color, var(--td-success-color-5, #00a870)));
|
||||
}
|
||||
.t-message--warning {
|
||||
color: var(--td-message-warning-color, var(--td-warning-color, var(--td-warning-color-5, #ed7b2f)));
|
||||
}
|
||||
.t-message--error {
|
||||
color: var(--td-message-error-color, var(--td-error-color, var(--td-error-color-6, #e34d59)));
|
||||
}
|
||||
.t-message__icon--left,
|
||||
.t-message__icon--right {
|
||||
font-size: 44rpx;
|
||||
}
|
||||
.t-message__icon--left {
|
||||
margin-right: var(--td-spacer, 16rpx);
|
||||
}
|
||||
.t-message__icon--right {
|
||||
color: var(--td-message-close-icon-color, var(--td-font-gray-3, rgba(0, 0, 0, 0.4)));
|
||||
}
|
||||
.t-message__icon--right,
|
||||
.t-message .t-message__btn--right {
|
||||
flex: 0 0 auto;
|
||||
margin-left: var(--td-spacer, 16rpx);
|
||||
}
|
||||
.t-message .t-message__btn--right {
|
||||
font-size: var(--td-font-size-base, 28rpx);
|
||||
line-height: 44rpx;
|
||||
height: 44rpx;
|
||||
border-radius: var(--td-message-border-radius, var(--td-radius-default, 12rpx));
|
||||
padding: 0;
|
||||
}
|
||||
@ -1,3 +0,0 @@
|
||||
import { TdMessageProps } from './type';
|
||||
declare const props: TdMessageProps;
|
||||
export default props;
|
||||
@ -1,55 +0,0 @@
|
||||
const props = {
|
||||
action: {
|
||||
type: String,
|
||||
},
|
||||
align: {
|
||||
type: String,
|
||||
value: 'left',
|
||||
},
|
||||
closeBtn: {
|
||||
type: null,
|
||||
value: false,
|
||||
},
|
||||
content: {
|
||||
type: String,
|
||||
},
|
||||
customStyle: {
|
||||
type: String,
|
||||
value: '',
|
||||
},
|
||||
duration: {
|
||||
type: Number,
|
||||
value: 3000,
|
||||
},
|
||||
externalClasses: {
|
||||
type: Array,
|
||||
},
|
||||
icon: {
|
||||
type: null,
|
||||
value: true,
|
||||
},
|
||||
marquee: {
|
||||
type: null,
|
||||
value: false,
|
||||
},
|
||||
offset: {
|
||||
type: Array,
|
||||
},
|
||||
theme: {
|
||||
type: String,
|
||||
value: 'info',
|
||||
},
|
||||
visible: {
|
||||
type: Boolean,
|
||||
value: false,
|
||||
},
|
||||
defaultVisible: {
|
||||
type: Boolean,
|
||||
value: false,
|
||||
},
|
||||
zIndex: {
|
||||
type: Number,
|
||||
value: 15000,
|
||||
},
|
||||
};
|
||||
export default props;
|
||||
@ -1,65 +0,0 @@
|
||||
export interface TdMessageProps {
|
||||
action?: {
|
||||
type: StringConstructor;
|
||||
value?: string;
|
||||
};
|
||||
align?: {
|
||||
type: StringConstructor;
|
||||
value?: MessageAlignType;
|
||||
};
|
||||
closeBtn?: {
|
||||
type: null;
|
||||
value?: string | boolean;
|
||||
};
|
||||
content?: {
|
||||
type: StringConstructor;
|
||||
value?: string;
|
||||
};
|
||||
customStyle?: {
|
||||
type: StringConstructor;
|
||||
value?: string;
|
||||
};
|
||||
duration?: {
|
||||
type: NumberConstructor;
|
||||
value?: number;
|
||||
};
|
||||
externalClasses?: {
|
||||
type: ArrayConstructor;
|
||||
value?: ['t-class', 't-class-content', 't-class-icon', 't-class-action', 't-class-close-btn'];
|
||||
};
|
||||
icon?: {
|
||||
type: null;
|
||||
value?: boolean | 'info' | 'bell';
|
||||
};
|
||||
marquee?: {
|
||||
type: null;
|
||||
value?: boolean | DrawMarquee;
|
||||
};
|
||||
offset?: {
|
||||
type: ArrayConstructor;
|
||||
value?: Array<string | number>;
|
||||
};
|
||||
theme?: {
|
||||
type: StringConstructor;
|
||||
value?: MessageThemeList;
|
||||
};
|
||||
visible?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
defaultVisible?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
zIndex?: {
|
||||
type: NumberConstructor;
|
||||
value?: number;
|
||||
};
|
||||
}
|
||||
export declare type MessageAlignType = 'left' | 'center';
|
||||
export interface DrawMarquee {
|
||||
speed?: number;
|
||||
loop?: number;
|
||||
delay?: number;
|
||||
}
|
||||
export declare type MessageThemeList = 'info' | 'success' | 'warning' | 'error';
|
||||
@ -1 +0,0 @@
|
||||
export {};
|
||||
@ -1,25 +0,0 @@
|
||||
import { SuperComponent, RelationsOptions } from '../common/src/index';
|
||||
export default class PickerItem extends SuperComponent {
|
||||
relations: RelationsOptions;
|
||||
properties: import("./type").TdPickerItemProps;
|
||||
observers: {
|
||||
options(this: PickerItem): void;
|
||||
};
|
||||
data: {
|
||||
classPrefix: string;
|
||||
offset: number;
|
||||
duration: number;
|
||||
value: string;
|
||||
curIndex: number;
|
||||
};
|
||||
methods: {
|
||||
onTouchStart(event: any): void;
|
||||
onTouchMove(event: any): void;
|
||||
onTouchEnd(): void;
|
||||
update(): void;
|
||||
resetOrigin(): void;
|
||||
getCount(): any;
|
||||
};
|
||||
calculateViewDeltaY(touchDeltaY: number): number;
|
||||
created(): void;
|
||||
}
|
||||
@ -1,114 +0,0 @@
|
||||
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
||||
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
||||
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
||||
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
||||
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
||||
};
|
||||
import { SuperComponent, wxComponent } from '../common/src/index';
|
||||
import config from '../common/config';
|
||||
import props from './props';
|
||||
const { prefix } = config;
|
||||
const name = `${prefix}-picker-item`;
|
||||
const itemHeight = 80;
|
||||
const DefaultDuration = 240;
|
||||
const { windowWidth } = wx.getSystemInfoSync();
|
||||
const rpx2px = (rpx) => Math.floor((windowWidth * rpx) / 750);
|
||||
const range = function (num, min, max) {
|
||||
return Math.min(Math.max(num, min), max);
|
||||
};
|
||||
let PickerItem = class PickerItem extends SuperComponent {
|
||||
constructor() {
|
||||
super(...arguments);
|
||||
this.relations = {
|
||||
'../picker/picker': {
|
||||
type: 'parent',
|
||||
},
|
||||
};
|
||||
this.properties = props;
|
||||
this.observers = {
|
||||
options() {
|
||||
this.update();
|
||||
},
|
||||
};
|
||||
this.data = {
|
||||
classPrefix: name,
|
||||
offset: 0,
|
||||
duration: 0,
|
||||
value: '',
|
||||
curIndex: 0,
|
||||
};
|
||||
this.methods = {
|
||||
onTouchStart(event) {
|
||||
this.StartY = event.touches[0].clientY;
|
||||
this.StartOffset = this.data.offset;
|
||||
this.setData({ duration: 0 });
|
||||
},
|
||||
onTouchMove(event) {
|
||||
const { StartY, StartOffset, itemHeight } = this;
|
||||
const touchDeltaY = event.touches[0].clientY - StartY;
|
||||
const deltaY = this.calculateViewDeltaY(touchDeltaY);
|
||||
this.setData({
|
||||
offset: range(StartOffset + deltaY, -(this.getCount() * itemHeight), 0),
|
||||
duration: DefaultDuration,
|
||||
});
|
||||
},
|
||||
onTouchEnd() {
|
||||
const { offset } = this.data;
|
||||
const { options } = this.properties;
|
||||
if (offset === this.StartOffset) {
|
||||
return;
|
||||
}
|
||||
const index = range(Math.round(-offset / this.itemHeight), 0, this.getCount() - 1);
|
||||
this.setData({
|
||||
curIndex: index,
|
||||
offset: -index * this.itemHeight,
|
||||
});
|
||||
if (index === this._selectedIndex) {
|
||||
return;
|
||||
}
|
||||
wx.nextTick(() => {
|
||||
var _a, _b, _c;
|
||||
this._selectedIndex = index;
|
||||
this._selectedValue = (_a = options[index]) === null || _a === void 0 ? void 0 : _a.value;
|
||||
this._selectedLabel = (_b = options[index]) === null || _b === void 0 ? void 0 : _b.label;
|
||||
(_c = this.$parent) === null || _c === void 0 ? void 0 : _c.triggerColumnChange({
|
||||
index,
|
||||
column: this.columnIndex || 0,
|
||||
});
|
||||
});
|
||||
},
|
||||
update() {
|
||||
var _a, _b;
|
||||
const { options, value } = this.data;
|
||||
const index = options.findIndex((item) => item.value === value);
|
||||
const selectedIndex = index > 0 ? index : 0;
|
||||
this.setData({
|
||||
offset: -selectedIndex * this.itemHeight,
|
||||
curIndex: selectedIndex,
|
||||
});
|
||||
this._selectedIndex = selectedIndex;
|
||||
this._selectedValue = (_a = options[selectedIndex]) === null || _a === void 0 ? void 0 : _a.value;
|
||||
this._selectedLabel = (_b = options[selectedIndex]) === null || _b === void 0 ? void 0 : _b.label;
|
||||
},
|
||||
resetOrigin() {
|
||||
this.update();
|
||||
},
|
||||
getCount() {
|
||||
var _a, _b;
|
||||
return (_b = (_a = this.data) === null || _a === void 0 ? void 0 : _a.options) === null || _b === void 0 ? void 0 : _b.length;
|
||||
},
|
||||
};
|
||||
}
|
||||
calculateViewDeltaY(touchDeltaY) {
|
||||
return Math.abs(touchDeltaY) > itemHeight ? 1.2 * touchDeltaY : touchDeltaY;
|
||||
}
|
||||
created() {
|
||||
this.StartY = 0;
|
||||
this.StartOffset = 0;
|
||||
this.itemHeight = rpx2px(itemHeight);
|
||||
}
|
||||
};
|
||||
PickerItem = __decorate([
|
||||
wxComponent()
|
||||
], PickerItem);
|
||||
export default PickerItem;
|
||||
@ -1,4 +0,0 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {}
|
||||
}
|
||||
@ -1,24 +0,0 @@
|
||||
<wxs src="../common/utils.wxs" module="_" />
|
||||
<view
|
||||
style="{{ customStyle }}"
|
||||
class="{{_.cls(classPrefix + '__group', [['narrow', siblingCount > 4], ['roomy', siblingCount <= 2]])}}"
|
||||
bind:touchstart="onTouchStart"
|
||||
catch:touchmove="onTouchMove"
|
||||
bind:touchend="onTouchEnd"
|
||||
bind:touchcancel="onTouchEnd"
|
||||
>
|
||||
<view
|
||||
class="{{classPrefix}}__wrapper"
|
||||
style="transition: transform {{ duration }}ms cubic-bezier(0.215, 0.61, 0.355, 1); transform: translate3d(0, {{ offset }}px, 0)"
|
||||
>
|
||||
<view
|
||||
class="{{_.cls(classPrefix + '__item', [['active', curIndex == index]])}}"
|
||||
wx:for="{{options}}"
|
||||
wx:key="index"
|
||||
wx:for-item="option"
|
||||
data-index="{{ index }}"
|
||||
>
|
||||
{{option.label}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -1,58 +0,0 @@
|
||||
.t-float-left {
|
||||
float: left;
|
||||
}
|
||||
.t-float-right {
|
||||
float: right;
|
||||
}
|
||||
@keyframes tdesign-fade-out {
|
||||
from {
|
||||
opacity: 1;
|
||||
}
|
||||
to {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
.hotspot-expanded.relative {
|
||||
position: relative;
|
||||
}
|
||||
.hotspot-expanded::after {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
transform: scale(1.5);
|
||||
}
|
||||
:host {
|
||||
display: flex;
|
||||
}
|
||||
.t-picker-item__group {
|
||||
height: var(--td-picker-group-height, 400rpx);
|
||||
overflow: hidden;
|
||||
flex: 1;
|
||||
z-index: 1;
|
||||
padding: 0 40rpx;
|
||||
}
|
||||
.t-picker-item__group--roomy {
|
||||
padding: 0 64rpx;
|
||||
}
|
||||
.t-picker-item__group--narrow {
|
||||
padding: 0 16rpx;
|
||||
}
|
||||
.t-picker-item__wrapper {
|
||||
padding: 144rpx 0;
|
||||
}
|
||||
.t-picker-item__item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: var(--td-picker-item-height, 80rpx);
|
||||
line-height: var(--td-picker-item-height, 80rpx);
|
||||
color: var(--td-picker-item-color, var(--td-font-gray-2, rgba(0, 0, 0, 0.6)));
|
||||
}
|
||||
.t-picker-item__item--active {
|
||||
color: var(--td-picker-item-active-color, var(--td-font-gray-1, rgba(0, 0, 0, 0.9)));
|
||||
font-weight: 600;
|
||||
}
|
||||
@ -1,3 +0,0 @@
|
||||
import { TdPickerItemProps } from './type';
|
||||
declare const props: TdPickerItemProps;
|
||||
export default props;
|
||||
@ -1,14 +0,0 @@
|
||||
const props = {
|
||||
customStyle: {
|
||||
type: String,
|
||||
value: '',
|
||||
},
|
||||
format: {
|
||||
type: null,
|
||||
},
|
||||
options: {
|
||||
type: Array,
|
||||
value: [],
|
||||
},
|
||||
};
|
||||
export default props;
|
||||
@ -1,18 +0,0 @@
|
||||
export interface TdPickerItemProps {
|
||||
customStyle?: {
|
||||
type: StringConstructor;
|
||||
value?: string;
|
||||
};
|
||||
format?: {
|
||||
type: undefined;
|
||||
value?: (option: PickerItemOption) => string;
|
||||
};
|
||||
options?: {
|
||||
type: ArrayConstructor;
|
||||
value?: PickerItemOption[];
|
||||
};
|
||||
}
|
||||
export interface PickerItemOption {
|
||||
label: string;
|
||||
value: string | number;
|
||||
}
|
||||
@ -1 +0,0 @@
|
||||
export {};
|
||||
@ -1,36 +0,0 @@
|
||||
:: BASE_DOC ::
|
||||
|
||||
## API
|
||||
### Picker Props
|
||||
|
||||
name | type | default | description | required
|
||||
-- | -- | -- | -- | --
|
||||
auto-close | Boolean | true | \- | N
|
||||
cancel-btn | String / Boolean / Object | true | Typescript：`boolean \| string \| ButtonProps` | N
|
||||
columns | Array / Function | [] | required。Typescript：`Array<PickerColumn> \| ((item: Array<PickerValue>) => Array<PickerColumn>)` `type PickerColumn = PickerColumnItem[]` `interface PickerColumnItem { label: string,value: string}`。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/picker/type.ts) | Y
|
||||
confirm-btn | String / Boolean / Object | true | Typescript：`boolean \| string \| ButtonProps`，[Button API Documents](./button?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/picker/type.ts) | N
|
||||
custom-style | String | - | `0.25.0` | N
|
||||
footer | Slot | - | \- | N
|
||||
header | Boolean / Slot | true | \- | N
|
||||
render-label | String / Function | - | Typescript：`(item: PickerColumnItem) => string` | N
|
||||
title | String | '' | \- | N
|
||||
value | Array | - | Typescript：`Array<PickerValue>` `type PickerValue = string \| number`。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/picker/type.ts) | N
|
||||
default-value | Array | undefined | uncontrolled property。Typescript：`Array<PickerValue>` `type PickerValue = string \| number`。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/picker/type.ts) | N
|
||||
visible | Boolean | false | \- | N
|
||||
|
||||
### Picker Events
|
||||
|
||||
name | params | description
|
||||
-- | -- | --
|
||||
cancel | - | \-
|
||||
change | `(value: Array<PickerValue>, label: string, columns: Array<{ column: number; index: number }> )` | \-
|
||||
confirm | `(value: Array<PickerValue>, label: string, columns: Array<{ column: number; index: number }> )` | \-
|
||||
pick | `(value: Array<PickerValue>, label: string, column: number, index: number)` | \-
|
||||
|
||||
### PickerItem Props
|
||||
|
||||
name | type | default | description | required
|
||||
-- | -- | -- | -- | --
|
||||
custom-style | String | - | `0.25.0` | N
|
||||
format | Function | - | Typescript：`(option: PickerItemOption) => string` | N
|
||||
options | Array | [] | Typescript：`PickerItemOption[]` `interface PickerItemOption { label: string; value: string \| number }`。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/picker-item/type.ts) | N
|
||||
@ -1,74 +0,0 @@
|
||||
---
|
||||
title: Picker 选择器
|
||||
description: 用于一组预设数据中的选择。
|
||||
spline: form
|
||||
isComponent: true
|
||||
---
|
||||
|
||||
<span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20lines-91%25-blue" /></span><span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20functions-90%25-blue" /></span><span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20statements-92%25-blue" /></span><span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20branches-89%25-blue" /></span>
|
||||
## 引入
|
||||
|
||||
全局引入，在 miniprogram 根目录下的`app.json`中配置，局部引入，在需要引入的页面或组件的`index.json`中配置。
|
||||
|
||||
```json
|
||||
"usingComponents": {
|
||||
"t-picker": "tdesign-miniprogram/picker/picker",
|
||||
"t-picker-item": "tdesign-miniprogram/picker-item/picker-item",
|
||||
}
|
||||
```
|
||||
|
||||
## 代码演示
|
||||
|
||||
### 组件类型
|
||||
#### 基础选择器
|
||||
|
||||
单项和多选选择
|
||||
|
||||
{{ base }}
|
||||
|
||||
#### 地区选择器
|
||||
|
||||
支持省市区切换，支持数据联动
|
||||
|
||||
{{ area }}
|
||||
|
||||
### 组件状态
|
||||
|
||||
是否带标题
|
||||
|
||||
{{ with-title }}
|
||||
|
||||
## API
|
||||
### Picker Props
|
||||
|
||||
名称 | 类型 | 默认值 | 说明 | 必传
|
||||
-- | -- | -- | -- | --
|
||||
auto-close | Boolean | true | 自动关闭；在确认、取消、点击遮罩层自动关闭，不需要手动设置 visible | N
|
||||
cancel-btn | String / Boolean / Object | true | 取消按钮文字。TS 类型：`boolean \| string \| ButtonProps` | N
|
||||
columns | Array / Function | [] | 必需。配置每一列的选项。TS 类型：`Array<PickerColumn> \| ((item: Array<PickerValue>) => Array<PickerColumn>)` `type PickerColumn = PickerColumnItem[]` `interface PickerColumnItem { label: string,value: string}`。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/picker/type.ts) | Y
|
||||
confirm-btn | String / Boolean / Object | true | 确定按钮文字。TS 类型：`boolean \| string \| ButtonProps`，[Button API Documents](./button?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/picker/type.ts) | N
|
||||
custom-style | String | - | `0.25.0`。自定义组件样式 | N
|
||||
footer | Slot | - | 底部内容 | N
|
||||
header | Boolean / Slot | true | 头部内容。值为 true 显示空白头部，值为 false 不显示任何内容，值类型为 TNode 表示自定义头部内容 | N
|
||||
render-label | String / Function | - | 自定义label。TS 类型：`(item: PickerColumnItem) => string` | N
|
||||
title | String | '' | 标题 | N
|
||||
value | Array | - | 选中值。TS 类型：`Array<PickerValue>` `type PickerValue = string \| number`。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/picker/type.ts) | N
|
||||
default-value | Array | undefined | 选中值。非受控属性。TS 类型：`Array<PickerValue>` `type PickerValue = string \| number`。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/picker/type.ts) | N
|
||||
visible | Boolean | false | 是否显示 | N
|
||||
|
||||
### Picker Events
|
||||
|
||||
名称 | 参数 | 描述
|
||||
-- | -- | --
|
||||
cancel | - | 点击取消按钮时触发
|
||||
change | `(value: Array<PickerValue>, label: string, columns: Array<{ column: number; index: number }> )` | 选中变化时候触发，即确认变化时触发
|
||||
confirm | `(value: Array<PickerValue>, label: string, columns: Array<{ column: number; index: number }> )` | 点击确认按钮时触发
|
||||
pick | `(value: Array<PickerValue>, label: string, column: number, index: number)` | 任何一列选中都会触发，不同的列参数不同。`column` 表示第几列变化，`index` 表示变化那一列的选中项下标
|
||||
|
||||
### PickerItem Props
|
||||
|
||||
名称 | 类型 | 默认值 | 说明 | 必传
|
||||
-- | -- | -- | -- | --
|
||||
custom-style | String | - | `0.25.0`。自定义组件样式 | N
|
||||
format | Function | - | 格式化标签。TS 类型：`(option: PickerItemOption) => string` | N
|
||||
options | Array | [] | 数据源。TS 类型：`PickerItemOption[]` `interface PickerItemOption { label: string; value: string \| number }`。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/picker-item/type.ts) | N
|
||||
@ -1,30 +0,0 @@
|
||||
import { SuperComponent, RelationsOptions } from '../common/src/index';
|
||||
export default class Picker extends SuperComponent {
|
||||
properties: import("./type").TdPickerProps;
|
||||
externalClasses: string[];
|
||||
options: {
|
||||
multipleSlots: boolean;
|
||||
};
|
||||
relations: RelationsOptions;
|
||||
observers: {
|
||||
value(): void;
|
||||
};
|
||||
data: {
|
||||
prefix: string;
|
||||
classPrefix: string;
|
||||
};
|
||||
methods: {
|
||||
updateChildren(): void;
|
||||
getSelectedValue(): any[];
|
||||
getColumnIndexes(): any;
|
||||
onConfirm(): void;
|
||||
triggerColumnChange({ column, index }: {
|
||||
column: any;
|
||||
index: any;
|
||||
}): void;
|
||||
onCancel(): void;
|
||||
onPopupChange(e: any): void;
|
||||
close(): void;
|
||||
};
|
||||
ready(): void;
|
||||
}
|
||||
@ -1,96 +0,0 @@
|
||||
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
||||
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
||||
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
||||
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
||||
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
||||
};
|
||||
import { SuperComponent, wxComponent } from '../common/src/index';
|
||||
import config from '../common/config';
|
||||
import props from './props';
|
||||
const { prefix } = config;
|
||||
const name = `${prefix}-picker`;
|
||||
let Picker = class Picker extends SuperComponent {
|
||||
constructor() {
|
||||
super(...arguments);
|
||||
this.properties = props;
|
||||
this.externalClasses = [`${prefix}-class`, `${prefix}-class-confirm`, `${prefix}-class-cancel`, `${prefix}-class-title`];
|
||||
this.options = {
|
||||
multipleSlots: true,
|
||||
};
|
||||
this.relations = {
|
||||
'../picker-item/picker-item': {
|
||||
type: 'child',
|
||||
linked() {
|
||||
this.updateChildren();
|
||||
},
|
||||
},
|
||||
};
|
||||
this.observers = {
|
||||
value() {
|
||||
this.updateChildren();
|
||||
},
|
||||
};
|
||||
this.data = {
|
||||
prefix,
|
||||
classPrefix: name,
|
||||
};
|
||||
this.methods = {
|
||||
updateChildren() {
|
||||
const { value } = this.properties;
|
||||
this.$children.forEach((child, index) => {
|
||||
child.setData({
|
||||
value: (value === null || value === void 0 ? void 0 : value[index]) || '',
|
||||
siblingCount: this.$children.length,
|
||||
});
|
||||
child.update();
|
||||
});
|
||||
},
|
||||
getSelectedValue() {
|
||||
const value = this.$children.map((item) => item._selectedValue);
|
||||
const label = this.$children.map((item) => item._selectedLabel);
|
||||
return [value, label];
|
||||
},
|
||||
getColumnIndexes() {
|
||||
const columns = this.$children.map((pickerColumn, columnIndex) => {
|
||||
return {
|
||||
column: columnIndex,
|
||||
index: pickerColumn._selectedIndex,
|
||||
};
|
||||
});
|
||||
return columns;
|
||||
},
|
||||
onConfirm() {
|
||||
const [value, label] = this.getSelectedValue();
|
||||
const columns = this.getColumnIndexes();
|
||||
this.close();
|
||||
this.triggerEvent('change', { value, label, columns });
|
||||
this.triggerEvent('confirm', { value, label, columns });
|
||||
},
|
||||
triggerColumnChange({ column, index }) {
|
||||
const [value, label] = this.getSelectedValue();
|
||||
this.triggerEvent('pick', { value, label, column, index });
|
||||
},
|
||||
onCancel() {
|
||||
this.close();
|
||||
this.triggerEvent('cancel');
|
||||
},
|
||||
onPopupChange(e) {
|
||||
const { visible } = e.detail;
|
||||
this.close();
|
||||
this.triggerEvent('visible-change', { visible });
|
||||
},
|
||||
close() {
|
||||
if (this.data.autoClose) {
|
||||
this.setData({ visible: false });
|
||||
}
|
||||
},
|
||||
};
|
||||
}
|
||||
ready() {
|
||||
this.$children.map((column, index) => (column.columnIndex = index));
|
||||
}
|
||||
};
|
||||
Picker = __decorate([
|
||||
wxComponent()
|
||||
], Picker);
|
||||
export default Picker;
|
||||
@ -1,6 +0,0 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"t-popup": "../popup/popup"
|
||||
}
|
||||
}
|
||||
@ -1,25 +0,0 @@
|
||||
<wxs src="../common/utils.wxs" module="_" />
|
||||
|
||||
<t-popup visible="{{visible}}" placement="bottom" bind:visible-change="onPopupChange">
|
||||
<view slot="content" style="{{ customStyle }}" class="{{classPrefix}} {{prefix}}-class">
|
||||
<view class="{{classPrefix}}__toolbar" wx:if="{{header}}">
|
||||
<view class="{{classPrefix}}__cancel {{prefix}}-class-cancel" wx:if="{{cancelBtn}}" bindtap="onCancel"
|
||||
>{{cancelBtn}}</view
|
||||
>
|
||||
<view class="{{classPrefix}}__title {{prefix}}-class-title">{{title}}</view>
|
||||
<view class="{{classPrefix}}__confirm {{prefix}}-class-confirm" wx:if="{{confirmBtn}}" bindtap="onConfirm"
|
||||
>{{confirmBtn}}</view
|
||||
>
|
||||
</view>
|
||||
<!-- 扩展插槽 -->
|
||||
<slot name="header" />
|
||||
<view class="{{_.cls(classPrefix + '__main', [])}}">
|
||||
<slot />
|
||||
<view class="{{classPrefix}}__mask {{classPrefix}}__mask--top" />
|
||||
<view class="{{classPrefix}}__mask {{classPrefix}}__mask--bottom" />
|
||||
<view class="{{classPrefix}}__indicator"></view>
|
||||
</view>
|
||||
<!-- 扩展插槽 -->
|
||||
<slot name="footer" />
|
||||
</view>
|
||||
</t-popup>
|
||||
@ -1,102 +0,0 @@
|
||||
.t-float-left {
|
||||
float: left;
|
||||
}
|
||||
.t-float-right {
|
||||
float: right;
|
||||
}
|
||||
@keyframes tdesign-fade-out {
|
||||
from {
|
||||
opacity: 1;
|
||||
}
|
||||
to {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
.hotspot-expanded.relative {
|
||||
position: relative;
|
||||
}
|
||||
.hotspot-expanded::after {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
transform: scale(1.5);
|
||||
}
|
||||
.t-picker {
|
||||
position: relative;
|
||||
background-color: var(--td-picker-bg-color, var(--td-bg-color-block, #fff));
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
border-top-left-radius: var(--td-picker-border-radius, 24rpx);
|
||||
border-top-right-radius: var(--td-picker-border-radius, 24rpx);
|
||||
}
|
||||
.t-picker__toolbar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
overflow: hidden;
|
||||
height: var(--td-picker-toolbar-height, 116rpx);
|
||||
}
|
||||
.t-picker__title {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
color: var(--td-picker-title-color, var(--td-font-gray-1, rgba(0, 0, 0, 0.9)));
|
||||
line-height: var(--td-picker-title-line-height, 52rpx);
|
||||
font-weight: var(--td-picker-title-font-weight, 600);
|
||||
font-size: var(--td-picker-title-font-size, 36rpx);
|
||||
}
|
||||
.t-picker__cancel,
|
||||
.t-picker__confirm {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
user-select: none;
|
||||
font-size: var(--td-picker-button-font-size, 32rpx);
|
||||
height: 100%;
|
||||
padding: 0 32rpx;
|
||||
}
|
||||
.t-picker__cancel {
|
||||
color: var(--td-picker-cancel-color, var(--td-font-gray-2, rgba(0, 0, 0, 0.6)));
|
||||
}
|
||||
.t-picker__confirm {
|
||||
color: var(--td-picker-confirm-color, var(--td-primary-color, #0052d9));
|
||||
}
|
||||
.t-picker__main {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.t-picker__mask {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 3;
|
||||
backface-visibility: hidden;
|
||||
pointer-events: none;
|
||||
height: 96rpx;
|
||||
}
|
||||
.t-picker__mask--top {
|
||||
top: 0;
|
||||
background: linear-gradient(180deg, #fff 0%, rgba(255, 255, 255, 0) 100%);
|
||||
}
|
||||
.t-picker__mask--bottom {
|
||||
bottom: 0;
|
||||
background: linear-gradient(180deg, #fff 0%, rgba(255, 255, 255, 0) 100%);
|
||||
transform: matrix(1, 0, 0, -1, 0, 0);
|
||||
}
|
||||
.t-picker__indicator {
|
||||
height: var(--td-picker-item-height, 80rpx);
|
||||
position: absolute;
|
||||
left: 32rpx;
|
||||
right: 32rpx;
|
||||
top: 144rpx;
|
||||
pointer-events: none;
|
||||
background-color: var(--td-picker-indicator-bg-color, var(--td-gray-color-1, #f3f3f3));
|
||||
border-radius: var(--td-picker-indicator-border-radius, 12rpx);
|
||||
}
|
||||
@ -1,3 +0,0 @@
|
||||
import { TdPickerProps } from './type';
|
||||
declare const props: TdPickerProps;
|
||||
export default props;
|
||||
@ -1,45 +0,0 @@
|
||||
const props = {
|
||||
autoClose: {
|
||||
type: Boolean,
|
||||
value: true,
|
||||
},
|
||||
cancelBtn: {
|
||||
type: null,
|
||||
value: true,
|
||||
},
|
||||
columns: {
|
||||
type: null,
|
||||
value: [],
|
||||
},
|
||||
confirmBtn: {
|
||||
type: null,
|
||||
value: true,
|
||||
},
|
||||
customStyle: {
|
||||
type: String,
|
||||
value: '',
|
||||
},
|
||||
header: {
|
||||
type: Boolean,
|
||||
value: true,
|
||||
},
|
||||
renderLabel: {
|
||||
type: null,
|
||||
},
|
||||
title: {
|
||||
type: String,
|
||||
value: '',
|
||||
},
|
||||
value: {
|
||||
type: Array,
|
||||
value: null,
|
||||
},
|
||||
defaultValue: {
|
||||
type: Array,
|
||||
},
|
||||
visible: {
|
||||
type: Boolean,
|
||||
value: false,
|
||||
},
|
||||
};
|
||||
export default props;
|
||||
@ -1,53 +0,0 @@
|
||||
import { ButtonProps } from '../button/index';
|
||||
export interface TdPickerProps {
|
||||
autoClose?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
cancelBtn?: {
|
||||
type: null;
|
||||
value?: boolean | string | ButtonProps;
|
||||
};
|
||||
columns: {
|
||||
type: ArrayConstructor;
|
||||
value?: Array<PickerColumn> | ((item: Array<PickerValue>) => Array<PickerColumn>);
|
||||
};
|
||||
confirmBtn?: {
|
||||
type: null;
|
||||
value?: boolean | string | ButtonProps;
|
||||
};
|
||||
customStyle?: {
|
||||
type: StringConstructor;
|
||||
value?: string;
|
||||
};
|
||||
header?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
renderLabel?: {
|
||||
type: StringConstructor;
|
||||
value?: (item: PickerColumnItem) => string;
|
||||
};
|
||||
title?: {
|
||||
type: StringConstructor;
|
||||
value?: string;
|
||||
};
|
||||
value?: {
|
||||
type: ArrayConstructor;
|
||||
value?: Array<PickerValue>;
|
||||
};
|
||||
defaultValue?: {
|
||||
type: ArrayConstructor;
|
||||
value?: Array<PickerValue>;
|
||||
};
|
||||
visible?: {
|
||||
type: BooleanConstructor;
|
||||
value?: boolean;
|
||||
};
|
||||
}
|
||||
export declare type PickerColumn = PickerColumnItem[];
|
||||
export interface PickerColumnItem {
|
||||
label: string;
|
||||
value: string;
|
||||
}
|
||||
export declare type PickerValue = string | number;
|
||||
@ -1 +0,0 @@
|
||||
export {};
|
||||
@ -1,60 +0,0 @@
|
||||
---
|
||||
title: radio-group
|
||||
description: 组合单选框。
|
||||
spline: form
|
||||
isComponent: true
|
||||
---
|
||||
|
||||
### 特性及兼容性
|
||||
|
||||
无
|
||||
|
||||
## 引入
|
||||
|
||||
### 引入组件
|
||||
|
||||
在 `app.json` 或 `page.json` 中引入组件：
|
||||
|
||||
```json
|
||||
"usingComponents": {
|
||||
"t-radio": "tdesign-miniprogram/radio/radio",
|
||||
"t-radio-group": "tdesign-miniprogram/radio-group/radio-group"
|
||||
}
|
||||
```
|
||||
|
||||
## 用法
|
||||
|
||||
### 组件方式
|
||||
|
||||
```html
|
||||
<!-- page.wxml -->
|
||||
<t-radio-group value="radio1" bind:change="onChange">
|
||||
<t-radio title="单行标题" name="radio1" />
|
||||
<t-radio title="单行标题" label="辅助信息" name="radio2" />
|
||||
</t-radio-group>
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
### `<t-radio-group>` 组件
|
||||
|
||||
组件路径：`tdesign-miniprogram/radio-group/radio-group`
|
||||
|
||||
#### Props
|
||||
|
||||
| 属性 | 值类型 | 默认值 | 必传 | 说明 |
|
||||
| -------- | --------- | ------ | ---- | ---------------------- |
|
||||
| value | `String` | - | N | 当前选中项的标识符 |
|
||||
| name | `String` | - | N | 在表单内提交时的标识符 |
|
||||
|
||||
### Slots
|
||||
|
||||
| 名称 | 说明 |
|
||||
| ---- | -------------- |
|
||||
| 默认 | `t-radio` 组件 |
|
||||
|
||||
#### Events
|
||||
|
||||
| 事件 | event.detail | 说明 |
|
||||
| ----------- | ------------------------- | ------------------------ |
|
||||
| bind:change | {name:当前选中项的标识符} | 当绑定值变化时触发的事件 |
|
||||
@ -1,3 +0,0 @@
|
||||
import { TdRadioGroupProps } from './type';
|
||||
declare const props: TdRadioGroupProps;
|
||||
export default props;
|
||||
@ -1,40 +0,0 @@
|
||||
const props = {
|
||||
align: {
|
||||
type: String,
|
||||
value: null,
|
||||
},
|
||||
borderless: {
|
||||
type: Boolean,
|
||||
value: false,
|
||||
},
|
||||
customStyle: {
|
||||
type: String,
|
||||
value: '',
|
||||
},
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
value: undefined,
|
||||
},
|
||||
icon: {
|
||||
type: null,
|
||||
value: 'fill-circle',
|
||||
},
|
||||
keys: {
|
||||
type: Object,
|
||||
},
|
||||
name: {
|
||||
type: String,
|
||||
value: '',
|
||||
},
|
||||
options: {
|
||||
type: Array,
|
||||
},
|
||||
value: {
|
||||
type: null,
|
||||
value: null,
|
||||
},
|
||||
defaultValue: {
|
||||
type: null,
|
||||
},
|
||||
};
|
||||
export default props;
|
||||
@ -1,25 +0,0 @@
|
||||
import { SuperComponent, RelationsOptions } from '../common/src/index';
|
||||
export default class RadioGroup extends SuperComponent {
|
||||
externalClasses: string[];
|
||||
data: {
|
||||
prefix: string;
|
||||
classPrefix: string;
|
||||
radioOptions: any[];
|
||||
};
|
||||
relations: RelationsOptions;
|
||||
properties: import("./type").TdRadioGroupProps<import("../radio/type").RadioValue>;
|
||||
controlledProps: {
|
||||
key: string;
|
||||
event: string;
|
||||
}[];
|
||||
observers: {
|
||||
value(v: any): void;
|
||||
options(): void;
|
||||
};
|
||||
methods: {
|
||||
getChilds(): any;
|
||||
updateValue(value: any): void;
|
||||
handleRadioChange(e: any): void;
|
||||
initWithOptions(): void;
|
||||
};
|
||||
}
|
||||
@ -1,105 +0,0 @@
|
||||
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
||||
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
||||
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
||||
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
||||
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
||||
};
|
||||
import config from '../common/config';
|
||||
import { SuperComponent, wxComponent } from '../common/src/index';
|
||||
import props from './props';
|
||||
const { prefix } = config;
|
||||
const name = `${prefix}-radio-group`;
|
||||
let RadioGroup = class RadioGroup extends SuperComponent {
|
||||
constructor() {
|
||||
super(...arguments);
|
||||
this.externalClasses = [`${prefix}-class`];
|
||||
this.data = {
|
||||
prefix,
|
||||
classPrefix: name,
|
||||
radioOptions: [],
|
||||
};
|
||||
this.relations = {
|
||||
'../radio/radio': {
|
||||
type: 'descendant',
|
||||
linked(target) {
|
||||
const { value, disabled } = this.data;
|
||||
target.setData({
|
||||
checked: value === target.data.value,
|
||||
});
|
||||
target.setDisabled(disabled);
|
||||
},
|
||||
},
|
||||
};
|
||||
this.properties = props;
|
||||
this.controlledProps = [
|
||||
{
|
||||
key: 'value',
|
||||
event: 'change',
|
||||
},
|
||||
];
|
||||
this.observers = {
|
||||
value(v) {
|
||||
this.getChilds().forEach((item) => {
|
||||
item.setData({
|
||||
checked: v === item.data.value,
|
||||
});
|
||||
});
|
||||
},
|
||||
options() {
|
||||
this.initWithOptions();
|
||||
},
|
||||
};
|
||||
this.methods = {
|
||||
getChilds() {
|
||||
let items = this.$children;
|
||||
if (!(items === null || items === void 0 ? void 0 : items.length)) {
|
||||
items = this.selectAllComponents(`.${prefix}-radio-option`);
|
||||
}
|
||||
return items;
|
||||
},
|
||||
updateValue(value) {
|
||||
this._trigger('change', { value });
|
||||
},
|
||||
handleRadioChange(e) {
|
||||
const { value, index } = e.target.dataset;
|
||||
this._trigger('change', { value, index });
|
||||
},
|
||||
initWithOptions() {
|
||||
const { options, value, keys } = this.data;
|
||||
if (!(options === null || options === void 0 ? void 0 : options.length) || !Array.isArray(options)) {
|
||||
this.setData({
|
||||
radioOptions: [],
|
||||
});
|
||||
return;
|
||||
}
|
||||
const optionsValue = [];
|
||||
try {
|
||||
options.forEach((element) => {
|
||||
var _a, _b, _c;
|
||||
const typeName = typeof element;
|
||||
if (typeName === 'number' || typeName === 'string') {
|
||||
optionsValue.push({
|
||||
label: `${element}`,
|
||||
value: element,
|
||||
checked: value === element,
|
||||
});
|
||||
}
|
||||
else if (typeName === 'object') {
|
||||
optionsValue.push(Object.assign(Object.assign({}, element), { label: element[(_a = keys === null || keys === void 0 ? void 0 : keys.label) !== null && _a !== void 0 ? _a : 'label'], value: element[(_b = keys === null || keys === void 0 ? void 0 : keys.value) !== null && _b !== void 0 ? _b : 'value'], checked: value === element[(_c = keys === null || keys === void 0 ? void 0 : keys.value) !== null && _c !== void 0 ? _c : 'value'] }));
|
||||
}
|
||||
});
|
||||
this.setData({
|
||||
radioOptions: optionsValue,
|
||||
});
|
||||
}
|
||||
catch (error) {
|
||||
console.error('error', error);
|
||||
}
|
||||
},
|
||||
};
|
||||
}
|
||||
};
|
||||
RadioGroup = __decorate([
|
||||
wxComponent()
|
||||
], RadioGroup);
|
||||
export default RadioGroup;
|
||||
@ -1,6 +0,0 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"t-radio": "../radio/radio"
|
||||
}
|
||||
}
|
||||
@ -1,18 +0,0 @@
|
||||
<view style="{{ customStyle }}" class="{{classPrefix}} {{prefix}}-class" aria-role="radiogroup">
|
||||
<slot />
|
||||
<block wx:for="{{radioOptions}}" wx:key="value">
|
||||
<t-radio
|
||||
class="{{prefix}}-radio-option"
|
||||
label="{{item.label}}"
|
||||
value="{{item.value}}"
|
||||
checked="{{item.checked}}"
|
||||
data-index="{{index}}"
|
||||
data-value="{{item.value}}"
|
||||
disabled="{{item.disabled}}"
|
||||
align="{{align}}"
|
||||
icon="{{icon}}"
|
||||
borderless="{{borderless}}"
|
||||
bind:change="handleRadioChange"
|
||||
/>
|
||||
</block>
|
||||
</view>
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
x
Reference in New Issue
Block a user