zheng_xie_ui/work/components/popup/popup.vue

<template>
	<view>
		<!-- 弹窗 -->
		<view class="bgbox" @click="getClose" v-if="type"></view>
		<!-- 弹窗 -->
		<!-- 推荐优秀 -->
		<view class="fixedbox" v-if="type=='tjyx'||type=='tjzd'">
			<view class="ttit">推荐为{{type=='tjyx'?'优秀':"重点"}}</view>
			<view  class="boxs">
				<view class="flexcj mb14">
					<view class="ttxt"><text class="cof0">*</text>推荐意见</view>
					<!-- <view class="flexcc speech" @click="getSeep">
						<image :src="speechimgs"></image>
						<view>语音输入</view>
					</view> -->
				</view>
				<textarea class="textar mb25" @blur="getBlur" v-model="content" placeholder="请输入推荐意见，也可点击右上角进行 语音输入…" maxlength="1000" ></textarea>
			</view>
			<view class="fixedbtn flexcj">
				<view class="btns btn1" @click="getClose">取消</view>
				<view class="btns btn2" @click="getupSubmit">提交</view>
			</view>
		</view>
		<!-- 质量评议 -->
		<view class="fixedbox" v-if="type=='zlpy'">
			<view class="ttit">办理质量评议</view>
			<view  class="boxs">
				<view class="mb20">
					<view class="ttxt mb18"><text class="cof0">*</text> 推荐意见</view>
					<uni-section title="本地数据" type="line">
					     <uni-data-select
					       v-model="value"
					       :localdata="range"
					       @change="change"
					     ></uni-data-select>
					</uni-section>
				</view>
				<view class="flexcj mb14">
					<view class="ttxt"><text class="cof0">*</text>推荐意见</view>
					<!-- <view class="flexcc speech" @click="getSeep">
						<image :src="speechimgs"></image>
						<view>语音输入</view>
					</view> -->
				</view>
				<textarea class="textar mb25" @blur="getBlur" v-model="yxly" placeholder="请对办理情况进行评价，也可点击右上 角进行语音输入…" maxlength="1000" ></textarea>
			</view>
			<view class="fixedbtn flexcj">
				<view class="btns btn1" @click="getClose">取消</view>
				<view class="btns btn2" @click="getyjSubmit">提交</view>
			</view>
		</view>
		<!-- 提案并案 -->
		<view class="fixedbox" v-if="type=='taba'">
			<view class="ttit">提案并案</view>
			<view  class="boxs">
				<view class="mb16">
					<view class="ttxt mb18"><text class="cof0">*</text>是否并案</view>
					<uni-section title="本地数据" type="line">
					     <uni-data-select
					       v-model="value"
					       :localdata="sfrange"
					       @change="change"
					     ></uni-data-select>
					</uni-section>
				</view>
				<view class="mb16">
					<view class="ttxt mb18"><text class="cof0">*</text>并案后标题</view>
					<input class="input"  placeholder="请输入并案后的标题"/>
				</view>
				<view class="mb16">
					<view class="ttxt mb18"><text class="cof0">*</text>并案后理由</view>
					<textarea class="textar " style="height: 186rpx;" @blur="getBlur" v-model="yxly" placeholder="请输入并案理由" maxlength="1000" ></textarea>
				</view>
				<view class="mb16">
					<view class="flexcj mb10">
						<view class="ttxt"><text class="cof0">*</text>添加附件</view>
						<view class="fjadd"><lsj-upload
							    ref="lsjUpload"
							    childId="upload1"
							    :width="width"
							    :height="height"
							    :option="option"
							    :size="size"
							    :formats="formats"
							    :debug="debug"
							    :instantly="instantly"
							    @progress=""
								@uploadEnd="onuploadEnd" >
							        <view class="btn" :style="{width: width,height: height}">上传附件</view>
							</lsj-upload>
						</view>
					</view>
					<view class="ptb2" v-if="filelist&&filelist.length">
						<view class="fjlists"  v-for="(ite,idx) in filelist" :key='idx'>
							<view class="flext f15 c6" @click="getDown(ite.url)">
								<view class="imgl"><image :src="fjimg" ></image></view>
								<view class="tit">{{ite.name}}</view>
							</view>
							<!-- 删除 -->
							<view class="delimg flex0" @click.stop="getDelFj(idx)">
								<image :src="delimg"></image>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="fixedbtn flexcj">
				<view class="btns btn1" @click="getClose">取消</view>
				<view class="btns btn2" @click="getyjSubmit">提交</view>
			</view>
		</view>
		<!-- 暂存发布的弹窗 -->
		<view class="fixedbox" v-if="type=='zcfb'">
			<view class="ttit">提示</view>
			<view  class="boxs">
				<view class="ztit">您有一条暂存通知还未发布</view>
				<view class="ztit">是否继续编辑？</view>
				<view class="ztit mb32">查看<text @click="getFaFn('old')">暂存通知</text></view>
			</view>
			<view class="fixedbtn flexcj">
				<view class="btns btn1" @click="getFaFn('new')">重新发布</view>
				<view class="btns btn2" @click="getFaFn('old')">继续发布</view>
			</view>
		</view>
		
		<!-- 联名提案弹窗 -->
		<view class="fixedbox" v-if="type=='lmta'">
			<view class="ttit">提示</view>
			<view  class="boxs">
				<view class="ztit">您有<text class="co0b">1</text>条联名提案邀请 请前往确认</view>
				<view class="ztit">请前往确认</view>
			</view>
			<view class="fixedbtn flexcj">
				<view class="btns btn1" @click="getFaFn('new')">稍后再说</view>
				<view class="btns btn2" @click="getFaFn('old')">立即确认</view>
			</view>
		</view>
		<!-- 暂存提案的弹窗 -->
		<view class="fixedbox" v-if="type=='zcta'||type=='zchy'">
			<view class="ttit">提示</view>
			<view  class="boxs">
				<view class="ztit">您有一条暂存信息还未提交</view>
				<view class="ztit">是否继续编辑？</view>
				<view class="ztit mb32">查看<text @click="getFaFn('old',type)">暂存提案</text></view>
			</view>
			<view class="fixedbtn flexcj">
				<view class="btns btn1" @click="getFaFn('new',type)">重新发布</view>
				<view class="btns btn2" @click="getFaFn('old',type)">继续发布</view>
			</view>
		</view>
		<!-- 2审查反馈 -->
		<view class="fixedbox" v-if="type=='scfk'">
			<view class="ttit">审查反馈</view>
			<view  class="boxs">
				<view class="mb16">
					<!-- @change="change" -->
					<view class="ttxt mb18"><text class="cof0">*</text>是否立案</view>
					<uni-data-select
					  v-model="isRecord"
					  placeholder="请选择立案/不予立案"
					  :localdata="larange"
					  
					></uni-data-select>
				</view>
				<!-- 提案号 -->
				<view class="mb16">
					<view class="ttxt mb18"><text class="cof0">*</text>提案号</view>
					<input class="input" v-model="txtnumber"  placeholder="请输入提案号"/>
				</view>
				<view class="mb16" >
					<view class="ttxt mb18"><text class="cof0">*</text>答复单位</view>
					<view @click="getRecorddwFn" class="chosebox flexc">
						<view class="tit" :class="recorddw?'':'coa'">{{recorddw||'若选择不予立案，请指定答复单位'}}</view>
					</view>
					
				</view>
			</view>
			<view class="fixedbtn flexcj">
				<view class="btns btn1" @click="getClose">取消</view>
				<view class="btns btn2" @click="getupSubmit">提交</view>
			</view>
		</view>
		<!-- 3提案交办 -->
		<view class="fixedbox" v-if="type=='tajb'">
			<view class="ttit">提案交办</view>
			<view  class="boxs">
				<view class="mb16" >
					<view class="ttxt mb18"><text class="cof0">*</text>主办单位</view>
					<view @click="getRecorddwFn" class="chosebox flexc">
						<view class="tit" :class="recorddw?'':'coa'">{{recorddw||'请选择主办单位'}}</view>
					</view>
				</view>
				<view class="mb16" >
					<view class="ttxt mb18"><text class="cof0">*</text>协办单位</view>
					<view @click="getRecorddwMoreFn" class="chosebox flexc">
						<view class="tit" :class="recorddwm?'':'coa'">{{recorddwm||'请选择协办单位'}}</view>
					</view>
				</view>
			</view>
			<view class="fixedbtn flexcj">
				<view class="btns btn1" @click="getClose">取消</view>
				<view class="btns btn2" @click="getupSubmit">提交</view>
			</view>
		</view>
		<!-- 4，办理方式 -->
		<view class="fixedbox" v-if="type=='dffk'">
			<view class="ttit">答复反馈</view>
			<view  class="boxs">
				<view class="mb16" >
					<view class="ttxt mb18"><text class="cof0">*</text>办理方式</view>
					<view @click="getBlfsMoreFn" class="chosebox flexc">
						<view class="tit" :class="handling?'':'coa'">{{handling||'请选择办理方式'}}</view>
					</view>
				</view>
				<view class="mb16">
					<!-- @change="change" -->
					<view class="ttxt mb18"><text class="cof0">*</text>办理程度</view>
					<uni-data-select
					  v-model="degree"
					  placeholder="请选择办理程度"
					  :localdata="blcdlist"
					></uni-data-select>
				</view>
				<view class="mb16">
					<!-- @change="change" -->
					<view class="ttxt mb18"><text class="cof0">*</text>答复内容</view>
					<textarea class="textar texthe mb25" @blur="getBlur" v-model="content" placeholder="请输入答复内容" maxlength="1000" ></textarea>
				</view>
				<view class="mb16">
					<view class="flexcj mb10">
						<view class="ttxt">添加附件</view>
						<view class="fjadd"><lsj-upload
							    ref="lsjUpload"
							    childId="upload1"
							    :width="width"
							    :height="height"
							    :option="option"
							    :size="size"
							    :formats="formats"
							    :debug="debug"
							    :instantly="instantly"
							    @progress=""
								@uploadEnd="onuploadEnd" >
							        <view class="btn" :style="{width: width,height: height}">上传附件</view>
							</lsj-upload>
						</view>
					</view>
					<view class="ptb2" v-if="filelist&&filelist.length">
						<view class="fjlists"  v-for="(ite,idx) in filelist" :key='idx'>
							<view class="flext f15 c6" @click="getDown(ite.url)">
								<view class="imgl"><image :src="fjimg" ></image></view>
								<view class="tit">{{ite.name}}</view>
							</view>
							<!-- 删除 -->
							<view class="delimg flex0" @click.stop="getDelFj(idx)">
								<image :src="delimg"></image>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="fixedbtn flexcj">
				<view class="btns btn1" @click="getClose">取消</view>
				<view class="btns btn2" @click="getupSubmit">提交</view>
			</view>
		</view>
		<!-- 5，交办审核 -->
		<view class="fixedbox" v-if="type=='jbsh'">
			<view class="ttit">审核</view>
			<view  class="boxs">
				<view class="mb16">
					<!-- @change="change" -->
					<view class="ttxt mb18"><text class="cof0">*</text>是否通过</view>
					<uni-data-select
					  v-model="jbshtxt"
					  placeholder="通过/不通过"
					  :localdata="jbsharange"
					  
					></uni-data-select>
				</view>
				<view class="mb16">
					<!-- @change="change" -->
					<view class="ttxt mb18"><text class="cof0">*</text>反馈理由</view>
					<textarea class="textar mb25" @blur="getBlur" v-model="content" placeholder="选择不通过必须填写反馈意见，限1000 字内…" maxlength="1000" ></textarea>
				</view>
			</view>
			<view class="fixedbtn flexcj">
				<view class="btns btn1" @click="getClose">取消</view>
				<view class="btns btn2" @click="getupSubmit">提交</view>
			</view>
		</view>
		<!-- 5提案办理 承办答复 -->
		<view class="fixedbox" v-if="type=='dwdf'">
			<view class="ttit">答复反馈</view>
			<view  class="boxs">
				<view class="mb16">
					<!-- @change="change" -->
					<view class="ttxt mb18"><text class="cof0">*</text>答复内容</view>
					<textarea class="textar mb25" @blur="getBlur" v-model="content" placeholder="请输入答复内容" maxlength="1000" ></textarea>
				</view>
				<view class="mb16" v-if="progress!=7">
					<view class="flexcj mb10">
						<view class="ttxt">添加附件</view>
						<view class="fjadd"><lsj-upload
							    ref="lsjUpload"
							    childId="upload1"
							    :width="width"
							    :height="height"
							    :option="option"
							    :size="size"
							    :formats="formats"
							    :debug="debug"
							    :instantly="instantly"
							    @progress=""
								@uploadEnd="onuploadEnd" >
							        <view class="btn" :style="{width: width,height: height}">上传附件</view>
							</lsj-upload>
						</view>
					</view>
					<view class="ptb2" v-if="filelist&&filelist.length">
						<view class="fjlists"  v-for="(ite,idx) in filelist" :key='idx'>
							<view class="flext f15 c6" @click="getDown(ite.url)">
								<view class="imgl"><image :src="fjimg" ></image></view>
								<view class="tit">{{ite.name}}</view>
							</view>
							<!-- 删除 -->
							<view class="delimg flex0" @click.stop="getDelFj(idx)">
								<image :src="delimg"></image>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="fixedbtn flexcj">
				<view class="btns btn1" @click="getClose">取消</view>
				<view class="btns btn2" @click="getupSubmit">提交</view>
			</view>
		</view>

		<!-- 6满意反馈 -->
		<view class="fixedbox" v-if="type=='wymyfk'||type=='zxmyfk'">
			<view class="ttit">答复反馈</view>
			<view  class="boxs">
				<!-- <view class="mb16">
					<view class="ttxt mb18"><text class="cof0">*</text>是否办结</view>
					<uni-data-select
					  v-model="isRecord"
					  placeholder="请选择办结/不予办结"
					  :localdata="larange"	  
					></uni-data-select>
				</view> -->
				<view class="mb16">
					<!-- @change="change" -->
					<view class="ttxt mb18"><text class="cof0">*</text>满意程度</view>
					<uni-data-select
					  v-model="mycdtxt"
					  placeholder="请选择满意程度"
					  :localdata="mycdlist"  
					></uni-data-select>
				</view>
				<view class="mb16">
					<view class="ttxt mb18"><text class="cof0">*</text>评价</view>
					<textarea class="textar mb25" @blur="getBlur" v-model="content" placeholder="请输入评价内容…" maxlength="1000" ></textarea>
				</view>
			</view>
			<view class="fixedbtn flexcj">
				<view class="btns btn1" @click="getClose">取消</view>
				<view class="btns btn2" @click="getupSubmit">提交</view>
			</view>
		</view>
		
		<!-- 催办 -->
		<view class="fixedbox" v-if="type=='tacb'">
			<view class="ttit">催办</view>
			<view  class="boxs">
				<view class="mb16">
					<view class="ttxt mb18"><text class="cof0">*</text>备注</view>
					<textarea class="textar mb25" @blur="getBlur" v-model="content" placeholder="请输入" maxlength="1000" ></textarea>
				</view>
			</view>
			<view class="fixedbtn flexcj">
				<view class="btns btn1" @click="getClose">取消</view>
				<view class="btns btn2" @click="getupSubmit">提交</view>
			</view>
		</view>
		<!-- 联名填 -->
		<view class="fixedbox" v-if="type=='lmta'">
			<view class="ttit">审核</view>
			<view  class="boxs">
				<view class="mb16">
					<!-- @change="change" -->
					<view class="ttxt mb18"><text class="cof0">*</text>是否同意</view>
					<uni-data-select
					  v-model="jbshtxt"
					  placeholder="同意/不同意"
					  :localdata="agreelist"  
					></uni-data-select>
				</view>
				<view class="mb16">
					<!-- @change="change" -->
					<view class="ttxt mb18"><text class="cof0">*</text>反馈理由</view>
					<textarea class="textar mb25" @blur="getBlur" v-model="content" placeholder="选择不通过必须填写反馈意见，限1000 字内…" maxlength="1000" ></textarea>
				</view>
			</view>
			<view class="fixedbtn flexcj">
				<view class="btns btn1" @click="getClose">取消</view>
				<view class="btns btn2" @click="getupSubmit">提交</view>
			</view>
		</view>
		<!-- 办理方式 -->
		<view class="bgbox" style="z-index: 15;" @click="ftype=''" v-if="ftype=='blfs'"></view>
		
		<view class="fixefbox" v-if="ftype=='blfs'">
			<view class="closebox" @click="ftype=''">
				<image :src="closeimg"></image>
			</view>
			
			<view class="tit">办理方式(可多选)</view>
			<view class="bllist">
				<view :class="cheklist.indexOf(ite.label)!=-1?'act':''" @click="getCheck(ite)" v-for="(ite,idx) in blfsList" :key='idx'>{{ite.label}}</view>
			</view>
		</view>
		<!-- 参会答复 -->
		<view class="fixedbox" v-if="type=='chdf'">
			<view class="ttit">参会答复</view>
			<view  class="boxs">
				<view class="mb16">
					<view class="ttxt mb18"><text class="cof0">*</text>是否参会</view>
					<uni-data-select
					  v-model="isJoin"
					  :localdata="joinlist"
					  @change="change"
					></uni-data-select>
					<view class="ptips">* 若选择否，请务必填写请假事由并提交</view>
				</view>
				<view class="mb16">
					<!-- @change="change" -->
					<view class="ttxt mb18"><text class="cof0"></text>请假类型</view>
					<uni-data-select
					  v-model="qjlxtxt"
					  placeholder="请选择请假类型"
					  :localdata="qjlxlist"  
					></uni-data-select>
				</view>
				<view class="mb16">
					<view class="ttxt mb18"><text class="cof0"></text>请假事由</view>
					<textarea class="textar " style="height: 186rpx;" @blur="getBlur" v-model="content" placeholder="请输入请假事由" maxlength="1000" ></textarea>
				</view>
			</view>
			<view class="fixedbtn flexcj">
				<view class="btns btn1" @click="getClose">取消</view>
				<view class="btns btn2" @click="getupSubmit">提交</view>
			</view>
		</view>
		<!-- 会议签到二维码 -->
		<view class="fixedbox" v-if="type=='qdm'">
			<view class="ttit" style="margin-bottom: 80rpx;">会议签到二维码</view>
			<image :src="baseUrl+codeQr" class="codeimg"></image>
			<view class="fixedbtn flexcj">
				<view class="btns btn1" @click="getClose">取消</view>
				<view class="btns btn2" @click="getcodeDown">
					<image :src="downimg" class="down"></image>
					保存至手机</view>
			</view>
		</view>
		<selectnore-more-picker
			ref="dfdwpicker"
			:title="dfdwpicker.title"
			:layer="dfdwpicker.layer"
			:titflag='dfdwpicker.titflag'
			:data="deptTree"
			@callback="dfdwpickerCallback"
		></selectnore-more-picker>
		<!-- 协办单位 -->
		<batree-pickerfixed deptType='3' ref="treePickerxtdw" :multiple='true' @select-change="selectChangextdw" title="选择协办单位"
		:localdata="deptTree" valueKey="id" textKey="label" childrenKey="children"></batree-pickerfixed>
		<!-- 语音识别 -->
		<view class="bgbox bgvoice"  v-if="voiceflag"  @click="getClosevoice"></view>
		<view class="voice" v-if="voiceflag">
			<!-- <image :src="closeimg" class="choseimg" @click="getClosevoice"></image> -->
			<view v-if="isShow">
				<view v-if="sendLock" class="tip">
					<view class="txt">试试这样说</view>
					<view class="txt-bt">科技项目</view>
				</view>
				<view v-else>
					<!-- @click="resultClick" -->
					
					<view class="res-txt" >
						<!-- 实时翻译 -->
						<text :style="{
							color: (resultText == '正在识别中2<strong>.</strong>..' || resultText == '未检测到语音，请重试') ? 
							'#919098' : 
							'#2979ff'}">
							{{resultText}}
						</text>
						<!-- <image v-if="resultText != '正在识别中.1..' && resultText != '未检测到语音，请重试'"
							src="/static/img/xiaoshou.png" mode="widthFix"></image> -->
					</view>
				</view>
			</view>
		 
			<view v-else class="tip">
				<view v-if="!sendLock" class="tipbox">{{voicetext}}</view>
				<view v-html="text" class="txt" style="color: #8e8d9a;"></view>
				
				<view v-if="!sendLock" class="prompt-loader">
					<view class="em" :style="randomRgb()" v-for="(item,index) in 30" :key="index"></view>
				</view>
				<view v-else class="prompt-loader"></view>
			</view>
		 
			<view class="btn" @longpress="handleRecordStart" @touchmove="handleTouchMove" @touchend="handleRecordStop">
				<view class="btn-cont">
					长按开始语音搜索
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import selectnoreMorePicker from "@/components/ba-tree-picker/selectnoreMorePicker.vue"
	import batreePickerfixed from "@/components/ba-tree-picker/ba-tree-pickerfixed.vue"
	import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
	const recorderManager = uni.getRecorderManager();
	//播放录音
	const innerAudioContext = uni.createInnerAudioContext();
	innerAudioContext.autoplay = true;
	import config from '@/config'
	const baseUrl = config.baseUrl
	import { getToken } from '@/utils/auth'
	export default{
		components:{selectnoreMorePicker,batreePickerfixed},
		props:{
			type: {
				type: String,
				default () {
					return ''
				}
			},
			status:{
				type: String,
				default () {
					return 'add'
				}
			},
			codeQr:{
				type: String,
				default () {
					return ''
				}
			},
			iteminfo:{},
			xmjzinfo:{},
			dataTree:{
				type: Array,
				default () {
					return []
				}
			},
			blfsList:{
				type: Array,
				default () {
					return []
				}
			},
			blcdlist:{
				type: Array,
				default () {
					return []
				}
			},
			mycdlist:{
				type: Array,
				default () {
					return []
				}
			},
			qjlxlist:{
				type: Array,
				default () {
					return []
				}
			},
			progress:{
				type: [String,Number],
				default () {
					return ''
				}
			}
		},
		data(){
			return{
				deptTree:[],//答复单位
				dfdwpicker: {
					title: '选择所属产业',
					layer: null,
					titflag:true,
					data: []
				},
				//附件
				option: {
				    // 上传服务器地址，需要替换为你的接口地址
				    url: baseUrl+'/common/upload', // 该地址非真实路径，需替换为你项目自己的接口地址
				    // 上传附件的key
				    name: 'file',
				    // 根据你接口需求自定义请求头,默认不要写content-type,让浏览器自适配
				    header: {
				        // 示例参数可删除
				        'Authorization':  'Bearer ' + getToken(),
				    },
				    // 根据你接口需求自定义body参数
				    formData: {}
				},
				// 选择文件后是否立即自动上传，true=选择后立即上传
				instantly: true,
				// 必传宽高且宽高应与slot宽高保持一致
				width: '',
				height: '48rpx',
				// 限制允许上传的格式，空串=不限制，默认为空
				formats: 'doc,docx,xls,xlsx,ppt,txt,pdf,zip,rar,word,png,jpg,jpeg',
				// 文件上传大小限制
				size: 100,
				// 文件数量限制 默认10
				count: 5,
				// 文件回显列表
				files: new Map(),
				// 微信小程序Map对象for循环不显示，所以转成普通数组，不要问为什么，我也不知道
				wxFiles: [],
				// 是否打印日志
				debug: false,
				filelist:[], 
				fjimg:require("@/work/static/images/fjimg.png"),
				delimg:require("@/work/static/images/delimg.png"),
				codeimg:require("@/work/static/images/meeting/code.png"),
				downimg:require("@/work/static/images/meeting/down.png"),
				closeimg:require("@/work/static/images/close.png"),
				
				speechimgs:require('@/work/static/images/voice.png'),
				range: [{ value: 0, text: "满意" },{ value: 1, text: "不满意" },],
				sfrange: [{ value: 0, text: "是" },{ value: 1, text: "否" },],
				larange:[{ value: 0, text: "立案" },{ value: 1, text: "不立案" }],
				jbsharange:[{ value: 6, text: "不通过" },{ value: 7, text: "通过" }],
				agreelist:[{ value: 1, text: "同意" },{ value: 2, text: "不同意" }],
				joinlist:[{ value: 'Y', text: "是" },{ value: 'N', text: "否" }],
				value: 0,
				isRecord:'',//是否立案
				jbshtxt:'',//审核通过不通过
				handling:'',//办理方式
				degree:'',//办理程度
				mycdtxt:'',//满意程度
				isJoin:'',//是否参会
				qjlxtxt:'',//请假类型
				recorddw:'',
				recorddwm:'',//协办单位
				recorddwlist:[],
				recorddwmlist:[],//协办单位
				content:'',//文本输入
				txtnumber:'',//提案号
				ftype:'',//二层弹窗
				blfsval:'',//办理方式
				cheklist:[],
				baseUrl:'',
				
				voiceflag:false,
				voiceToken: '',
				timer: null,
				text: '',
				resultText: '正在识别中...',
				startPoint: {},
				sendLock: true,
				isShow: true,
				
				voicetext:'',
				options: {}, // 语音转文字的设置
				partialResult:'',//临时语音
			}
		},
		watch:{
			// iteminfo(val){
			// 	var that=this;
			// 	that.psnr='';
			// 	// console.log(val,0)
			// 	if(val.zcpsnr){
			// 		that.psnr=val.zcpsnr;
			// 	}else if(val.psnr){
			// 		that.psnr=val.psnr;
			// 	}
			// },
			sendLock(newVal, oldVal) {
				var that=this;
				recorderManager.onStop(res => {
					if (newVal) return //上锁不发送
					//解锁发送网络请求
					setTimeout(function(res){
						if(!that.voicetext&&!that.partialResult){
							that.resultText='未检测到语音，请重试'
						}else{
							that.resultText=that.voicetext||that.partialResult;
							var cursor=that.cursor;
							if(cursor==0){
								if(that.seeptype=='sgll'){
									that.sgll=that.sgll+that.resultText;
								}else{
									that.psnr=that.psnr+that.resultText;
								}
								
							}else{
								if(that.seeptype=='sgll'){
									that.sgll=that.sgll.slice(0,cursor)+that.resultText+that.sgll.slice(cursor);
								}else{
									that.psnr=that.psnr.slice(0,cursor)+that.resultText+that.psnr.slice(cursor);
								}
								
							}
							
							
							that.voiceflag=false;
						}
						that.sendLock=true;
						
					},1000)
					// console.log(res.tempFilePath, '获取录音文件')
				});
			},
		},
		onShow() {
			
		},
		mounted() {
			this.baseUrl=baseUrl;
			// var that=this;
			// 		// #ifdef APP-PLUS
			// 		// 监听语音识别事件
			// 		plus.speech.addEventListener('recognizing', this.onRecognizing, false);
			// 		// #endif	
							  
			// 		recorderManager.onStop(function(res) {
			// 			//录音后的回调函数
			// 			if(!this.sendLock){
			// 				console.log(that.voicetext,that.partialResult)
			// 			}
			// 			console.log('recorder stop' + JSON.stringify(res));
			// 		});  
							  
		},
		methods:{
			checkPermi, checkRole,
			getRecorddwFn(){
				console.log(this.dataTree)
				this.deptTree=this.dataTree
				this.$refs.dfdwpicker.open(0).then(function() {
				
				});
			},
			getRecorddwMoreFn(){
				this.$refs.treePickerxtdw._show();
			},
			getBlfsMoreFn(){
				this.ftype='blfs'
			},
			getCheck(ite){
				var idx=this.cheklist.findIndex(item=>item==ite.label)
				if(idx!=-1){
					this.cheklist.splice(idx,1)
				}else{
					this.cheklist.push(ite.label)
				}
				this.handling=this.cheklist.join(',')
				
			},
			change(){
				
			},
			getcodeDown(){
				// #ifdef H5
				// 将base64格式的图片转换成Blob对象
				  var arr = this.yycode.split(","),
				    mime = arr[0].match(/:(.*?);/)[1],
				    bstr = atob(arr[1]),
				    n = bstr.length,
				    u8arr = new Uint8Array(n);
				  while (n--) {
				    u8arr[n] = bstr.charCodeAt(n);
				  }
				  // 将Blob对象转换成文件并下载到本地
				  var blob = new Blob([u8arr], {
				    type: mime
				  });
				  var a = document.createElement('a');
				  a.download = 'qrcode';
				  a.href = URL.createObjectURL(blob);
				  a.click();
				// #endif
				// #ifndef H5
				uni.getSetting({//获取用户的当前设置
				    success:(res)=> {
				        if(res.authSetting['scope.writePhotosAlbum']){//验证用户是否授权可以访问相册
				            this.saveImageToPhotosAlbum();
				        }else{
				            uni.authorize({//如果没有授权，向用户发起请求
				                scope: 'scope.writePhotosAlbum',
				                success:()=> {
				                    this.saveImageToPhotosAlbum();
				                },
				                fail:()=>{
				                    uni.showToast({
				                        title:"请打开保存相册权限，再点击保存相册分享",
				                        icon:"none",
				                        duration:3000
				                    });
				                    setTimeout(()=>{
				                        uni.openSetting({//调起客户端小程序设置界面,让用户开启访问相册
				                            success:(res2)=> {
				                                // console.log(res2.authSetting)
				                            }
				                        });
				                    },3000);
				                }
				            })
				        }
				    }
				})
				// #endif
				
			},
			saveImageToPhotosAlbum(){
			    let base64=this.yycode.replace(/^data:image\/\w+;base64,/, "");//去掉data:image/png;base64,
			    let filePath=wx.env.USER_DATA_PATH + '/qrcode.png';
			    uni.getFileSystemManager().writeFile({
			        filePath:filePath ,  //创建一个临时文件名
			        data: base64,    //写入的文本或二进制数据
			        encoding: 'base64',  //写入当前文件的字符编码
			        success: res => {
			            uni.saveImageToPhotosAlbum({
			                filePath: filePath,
			                success: function(res2) {
			                    uni.showToast({
			                        title: '保存成功，请从相册选择再分享',
			                        icon:"none",
			                        duration:5000
			                    })
			                },
			                fail: function(err) {
			                    // console.log(err.errMsg);
			                }
			            })
			        },
			        fail: err => {
			            //console.log(err)
			        }
			    })
			},
			selectChangextdw(e){
				if(e.length){
					var newArr=[]
					e.forEach(ite=>{
						newArr.push(ite.deptName)
					})
					this.recorddwm=newArr.join('/')
				}
				this.recorddwmlist=JSON.parse(JSON.stringify(e))
			},
			dfdwpickerCallback(e){
				var newArr=e.data;
				var dwList=[]
				var len=Number(newArr.length)-1;
				var obj={
					deptId:newArr[len].id,
					deptName:newArr[len].label,
				}
				if(this.type=='tajb'){
					obj.type=2
				}else if(this.type=='scfk'){
					obj.type=1
				}
				// dwList.push(obj)
				this.recorddwlist=obj;
				this.recorddw=newArr[len].label;
			},
			getupSubmit(){
				var type=this.type;
				if(type=='scfk'){
					var isRecord=this.isRecord;
					if(isRecord===''){
						this.$toast('请选择会否立案')
						return
					}	
					var obj={
						isRecord:this.isRecord
					}
					if(this.isRecord==0&&!this.txtnumber){
						this.$toast('请输入提案号')
						return
					}
					if(this.isRecord==1&&!this.recorddw){
						this.$toast('请选择答复单位')
						return
					}
					if(this.isRecord==0){
						obj.proposalNumber=this.txtnumber
						obj.sqmyNumber=this.txtnumber
					}
					if(this.isRecord==1){
						var nobj=this.recorddwlist;
						var newArr=[];
						newArr.push(nobj)
						obj.proposalUnitReplyList=newArr
						obj.sqmyUnitReplyList=newArr
					}
					this.$emit('getupSubmit',obj)
				}else if(type=='tajb'){
					var newArr=this.recorddwlist;
					var xbdwList=this.recorddwmlist;
					if(!newArr||newArr.length<1){
						this.$toast('请选择主办单位')
						return
					}
					if(xbdwList.length<1){
						this.$toast('请选择协办单位')
						return
					}
					var obj={
						proposalUnitReplyList:xbdwList,
						sqmyUnitReplyList:xbdwList,
						zbUnitReply:newArr
					}
					this.$emit('getupSubmit',obj)
				}else if(type=='dffk'){
					if(!this.handling){
						this.$toast('请选择办理方式')
						return
					}
					if(!this.degree){
						this.$toast('请选择办理程度')
						return
					}
					if(!this.content){
						this.$toast('请输入答复内容')
						return
					}
					var obj={
						content:this.content,
						handling:this.handling,
						degree:this.degree
					}
					if(this.filelist.length){
						obj.zxFjList=this.filelist
					}
					this.$emit('getupSubmit',obj)
				
				}else if(type=='jbsh'){
					if(!this.jbshtxt){
						this.$toast('请选择是否通过')
						return
					}
					var obj={
						proposalProgress:this.jbshtxt,
						sqmyProgress:this.jbshtxt,
					}
					this.$emit('getupSubmit',obj)
				}else if(type=='dwdf'){
					if(!this.content){
						this.$toast('请输入答复反馈')
						return
					}
					var obj={
						content:this.content,
					}
					if(this.filelist.length){
						obj.zxFjList=this.filelist
					}
					this.$emit('getupSubmit',obj)
				}else if(type=='wymyfk'){
					if(!this.mycdtxt){
						this.$toast('请选择满意程度')
						return
					}
					var obj={
						membersOpinion:this.content,
						satisfaction:this.mycdtxt
					}
					if(this.filelist.length){
						obj.zxFjList=this.filelist
					}
					this.$emit('getupSubmit',obj)
				}else if(type=='zxmyfk'){
					if(!this.mycdtxt){
						this.$toast('请选择满意程度')
						return
					}
					var obj={
						zxOpinion:this.content,
						zxSatisfaction:this.mycdtxt
					}
					if(this.filelist.length){
						obj.zxFjList=this.filelist
					}
					this.$emit('getupSubmit',obj)
				}else if(type=='tacb'){
					// if(!this.content){
					// 	this.$toast('请输入催办内容')
					// 	return
					// }
					var obj={
						urgeContent:this.content,
						// urgeType:1
					}
					this.$emit('getupSubmit',obj)
				}else if(type=='tjyx'){
					// if(!this.content){
					// 	this.$toast('请输入催办内容')
					// 	return
					// }
					var obj={
						outstandingArgument:this.content,
						isOutstanding:0
					}
					this.$emit('getupSubmit',obj)
				}else if(type=='tjzd'){
					// if(!this.content){
					// 	this.$toast('请输入催办内容')
					// 	return
					// }
					var obj={
						keyPointArgument:this.content,
						isKeyPoint:0
					}
					this.$emit('getupSubmit',obj)
				}else if(type=='lmta'){
					if(!this.jbshtxt){
						this.$toast('请选择是否同意')
						return
					}
					var obj={
						isAgree:this.jbshtxt,
					}
					this.$emit('getupSubmit',obj)
				}else if(type=='chdf'){
					if(!this.isJoin){
						this.$toast('请选择是否参会')
						return
					}
					if(this.isJoin=='N'&&this.qjlxtxt==''){
						this.$toast('请选择请假类型')
						return
					}
					if(this.isJoin=='N'&&!this.content){
						this.$toast('请输入请假事由')
						return
					}
					var obj={
						isJoin:this.isJoin,
						leaveType:this.qjlxtxt,
						leaveReason:this.content,
					}
					this.$emit('getupSubmit',obj)
				}
				
				
			},
			
			
			
			onuploadEnd(item) {
				var newobj={}
				var responseText=JSON.parse(item.responseText)
				newobj.name=responseText.originalFilename;
				newobj.url=responseText.fileName;
				this.filelist.push(newobj)
				// this.datainfo.zsyzFjList=JSON.parse(JSON.stringify(this.filelist))
			},
			getDelFj(idx){
				var that=this;
				uni.showModal({
					title: '确认删除',
					content: "是否确认删除",
					cancelText: '取消',
					confirmText: '确认',
					success: function(res) {
						if (res.confirm) {
							that.filelist.splice(idx,1)
							// that.datainfo.zsyzFjList=JSON.parse(JSON.stringify(that.filelist))
						} else if (res.cancel) {
						}
					}
				});
			},
			getDown(e){
					  uni.showLoading({
					  	title: '加载中'
					  });
				var url=baseUrl+e;
				uni.downloadFile({
					url: url,//文件的下载路径
					success(result) {
							uni.hideLoading()
						var filePath = result.tempFilePath;
						   uni.openDocument({
						     filePath: filePath,
						     showMenu: true,
						     success: function (res) {
						       // console.log('打开文档成功');
						     }
						   });
					},
					fail(res) {uni.hideLoading()}
				})
			},
			
			
			getBlur(e){
				this.cursor=e.detail.cursor;
			},
			// 语音转文字
			getClosevoice(){
				this.voiceflag=false
			},
			onRecognizing(e){
				this.partialResult=e.partialResult;
			},
			// 录音转文字
			handleVoice() {
				// console.log('语音输入')
				let _this = this;
				// _this.psnr = '';
				this.options.engine = 'baidu'
				// this.options.timeout = 60 * 1000; //超时时间
				this.options.continue = true;//语音识别是否采用持续模式
				this.options.punctuation = true; // 是否需要标点符号 
				this.options.userInterface = false; // 是否显示语音界面
				plus.speech.startRecognize(this.options, (s) => {
					_this.voicetext+=s;
					console.log(s,9)
					// plus.speech.stopRecognize(); // 关
				});
			},
			//长按录音方法
			handleRecordStart(e) {
				this.voicetext='';
				this.partialResult='';
				this.startPoint = e.touches[0]; //记录长按时开始点信息，后面用于计算上划取消时手指滑动的距离。
				recorderManager.start({duration: 60000}); //开始录音
				this.handleVoice()
				this.text = `<text style="color:#333">上划取消搜索</text>`;
				this.sendLock = false; //长按时不上锁。
				this.isShow = false;
				this.resultText = '正在识别中...';
				// 按钮
				// console.log(67)
			},
			//结束录音 (手指松开)时触发
			handleRecordStop(e) {
				var that=this;
				this.isShow = true;
				setTimeout(function(){
					plus.speech.stopRecognize();
					recorderManager.stop(); //结束录音
				},1300)
				
			},
			//上划取消搜索
			handleTouchMove(e) {
				let moveLenght = e.touches[e.touches.length - 1].clientY - this.startPoint.clientY;
				if (Math.abs(moveLenght) > 50) {
					this.text = `松开手指，<text style="color:#333">取消搜索</text>`;
					this.sendLock = true; //触发了上滑取消搜索，上锁
					this.isShow = false;
				} else {
					this.text = `<text style="color:#333">上划取消搜索</text>`;
					this.sendLock = false; //上划距离不足，可以搜索，不上锁
					this.isShow = false;
				}
			},
			//获取录音结果子传父
			resultClick() {
				if (this.resultText == '正在识别中...' || this.resultText == '未检测到语音，请重试') return;
				
				this.$emit('voiceResult', this.resultText)
			},
			//弹窗关闭之后的操作，点击遮罩层或关闭按钮
			// afterHide() {
			// 	this.sendLock = true;
			// 	this.$emit('closePopup');
			// 	clearInterval(this.timer);
			// 	this.resultText = '正在识别中...';
			// },
			randomRgb() {
				let R = Math.floor(Math.random() * 130 + 110);
				let G = Math.floor(Math.random() * 130 + 110);
				let B = Math.floor(Math.random() * 130 + 110);
				return {
					background: `rgb(${R},${G},${B}, 1)`
				};
			},
			// 语音转文字
			getSeep(e){
				this.seeptype=e||'';
				this.voicetext='';
				this.partialResult='';
				this.voiceflag=true;		
			},
			ontStart() {
				// recorderManager.start();
						console.log('startRecognize');
			
					},
			onEnd() {
				// recorderManager.stop();
						console.log('endRecognize');
			
					},
			getFaFn(type,ptype){
				this.$emit('getFaFn',type,ptype)
			},
			getClose(){
				this.$emit("getClose")
			},
			// 意见
			getyjSubmit(){
				var data={};
				var that=this;
				var str=""
				if(!this.shenflag){
					data.shjg='3';
					str='不通过'
					if(!this.psnr){
						this.$toast('请输入反馈意见')
						return
					}else{
						data.shyj=this.psnr
					}
				}else{
					str='通过'
					data.shjg='2',
					data.shyj=this.psnr
				}
				// 确认框
				uni.showModal({
					title: '确认审核',
					content: "是否确认"+str+'审核',
					cancelText: '取消',
					confirmText: '确认',
					success: function(res) {
						if (res.confirm) {
							that.$emit("getyjSubmit",data)
						} else if (res.cancel) {
							// console.log('用户点击取消');
						}
					}
				});
				
			},
		}
	}
