heshanApp/pages_im/pages/conversation/chating1/components/ChatingFooter/ChatingActionBar.vue

<template>
	<view class="chat_action_bar">
		<u-row class="action_row">
			<u-col v-for="item in actionList" :key="item.idx" @click="actionClick(item)" span="3">
				<view class="action_item">
					<image :src="item.icon" alt="" srcset="" />
					<text class="action_item_title">{{ item.title }}</text>
				</view>
			</u-col>
		</u-row>
	</view>
</template>

<script>
import { mapGetters, mapActions } from 'vuex';
import { ChatingFooterActionTypes, ContactChooseTypes, PageEvents } from '../../../../../constant';
import { AmapWebKey } from '../../../../../common/config';
import IMSDK, { IMMethods } from 'openim-uniapp-polyfill';
import { getPurePath } from '../../../../../util/common';
import { callingModule } from '../../../../../util/imCommon';
import { premissionCheck } from "@/js_sdk/wa-permission/permission.js"
// import { gotoAppPermissionSetting,requestAndroidPermission } from "../../../../../util/permission";

export default {
	components: {},
	data() {
		return {
			userID: '',
			isUser: false,
			readFilePermission:false,
			actionList: [
				{
					idx: 0,
					type: ChatingFooterActionTypes.takePhoto,
					title: '拍照',
					icon: require('../../../../../static/images/new/take_pictures_icon.png')
				},
				{
					idx: 1,
					type: ChatingFooterActionTypes.Album,
					title: '相册',
					icon: require('../../../../../static/images/new/album_icon.png')
				},
				{
					idx: 2,
					type: ChatingFooterActionTypes.Camera,
					title: '视频',
					icon: require('../../../../../static/images/new/video_icon.png')
				},
				{
					idx: 3,
					type: ChatingFooterActionTypes.pickCamera,
					title: '录像',
					icon: require('../../../../../static/images/new/picture_recording_icon.png')
				}
				,{
				  idx: 4,
				  type: ChatingFooterActionTypes.Call,
				  title: "语音通话",
				  icon: require("../../../../../static/images/new/voice_call_icon.png"),
				},
				{
					idx: 5,
					type: ChatingFooterActionTypes.VideoCall,
					title: "视频通话",
					icon: require("../../../../../static/images/new/video_call_icon.png"),
				 }
				//{
				//         idx: 6,
				//         type: ChatingFooterActionTypes.File,
				//         title: "问诊订单",
				//         icon: require("../../../../../static/images/chating_action_file.png"),
				// },
				// {
				//   idx: 4,
				//   type: ChatingFooterActionTypes.Card,
				//   title: "名片",
				//   icon: require("../../../../../static/images/chating_action_card.png"),
				// },
				// {
				//   idx: 12,
				//   type: ChatingFooterActionTypes.Location,
				//   title: "位置",
				//   icon: require("../../../../../static/images/chating_action_location.png"),
				// }
			]
		};
	},
	computed: {
		...mapGetters(['timStore']),
		imType() {
			return this.timStore?.imType ?? '';
		},
		orderId() {
			return this.timStore?.orderId ?? '';
		},
		orderType() {
			return this.timStore?.orderType ?? '';
		}
	},
	mounted() {
		let userID = this.$store.getters.storeCurrentConversation.userID;
		this.userID = userID.substring(1);
		this.isUser = userID.indexOf('U') != -1;
		if (this.$companyUserIsLogin() && this.isUser) {
			// this.actionList.push({
			// 	idx: 4,
			// 	type: ChatingFooterActionTypes.Call,
			// 	title: '语音通话',
			// 	icon: require('../../../../../static/images/audio-calling.svg')
			// });
			// this.actionList.push({
			// 	idx: 5,
			// 	type: ChatingFooterActionTypes.VideoCall,
			// 	title: '视频通话',
			// 	icon: require('../../../../../static/images/chating_action_call.png')
			// });
			
			this.actionList.push({
				idx: 6,
				type: ChatingFooterActionTypes.Order,
				title: '问诊订单',
				icon: require('../../../../../static/images/new/consultation_order_icon.png')
			});
			this.actionList.push({
				idx: 8,
				type: ChatingFooterActionTypes.StoreOrder,
				title: '药品订单',
				icon: require('../../../../../static/images/new/drug_orders_icon.png')
			});
			this.actionList.push({
				idx: 9,
				type: ChatingFooterActionTypes.Package,
				title: '疗法',
				icon: require('../../../../../static/images/new/therapy_icon.png')
			});
			
			this.actionList.push({
				idx: 10,
				type: ChatingFooterActionTypes.CouponPackage,
				title: '私域疗法券',
				icon: require('../../../../../static/images/new/therapy_voucher_icon.png')
			});
			
			this.actionList.push({
				idx: 11,
				type: ChatingFooterActionTypes.InquirySelect,
				title: '会诊',
				icon: require('../../../../../static/images/new/consultation_doctors_icon.png')
			});
			
			this.actionList.push({
				idx: 12,
				type: ChatingFooterActionTypes.Course,
				title: '课程',
				icon: require('../../../../../static/images/new/course_icon.png')
			});
			
			return;
		}

		//if((this.imType==1&&this.orderType==2)||this.imType==2){  //语音通话
			// this.actionList.push({
			// 	idx: 4,
			// 	type: ChatingFooterActionTypes.Call,
			// 	title: '语音通话',
			// 	icon: require('../../../../../static/images/audio-calling.svg')
			// });
		//}
		//if((this.imType==1&&this.orderType==2)||this.imType==2){  //视频通话
			// this.actionList.push({
			// 	idx: 5,
			// 	type: ChatingFooterActionTypes.VideoCall,
			// 	title: '视频通话',
			// 	icon: require('../../../../../static/images/chating_action_call.png')
			// });
		//}
		
		if (this.imType == 1) {
			//问诊订单
			this.actionList.push({
				idx: 6,
				type: ChatingFooterActionTypes.Order,
				title: '问诊订单',
				icon: require('../../../../../static/images/chating_action_file.png')
			});
		}
		if (this.imType == 2) {
			//视频通话
			this.actionList.push({
				idx: 7,
				type: ChatingFooterActionTypes.Follow,
				title: '随访单',
				icon: require('../../../../../static/images/chating_action_file.png')
			});
			this.actionList.push({
				idx: 8,
				type: ChatingFooterActionTypes.StoreOrder,
				title: '药品订单',
				icon: require('../../../../../static/images/chating_action_file.png')
			});
		}
	},

	methods: {
		async actionClick(action) {
			switch (action.type) {
				case ChatingFooterActionTypes.takePhoto:
				    if (uni.$u.os() != 'ios') {
				    	this.requestPressmition();
				    	if(!this.readFilePermission){
				    		return;
				    	}
				    }
					this.$emit('prepareMediaMessage', { type: ChatingFooterActionTypes.Camera, index: 0 });
					break;
				case ChatingFooterActionTypes.Album:
				    if (uni.$u.os() != 'ios') {
				    	this.requestPressmition();
				    	if(!this.readFilePermission){
				    		return;
				    	}
				    }
					this.$emit('prepareMediaMessage', { type: ChatingFooterActionTypes.Album, index: 0 });
					break;
				case ChatingFooterActionTypes.Camera:
				    if (uni.$u.os() != 'ios') {
				    	this.requestPressmition();
				    	if(!this.readFilePermission){
				    		return;
				    	}
				    }
					this.$emit('prepareMediaMessage', { type: ChatingFooterActionTypes.Album, index: 1 });
					break;
				case ChatingFooterActionTypes.pickCamera:
					if (uni.$u.os() != 'ios') {
						this.requestPressmition();
						if(!this.readFilePermission){
							return;
						}
					}
					this.$emit('prepareMediaMessage', { type: ChatingFooterActionTypes.Camera, index: 1 });
					break;
				case ChatingFooterActionTypes.Call:
					if (!this.$store.getters.storeCurrentConversation.groupID) {
						uni.$emit(PageEvents.RtcCall, 'audio');
						return;
					}
					IMSDK.asyncApi('signalingGetRoomByGroupID', IMSDK.uuid(), this.$store.getters.storeCurrentConversation.groupID).then(({ data }) => {
						if (data.invitation) {
							uni.showModal({
								title: '提示',
								content: '群通话进行中，是否直接加入？',
								confirmText: '确认',
								cancelText: '取消',
								success: (res) => {
									if (res.confirm) {
										callingModule.joinRoomLiveChat(data);
									}
								}
							});
						} else {
							uni.$emit(PageEvents.RtcCall, 'audio');
						}
					});
					break;
				case ChatingFooterActionTypes.VideoCall:
					if (!this.$store.getters.storeCurrentConversation.groupID) {
						uni.$emit(PageEvents.RtcCall, 'video');
						return;
					}
					IMSDK.asyncApi('signalingGetRoomByGroupID', IMSDK.uuid(), this.$store.getters.storeCurrentConversation.groupID).then(({ data }) => {
						if (data.invitation) {
							uni.showModal({
								title: '提示',
								content: '群通话进行中，是否直接加入？',
								confirmText: '确认',
								cancelText: '取消',
								success: (res) => {
									if (res.confirm) {
										callingModule.joinRoomLiveChat(data);
									}
								}
							});
						} else {
							uni.$emit(PageEvents.RtcCall, 'video');
						}
					});
					break;

				case ChatingFooterActionTypes.Order:
					{
						if (this.$companyUserIsLogin()) {
							uni.navigateTo({
								url: '/pages/company/inquiryOrderIMList?userId=' + this.userID
							});
						} else {
							uni.navigateTo({
								url: '/pages/store/inquiryOrderDetails?orderId=' + this.timStore.orderId
							});
						}
					}
					break;
				case ChatingFooterActionTypes.Follow:
					uni.navigateTo({
						url: '/pages/user/followDetails?followId=' + this.timStore.followId
					});
					break;
				case ChatingFooterActionTypes.StoreOrder:
					{
						if (this.$companyUserIsLogin()) {
							uni.navigateTo({
								url: '/pages/company/storeOrderList?userId=' + this.userID
							});
						} else {
							uni.navigateTo({
								url: '/pages/store/storeOrderDetail?orderId=' + this.timStore.orderId
							});
						}
					}
					break;

				case ChatingFooterActionTypes.Package:  //疗法
					{
						if (this.$companyUserIsLogin()) {
							uni.navigateTo({
								url: '/pages/company/packageList?isIM=1'
							});
						}
					}
				break;
					
				case ChatingFooterActionTypes.CouponPackage:
					{
						if (this.$companyUserIsLogin()) {
							uni.navigateTo({
								url: '/pages/company/couponList?couponType=5&isIM=1'
							});
						}
					}
				break;
					
				case ChatingFooterActionTypes.InquirySelect:
					{
						if (this.$companyUserIsLogin()) {
							let companyId=uni.getStorageSync('companyId');
							let companyUserId=uni.getStorageSync('companyUserId');	
							uni.navigateTo({
								url: '/pages/store/inquirySelectType?companyId='+companyId+'&companyUserId='+companyUserId+'&isIM=1'
							});
						}
					}
				break;
				case ChatingFooterActionTypes.Course:
					if (this.$companyUserIsLogin()) {
						uni.navigateTo({
							url: '/pages_im/pages/conversation/course/courseList?userId=' + this.userID
						});
					}
				break;

				case ChatingFooterActionTypes.Card:
					uni.navigateTo({
						url: `/pages_im/pages/common/contactChoose/index?type=${ContactChooseTypes.Card}`
					});
					break;

				case ChatingFooterActionTypes.File:
					if (uni.$u.os() != 'ios') {
						this.requestPressmition();
						if(!this.readFilePermission){
							return;
						}
					}
					IMSDK.pickFile().then(async (path) => {
						console.log(path);
						const idx = path.lastIndexOf('/');
						const fileName = path.slice(idx + 1);
						const message = await IMSDK.asyncApi(IMMethods.CreateFileMessageFromFullPath, IMSDK.uuid(), {
							filePath: getPurePath(path),
							fileName
						});
						this.$emit('sendMessage', message);
					});
					break;
				case ChatingFooterActionTypes.Location:
					uni.chooseLocation({
						success: async (res) => {
							if (res) {
								const options = {
									name: res.name,
									latng: `${res.latitude},${res.longitude}`,
									addr: res.address,
									city: res.address,
									module: 'locationPicker',
									latitude: res.latitude,
									longitude: res.longitude,
									url: `https://restapi.amap.com/v3/staticmap?size=600*300&markers=-1,https://cache.amap.com/lbs/static/cuntom_marker1.png,0:${res.longitude},${res.latitude}&key=${AmapWebKey}`
								};
								const message = await IMSDK.asyncApi(IMMethods.CreateLocationMessage, IMSDK.uuid(), {
									description: JSON.stringify(options),
									longitude: res.longitude,
									latitude: res.latitude
								});
								this.$emit('sendMessage', message);
							} else {
								uni.$u.toast('获取位置失败');
							}
						},
						fail: ({ errMsg }) => {
							if (!errMsg.includes('cancel')) {
								uni.$u.toast('获取位置失败');
							}
						}
					});
					break;
				default:
					break;
			}
		},
	
	    async requestPressmition(){
	    	let result = await premissionCheck("EXTERNAL_STORAGE");
	    	console.log("premission result:"+result);
	    	if(result == 1) {
	    		this.readFilePermission=true;
	    	}
	    }
	
	}
};
</script>

<style lang="scss" scoped>
.chat_action_bar {
	position: relative;
	background: #f0f2f6;
	padding: 24rpx 36rpx;

	.action_row {
		flex-wrap: wrap;
		margin-bottom: 24rpx;
	}

	.action_item {
		@include centerBox();
		flex-direction: column;
		margin-top: 28rpx;
		image {
			width: 58rpx;
			height: 58rpx;
			background-color: #fff;
			border-radius: 28rpx;
			padding:28rpx;
		}

		&_title {
			font-size: 24rpx;
			color: #999;
			margin-top: 16rpx;
		}
	}
}
</style>