shuquAi/pages/chat2/chat.vue

<template>
	<!-- <view style="padding-bottom: 248rpx;"> -->
	<view style="">
		<!-- #ifdef H5 -->
		<view style="color: #000;">
			<tn-nav-bar backgroundColor="#fff">GPT</tn-nav-bar>
			<view :style="{ height: tobheight + 'px' }"></view>
		</view>
		<!-- #endif -->

		<view class="content" @touchmove="touchmove">
			<view class="msg-list">

				<!-- <view v-if="!paintingmode" class="row"> -->
				<view v-if="true" class="row">
					<block>
						<view class="other">
							<!-- <view class="left" v-if="appInfo.is_show_gpt_avatar_nickname == 1"
								@click="switchmodel = true"> -->
							<view class="left" v-if="true" @click="switchmodel = true">
								<u-image src="
										/static/images/head.jpg
									" mode="widthFix" radius="5" width="40" height="40"></u-image>
							</view>
							<view class="right">
								<view class="username">
									<view class="name"></view>
									<view class="time"> ai问答机器人</view>
								</view>
								<view class="bubble">
									<view class="content">
										<view style="font-size: 32rpx;">您可以点击下方案例直接提问......</view>
										<!-- <block v-for="(item, index) in homeTemplate.hot" :key="index">
											<view class="ask" @click="send(item.text)">{{ item.text }}</view>
										</block> -->

										<view @click="commontemplate" class="tn-flex align-center"
											style="justify-content: flex-end;margin-top: 15rpx;margin-bottom: 15rpx;">
											<view style="color: #9e9e9e;margin-right: 10rpx;">换一换</view>
											<u-icon name="reload" color="#9e9e9e" size="18"></u-icon>
										</view>
										<u-button size="small" @click="switchmodel = true" type="primary"
											text="切换模型"></u-button>
									</view>
								</view>
							</view>
						</view>
					</block>
				</view>
				<!-- <block v-for="(row, index) in paintingmode?paintinglist:talkList" :key="index" :id="'msg' + row.id">
					<view class="row">
						<block>
							<view class="my" v-if="row.fromid == userInfo.id">
								<view class="left">
									<view class="username">
										<view class="name">{{ row.nickname }}</view>
									</view>
									<u-icon v-if="row.content !='该问题已被隐藏!'" @click="copyText(index)" name="file-text"
										color="#9e9e9e82" size="22"></u-icon>
									<view v-if="row.type == 1" class="bubble" style="color: #fff;margin-left: 15rpx;">
										<rich-text :nodes="row.content" @longtap="copy" :data-text="row.content"
											selectable="true"></rich-text>
									</view>
								</view>
								<view class="right">
									<u-image :src="row.avatar ? row.avatar : '/static/images/head.jpg'" mode="widthFix"
										radius="5" width="42" height="42"></u-image>
								</view>
							</view>
							<view class="other" v-if="row.fromid != userInfo.id">
								<view class="left" v-if="appInfo.is_show_gpt_avatar_nickname == 1"
									@click="switchmodel = paintingmode?false:true">
									<u-image :src="row.avatar" mode="widthFix" radius="5" width="42"
										height="42"></u-image>
								</view>
								<view class="right">
									<view class="username" v-if="appInfo.is_show_gpt_avatar_nickname == 1">
										<view class="name"></view>
										<view class="time">{{ row.nickname }}</view>
									</view>

									<view v-if="row.type == 1" class="bubble"
										style="display: block;position: relative;">
										<view>
											<zero-markdown-view
												v-if="(row.done && row.content.indexOf('```') != -1) || (row.done && row.content.indexOf('/*') != -1 || row.content.indexOf('---') != -1)"
												:themeColor="themeColor" :markdown="row.content"></zero-markdown-view>
											<text v-else @longtap="copy"
												:data-text="row.content">{{ row.content.replace(/^\s+|\s+$/g, '') }}</text>
											<text v-if="row.content == '正在思考中...'">{{ second }}s</text>

											<text class="flash" v-if="row.show_flash">│</text>
										</view>
									</view>
									<view v-if="row.type == 2" class="bubble"
										style="display: block;position: relative;">
										<view class="u-flex align-center">
											<text style="margin-right: 20rpx;">{{row.content}}</text>
											<u-loading-icon size="17"></u-loading-icon>
										</view>
									</view>
									<view v-if="row.type == 3" class="bubbleimg">
										<image @click="preview(index)" :src="row.img" mode="aspectFill"></image>
									</view>
									<view v-if="row.done && !row.donec"
										class="tn-flex align-center justify-between operate">
										<view @click="copyText(index)" hover-class="hoversubmit"
											class="tn-flex align-center">
											<u-icon name="file-text" top="1" color="#68d7bb" size="20"></u-icon>
											<view class="duplicate">复制回答</view>
										</view>
										<view @click="createPoster(index)" hover-class="hoversubmit"
											class="tn-flex align-center">
											<u-icon name="share-square" top="1" color="#68d7bb" size="20"></u-icon>
											<view class="share">分享对话</view>
										</view>

										<view v-if="appInfo.is_vop&&appInfo.is_vop == 1" class="eliseaudio">
											<elise-audio @aittsjob="aittsjob" :audioId="'audioId'+index"
												:url="row.audiolink" audioColor="#68d7bb" :durationS="5"
												:content="row.content" :index="index" :cancel="cancel"></elise-audio>
										</view>

									</view>
								</view>
							</view>
						</block>
						
					</view>
				</block> -->
			</view>
			<view class="bottomheight"></view>
			<view class="env"></view>
		</view>

		<view class="box-2">
			<view class="flex_col">
				<view class="flex_grow">
					<u--textarea height="45" @blur="blurinput" @focus="focusinput" fixed :showConfirmBar="false"
						v-model="content" :placeholder="paintingmode?'请输入您想绘制的图片内容...':'请输入您的问题...'"
						:maxlength="paintingmode?500:-1" border="none" :cursorSpacing="80"></u--textarea>
				</view>
				<!-- <u-icon v-if="appInfo.is_vop&&appInfo.is_vop == 1" @click="openmicrophone" name="mic" color="#ff9800"
					size="30"></u-icon> -->
				<!-- 	<button class="send"
					@click.prevent="paintingmode?sendpainting(content):send(content)">{{paintingmode?'绘制':'发送'}}</button> -->
				<button class="send" @click.prevent="">发送</button>
			</view>
		</view>


		<!-- 	<u-popup :show="showexpand" zIndex="1" mode="bottom" bgColor="transparent" :overlay="false"
			@close="showexpand = false">
			<scroll-view class="scroll-view_H" scroll-x="true">
				<view class="expand u-flex">
					<block v-if="appInfo.number_member">
						<navigator @click="getroute"
							:url="isLogin ?'/pages/user/member/member?id=1':'/pages/user/signin'"
							class="surplus u-flex align-center" v-if="appInfo.number_member == 1">
							<u-icon name="question-circle-fill" color="#ff9800" size="18" top="1"></u-icon>
							<view class="item">
								{{appInfo.number_alias?appInfo.number_alias+':':'点数:'}}{{ userData.coin ? userData.coin : 0 }}
							</view>
						</navigator>
					</block>
					<block v-else>
						<navigator @click="getroute"
							:url="isLogin ?'/pages/user/member/member?id=1':'/pages/user/signin'"
							class="surplus u-flex align-center">
							<u-icon name="question-circle-fill" color="#ff9800" size="18" top="1"></u-icon>
							<view class="item">
								{{appInfo.number_alias?appInfo.number_alias+':':'点数:'}}{{ userData.coin ? userData.coin : 0 }}
							</view>
						</navigator>
					</block>
					<blcok v-if="!paintingmode">
						<navigator @click="getroute"
							:url="isLogin ?'/pages/user/member/member?id=2':'/pages/user/signin'"
							class="surplus u-flex align-center" v-if="appInfo.time_member && appInfo.time_member == 1">
							<u-icon name="clock-fill" color="#607d8b" size="18" top="1"></u-icon>
							<view class="item">
								会员时长:{{ userData.is_validity == 1 ? Math.round((userData.vip_time - Date.parse(new Date()) / 1000) / (3600 * 24)) : 0 }}天
							</view>
						</navigator>
					</blcok>
					<view v-if="appInfo.is_aipainting&&appInfo.is_aipainting == 1" @click="switcmode"
						class="surplus u-flex align-center">
						<u-icon :name="paintingmode?'chat-fill':'edit-pen-fill'" color="#f44336" size="18"
							top="1"></u-icon>
						<view class="item">{{paintingmode?'聊天模式':'Ai绘画'}}</view>
					</view>
					<navigator @click="getroute" :url="isLogin ?'/pages/user/member/member?id=3':'/pages/user/signin'"
						class="surplus u-flex align-center">
						<u-icon name="more-circle-fill" color="#2979ff" size="18" top="1"></u-icon>
						<view class="item">免费领{{appInfo.number_alias?appInfo.number_alias:'点数'}}</view>
					</navigator>
					<view class="surplus u-flex align-center" style="background: #fff0;padding: 1rpx;">

					</view>
				</view>
			</scroll-view>
		</u-popup> -->

		<!-- <wike-skeleton count="4" type="user" v-if="homeTemplate.length === 0"></wike-skeleton> -->


		<u-no-network></u-no-network>


		<!-- <navigator v-if="is_commission == 1" class="neckBtn_view" url="/pages/user/commission/index">
			<text class="free_view">分享</text>
			赚佣金
		</navigator> -->
		<!-- 	<u-popup :show="showPoster" mode="bottom" :round="10" safeAreaInsetTop @close="showPoster = false">
			<view class="poster">
				<wike-painter :board="posterObj" @success="posterSuccess" ref="painter"></wike-painter>
				<view class="footer-btn">
					<view class="" @click="showPoster = false">退出</view>
					<view class="save" @click="toSave">保存/分享</view>
				</view>
			</view>
		</u-popup> -->
		<!-- 		<u-popup :show="soundrecording" mode="bottom" :round="20" safeAreaInsetTop @close="soundrecording = false">

			<view class="soundrecording u-flex justify-center">
				<view v-if="showlongpress" class="waveform">
					<image :src="'https://s1.voicecloud.cn/activity/imeVoiceShare/img/yuyin.gif'" mode="aspectFill">
					</image>
				</view>
				<view class="operation u-flex">
					<view @touchstart="startrecording" @touchend="stoprecording" class="longpress"
						hover-class="hoversubmit">
						<u-icon name="mic" color="#fff" size="35"></u-icon>
					</view>
				</view>
				<view class="discriminate">长按识别语音</view>
			</view>
		</u-popup> -->


		<!-- <wike-loading-page :isLoading="isLoading"></wike-loading-page> -->
		<!-- 生成的图片 -->
		<u-popup type="center" mode="center">
			<view class="poster-img">
				<text @click="closePopup"></text>
				<!-- #ifdef H5 -->
				<view class="">长按图片保存到手机</view>
				<!-- #endif -->
				<!-- #ifndef H5 -->
				<view class="">点击图片保存到手机</view>
				<!-- #endif -->
			</view>
		</u-popup>
		<!-- 		<u-popup :show="switchmodel" @close="switchmodel = false" :round="15" closeable>
			<view class="select u-flex justify-center"><text>选择模型</text></view>

			<scroll-view scroll-y="true" :style="{ height: homeTemplate.mode.length > 6 ? 700 + 'rpx' : 'auto' }">
				<block v-for="(item, index) in homeTemplate.mode" :key="index">
					<view class="u-flex justify-between model_view">
						<u-avatar :src="item.img_file.path" shape="square" mode="aspectFill" size="60"></u-avatar>
						<view class="modelname">
							<view class="name">{{ item.name }}</view>
							<view class="modeldetails">{{ item.intro }}</view>
						</view>
						<view @click="onselect(index)" class="modelselect"
							:style="{ background: selectornot == index ? '#9e9e9e' : '' }">
							{{ selectornot == index ? '已选择' : '选择' }}
						</view>
					</view>
				</block>
				<view style="height: 30rpx;"></view>
			</scroll-view>
		</u-popup> -->

		<!-- <wike-tabbar :onTabbar="true" :isShowAnimate="true"></wike-tabbar> -->
	</view>