</script>

<style lang="scss" scoped>
// 弹窗
// .choseimg{width: 34rpx;height: 34rpx;position: absolute;left: 36rpx;top: 54rpx;z-index: 22;}
 // .uni-stat__select{background-color: #EEEEEE;}
.fixedbox /deep/ .uni-select{border: none;background-color: #EEEEEE;height: 88rpx;}
.fixedbox /deep/ .uni-select__input-placeholder{font-size: 30rpx;color: #AAAAAA;}
.fixedbox /deep/ .uni-textarea-placeholder{font-size: 30rpx;color: #AAAAAA;}
.fixedbox{position: fixed;left: 48rpx;right: 48rpx;background: #fff;border-radius: 10rpx;min-height: 468rpx;top: 50%;transform: translateY(-50%);z-index: 10;padding: 32rpx 40rpx 50rpx;max-height: calc(100vh - 300rpx);overflow: auto;box-sizing: border-box;
	.ttit{position: relative;text-align: center;font-weight: bold;font-size: 36rpx;color: #222327;margin-bottom: 34rpx;}
	.boxs{
		.ttxt{font-weight: bold;font-size: 30rpx;color: #222327;
			text{margin-right: 6rpx;}
		}
		.ztit{font-weight: 500;font-size: 26rpx;color: #222327;text-align: center;line-height: 56rpx;text-align: center;
			text{color: #1D64E2;text-decoration: underline;margin: 0 6rpx;}
		}
		.chosebox{width: 100%;height: 88rpx;background: #EEEEEE;border-radius: 10rpx;padding: 0 10rpx;box-sizing: border-box;padding-left: 20rpx;
			.tit{color: #333;font-size: 30rpx;
				&.coa{color: #AAAAAA;}
			}
		}
		.ptips{font-weight: 500;font-size: 13px;color: #FF0000;text-align: right;margin-top: 16rpx;}
		// 语音按钮
		.speech{
			width: 190rpx;height:56rpx;background: linear-gradient(180deg, #4480EB 0%, #1D64E2 100%);border-radius: 28rpx;
			image{width: 20rpx;height: 26rpx;margin-right: 12rpx;}
			view{font-size: 26rpx;font-weight: 500;color: #ffffff;}
		}
		.input{height: 88rpx;width: 100%;background: #EEEEEE;border-radius: 10rpx;font-size: 30rpx;font-weight: 500;color: #222327;padding: 0 24rpx;}
		.textar{width: 100%;border-radius: 10rpx;padding: 26rpx 30rpx;font-size: 30rpx;color: #222327;height: 400rpx;background: #EEEEEE;
			&.texthe{height: 190rpx;}
		}
	}
	.codeimg{width: 384rpx;height: 384rpx;margin: 0 auto 88rpx;}
	.fixedbtn{padding-top: 18rpx;
		.btns{width: 254rpx;height: 80rpx;border-radius: 40rpx;font-weight: bold;
font-size: 30rpx;display: flex;align-items: center;justify-content: center;box-sizing: border-box;
			&.btn1{color: #1D64E2;border: 2rpx solid #1D64E2;}
			&.btn2{color: #ffffff;background: #1D64E2;}
			.down{width: 26rpx;height: 26rpx;margin-right: 6rpx;flex: 0 0 auto;}
		}
		
	}
}
.fixefbox{background-color: #fff;padding: 36rpx 0;position: fixed;left:0;right: 0;bottom: 0;z-index: 20;
	.tit{font-weight: bold;font-size: 30rpx;color: #222327;padding: 0 80rpx;text-align: center;
		text{font-size: 26rpx;color: #AAAAAA;}
	}
	.closebox{width: 40rpx;height: 40rpx;display: flex;align-items: center;justify-content: center;	
		position: absolute;left:28rpx;top: 36rpx;
		image{width: 24rpx;height: 22rpx;}
	}
	.bllist{padding: 0 12rpx;display: flex;flex-wrap: wrap;
		view{min-width: 194rpx;height: 70rpx;background: #F5F5F5;border-radius: 36rpx;margin: 30rpx 24rpx 0;line-height: 70rpx;text-align: center;padding: 0 24rpx;box-sizing: border-box;
			&.act{background: #DFEBFF;color: #1D64E2;}
		}
	}
}
// 附件
.fjadd{
	.btn{font-weight: bold;font-size: 30rpx;color: #1D64E2;margin: 0;display: flex;align-items: center;}
}
// 附件
.fjlists {display: flex;align-items: flex-start;justify-content: space-between;margin-bottom: 12rpx;
		image{margin-right: 18rpx;flex: 0 0 auto;}
		.imgl{width: 40rpx;height: 40rpx;display: flex;align-items: center;justify-content: center;margin-right: 16rpx;
			image{width: 26rpx;height: 24rpx;}
			}
			.tit{font-size: 26rpx;color: #343434;font-weight: 500;margin-top: 4rpx;}
		.delimg{width: 40rpx;height:40rpx;margin-left: 16rpx;display: flex;align-items: center;justify-content: center;
			image{width: 26rpx;height: 26rpx;}
		}
	}

// 语音识别
.bgvoice{z-index: 1900;}
.voice {
		min-height: 500rpx;
		padding: 100rpx 60rpx 0 60rpx;
		position: relative;
		background-color: #fff;
		position: fixed;
		left:0;right:0;bottom:0;z-index: 2000;
		padding-bottom: 180rpx;
		.res-txt {
			text-align: center;
			margin-top: 40rpx;
			font-size: 36rpx;
			color: #919098;
 
			image {
				display: block;
				margin: auto;
				margin-top: 10rpx;
				width: 60rpx;
				animation: bounce-down 2.6s linear infinite;
			}
		}
 
		.tip {
			margin-top: 15rpx;
			text-align: center;
 
			.txt {
				font-size: 36rpx;
				color: #151823;
			}
 
			.txt-bt {
				margin-top: 20rpx;
				color: #919098;
			}
		}
 
		.btn {
			width: 50%;
			height: 80rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			color: #fff;
			border-radius: 50rpx;
			background: #3484fd;
			position: absolute;
			bottom: 80rpx;
			left: 50%;
			transform: translateX(-50%);
 
			.btn-cont {
				display: flex;
				align-items: center;
			}
		}
	}
 
	@-webkit-keyframes bounce-down {
		25% {
			-webkit-transform: translateY(-10px);
		}
 
		50%,
		100% {
			-webkit-transform: translateY(0);
		}
 
		75% {
			-webkit-transform: translateY(13px);
		}
	}
	.content{background-color: #f5f5f5;position: fixed;left: 0;right: 0;bottom: 0;z-index: 10000;height: 500rpx;}
	/* 语音动画 */
	.prompt-loader {
		width: 100%;
		height: 35px;
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin: 30rpx auto;
	}
 
	.prompt-loader .em {
		height: 15%;
		width: 2px;
		float: left;
		display: block;
		background: #333333;
	}
 
	.prompt-loader .em:last-child {
		margin-right: 0px;
	}
 
	.prompt-loader .em:nth-child(1) {
		animation: load 1.3s 0.4s infinite linear;
	}
 
	.prompt-loader .em:nth-child(2) {
		animation: load 1.3s 0.2s infinite linear;
	}
 
	.prompt-loader .em:nth-child(3) {
		animation: load 1.3s 0.6s infinite linear;
	}
 
	.prompt-loader .em:nth-child(4) {
		animation: load 1.3s 0.8s infinite linear;
	}
 
	.prompt-loader .em:nth-child(5) {
		animation: load 1.3s 0.6s infinite linear;
	}
 
	.prompt-loader .em:nth-child(6) {
		animation: load 1.3s 0.4s infinite linear;
	}
 
	.prompt-loader .em:nth-child(7) {
		animation: load 1.3s 0.2s infinite linear;
	}
 
	.prompt-loader .em:nth-child(8) {
		animation: load 1.3s 0.6s infinite linear;
	}
 
	.prompt-loader .em:nth-child(9) {
		animation: load 1.3s 0.2s infinite linear;
	}
 
	.prompt-loader .em:nth-child(10) {
		animation: load 1.3s 0.4s infinite linear;
	}
 
	.prompt-loader .em:nth-child(11) {
		animation: load 1.3s 0.6s infinite linear;
	}
 
	.prompt-loader .em:nth-child(12) {
		animation: load 1.3s 0.8s infinite linear;
	}
 
	.prompt-loader .em:nth-child(13) {
		animation: load 1.3s 1s infinite linear;
	}
 
	.prompt-loader .em:nth-child(14) {
		animation: load 1.3s 0.2s infinite linear;
	}
 
	.prompt-loader .em:nth-child(15) {
		animation: load 1.3s 0.6s infinite linear;
	}
 
	.prompt-loader .em:nth-child(16) {
		animation: load 1.3s 0.6s infinite linear;
	}
 
	.prompt-loader .em:nth-child(17) {
		animation: load 1.3s 0.8s infinite linear;
	}
 
	.prompt-loader .em:nth-child(18) {
		animation: load 1.3s 0.2s infinite linear;
	}
 
	.prompt-loader .em:nth-child(19) {
		animation: load 1.3s 0.4s infinite linear;
	}
 
	.prompt-loader .em:nth-child(20) {
		animation: load 1.3s 0.6s infinite linear;
	}
 
	.prompt-loader .em:nth-child(21) {
		animation: load 1.3s 0.5s infinite linear;
	}
 
	.prompt-loader .em:nth-child(22) {
		animation: load 1.3s 0.2s infinite linear;
	}
 
	.prompt-loader .em:nth-child(23) {
		animation: load 1.3s 0.4s infinite linear;
	}
 
	.prompt-loader .em:nth-child(24) {
		animation: load 1.3s 0.6s infinite linear;
	}
 
	.prompt-loader .em:nth-child(25) {
		animation: load 1.3s 0.8s infinite linear;
	}
 
	.prompt-loader .em:nth-child(26) {
		animation: load 1.3s 0.2s infinite linear;
	}
 
	.prompt-loader .em:nth-child(27) {
		animation: load 1.3s 0.4s infinite linear;
	}
 
	.prompt-loader .em:nth-child(28) {
		animation: load 1.3s 0.1s infinite linear;
	}
 
	.prompt-loader .em:nth-child(29) {
		animation: load 1.3s 0.3s infinite linear;
	}
 
	.prompt-loader .em:nth-child(30) {
		animation: load 1.3s 0.6s infinite linear;
	}
 
	@keyframes load {
		0% {
			height: 15%;
		}
 
		50% {
			height: 100%;
		}
 
		100% {
			height: 15%;
		}
	}

</style>