</template>

<script>
	// import { indexOf } from 'core-js/js/array';
	import {
		Socket
	} from 'dgram';
	import {
		mapMutations,
		mapActions,
		mapState,
		mapGetters
	} from 'vuex';
	import {
		apiurl
	} from '@/common/request/request';
	import MumuRecorder from '@/uni_modules/mumu-recorder/components/mumu-recorder/mumu-recorder.vue';
	import eliseAudio from '@/components/elise-audio/elise-audio.vue';
	// #ifdef H5
	import Recorder from 'recorder-core';
	import 'recorder-core/src/engine/wav'
	// #endif

	let down, delay;
	let interstitialAd = null,
		timer,
		time2,
		timingr;
	// const innerAudioContext = uni.createInnerAudioContext();
	const recorderManager = uni.getRecorderManager();
	export default {
		components: {
			MumuRecorder,
			eliseAudio,
			// #ifdef H5
			Recorder
			// #endif
		},
		data() {
			return {
				gpt_mode_index: 0,
				talkList: [

				],
				content: '',
				thecontent: '',
				image: '',
				hot: [],
				scrollTop: 999999,
				scrollAnimation: false,
				text1: ['您好，ChatGPT为您服务', '长按对话即可复制'],
				tobheight: 45,
				zhuangtai: 'AI智能问答机器人',
				platform: this.$platform.get(),
				// isFlash:false,
				showPoster: false,
				posterObj: {},
				switchmodel: false,
				selectornot: 0,
				modeldata: [],
				qrcode: '',
				haddressurl: '',
				haddresssk: '',
				scrollToView: '',
				question_index: 0,
				answer_index: 0,
				themeColor: '#007AFF',
				codeBgColor: '#26B3A0',
				showexpand: false,

				second: 15,
				showanswer: false,
				h5question: '',
				followornot: true,
				eights: false,
				spmplatform: 0,
				is_commission: 0,
				timing: 30,
				showcontext: true,
				showfetch: true,
				showdirect: true,
				//通道
				thoroughfare: 0,

				//绘画输入框
				drawcontent: '',
				//绘画模式
				paintingmode: false,
				//是否在绘画
				showdraw: false,
				//绘画id
				uuid: '',
				//绘画列表
				paintinglist: [],

				//弹出录音
				soundrecording: false,
				//是否长按
				showlongpress: false,
				//音频
				innerAudioContextsrc: '',
				//取消音频加载
				cancel: false,
				//第一次录
				firstrecording: 0,
				isLoading: true
			};
		},
		computed: {

		},
		mounted() {

		},
		onReady() {


		},

		onLoad() {

		},
		onShow: function() {

		},
		onUnload() {

		},
		onHide() {

		},
		onReachBottom() {},
		methods: {

		}
	};
</script>

<style lang="scss" scoped>
	@import '@/pages/chat/global.scss';
	@import './chat.scss';
</style>