jinji.vue 7.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274
  1. <template>
  2. <view>
  3. <view class="text-white text-center" style="margin-top: 200rpx;">
  4. <view class="datt">严重危害生命财产安全 </view>
  5. <view class="datt margin-top-sm">求助专属通道</view>
  6. <!-- <view class="margin-top">平台将为您,保留录音证据,实时位置,通知平台联系人</view> -->
  7. </view>
  8. <!-- <view class="text-center" style="margin-top: 120rpx;" @touchstart="voiceBegin" v-if="isYuyin=='是'"
  9. @touchmove.stop.prevent="voiceIng" @touchend="voiceEnd" @touchcancel="voiceCancel">
  10. <image src="../static/yuyin.png" style="width: 300rpx;height: 300rpx;"></image>
  11. </view> -->
  12. <!-- <view class="text-center" style="margin-top: 120rpx;" v-else @click="setChatSave">
  13. <image src="../static/yuyin.png" style="width: 300rpx;height: 300rpx;"></image>
  14. </view> -->
  15. <!-- 录音UI效果 -->
  16. <!-- <view class="record" :class="recording?'':'hidden'">
  17. <view class="ing" :class="willStop?'hidden':''">
  18. <view class="icon luyin2"></view>
  19. </view>
  20. <view class="cancel" :class="willStop?'':'hidden'">
  21. <view class="icon chehui"></view>
  22. </view>
  23. <view class="tis" :class="willStop?'change':''">{{recordTis}}</view>
  24. </view> -->
  25. <!-- <view class="text-center" style="margin-top:200rpx;" @touchstart="voiceBegin" @touchmove.stop.prevent="voiceIng"
  26. @touchend="voiceEnd" @touchcancel="voiceCancel" v-if="isYuyin=='是'">
  27. <image src="../static/sos.png" style="width: 200rpx;height: 200rpx;"></image>
  28. </view> -->
  29. <!-- <view v-else class="text-center" style="margin-top:200rpx;" @click="setChatSave">
  30. <image src="../static/sos.png" style="width: 200rpx;height: 200rpx;"></image>
  31. </view> -->
  32. <view class="text-center" style="margin-top:200rpx;" @click="getPhoneNumber()">
  33. <image src="../static/sos.png" style="width: 200rpx;height: 200rpx;"></image>
  34. </view>
  35. </view>
  36. </template>
  37. <script>
  38. import configdata from '@/common/config.js';
  39. export default {
  40. data() {
  41. return {
  42. latitude: '',
  43. longitude: '',
  44. content: '',
  45. //录音相关参数
  46. // #ifndef H5
  47. //H5不能录音
  48. RECORDER: uni.getRecorderManager(),
  49. // #endif
  50. isVoice: false,
  51. voiceTis: '按住 说话',
  52. recordTis: "手指上滑 取消发送",
  53. recording: false,
  54. willStop: false,
  55. initPoint: {
  56. identifier: 0,
  57. Y: 0
  58. },
  59. recordTimer: null,
  60. recordLength: 0,
  61. //播放语音相关参数
  62. AUDIO: uni.createInnerAudioContext(),
  63. playMsgid: null,
  64. VoiceTimer: null,
  65. isYuyin: '否'
  66. }
  67. },
  68. onLoad: function(option) {
  69. // 425
  70. // this.$Request.getT('/app/common/type/425').then(res => {
  71. // if (res.code == 0) {
  72. // if (res.data && res.data.value && res.data.value == '是') {
  73. // this.isYuyin = res.data.value
  74. // // #ifndef H5
  75. // //录音开始事件
  76. // this.RECORDER.onStart((e) => {
  77. // this.recordBegin(e);
  78. // })
  79. // //录音结束事件
  80. // this.RECORDER.onStop((e) => {
  81. // this.recordEnd(e);
  82. // })
  83. // // #endif
  84. // }
  85. // }
  86. // });
  87. // let that = this;
  88. // uni.getLocation({
  89. // type: 'wgs84',
  90. // success: function(res) {
  91. // console.log('当前位置的经度:' + res.longitude);
  92. // console.log('当前位置的纬度:' + res.latitude);
  93. // that.latitude = res.latitude
  94. // that.longitude = res.longitude
  95. // }
  96. // });
  97. },
  98. onBackPress() {
  99. // this.AUDIO.stop();
  100. },
  101. onHide() {
  102. // this.AUDIO.stop();
  103. },
  104. methods: {
  105. //获取配置的求助电话
  106. getPhoneNumber() {
  107. this.$Request.getT('/app/common/type/444').then(res => {
  108. if (res.code == 0) {
  109. if (res.data && res.data.value) {
  110. uni.makePhoneCall({
  111. phoneNumber: res.data.value
  112. })
  113. }
  114. }
  115. });
  116. },
  117. // 切换语音/文字输入
  118. switchVoice() {
  119. this.isVoice = this.isVoice ? false : true;
  120. },
  121. setChatSave() {
  122. let userId = this.$queue.getData('userId');
  123. let userName = this.$queue.getData('userName');
  124. let data = {
  125. image: this.content,
  126. state: 9,
  127. type: this.longitude,
  128. platform: this.latitude,
  129. userId: userId,
  130. userName: userName
  131. }
  132. this.$Request.postJson('/app/message/insertMessage', data).then(
  133. res => {
  134. if (res.code == 0) {
  135. this.$queue.showToast('上传成功!');
  136. } else {
  137. this.$queue.showToast(res.msg);
  138. }
  139. });
  140. },
  141. // 录音开始
  142. voiceBegin(e) {
  143. if (e.touches.length > 1) {
  144. return;
  145. }
  146. this.initPoint.Y = e.touches[0].clientY;
  147. this.initPoint.identifier = e.touches[0].identifier;
  148. this.RECORDER.start({
  149. format: "mp3"
  150. }); //录音开始,
  151. },
  152. //录音开始UI效果
  153. recordBegin(e) {
  154. this.recording = true;
  155. this.voiceTis = '松开 结束';
  156. this.recordLength = 0;
  157. this.recordTimer = setInterval(() => {
  158. this.recordLength++;
  159. }, 1000)
  160. },
  161. // 录音被打断
  162. voiceCancel() {
  163. this.recording = false;
  164. this.voiceTis = '按住 说话';
  165. this.recordTis = '手指上滑 取消发送'
  166. this.willStop = true; //不发送录音
  167. this.RECORDER.stop(); //录音结束
  168. },
  169. // 录音中(判断是否触发上滑取消发送)
  170. voiceIng(e) {
  171. if (!this.recording) {
  172. return;
  173. }
  174. let touche = e.touches[0];
  175. //上滑一个导航栏的高度触发上滑取消发送
  176. if (this.initPoint.Y - touche.clientY >= uni.upx2px(100)) {
  177. this.willStop = true;
  178. this.recordTis = '松开手指 取消发送'
  179. } else {
  180. this.willStop = false;
  181. this.recordTis = '手指上滑 取消发送'
  182. }
  183. },
  184. // 结束录音
  185. voiceEnd(e) {
  186. if (!this.recording) {
  187. return;
  188. }
  189. this.recording = false;
  190. this.voiceTis = '按住 说话';
  191. this.recordTis = '手指上滑 取消发送'
  192. this.RECORDER.stop(); //录音结束
  193. },
  194. //录音结束(回调文件)
  195. recordEnd(e) {
  196. clearInterval(this.recordTimer);
  197. if (!this.willStop) {
  198. this.$queue.showLoading('发送中...')
  199. console.log("e: " + JSON.stringify(e));
  200. let msg = {
  201. length: 0,
  202. url: e.tempFilePath
  203. }
  204. let min = parseInt(this.recordLength / 60);
  205. let sec = this.recordLength % 60;
  206. min = min < 10 ? '0' + min : min;
  207. sec = sec < 10 ? '0' + sec : sec;
  208. if (this.recordLength % 60 > 1) {
  209. msg.length = min + ':' + sec;
  210. console.log('msg.length___:' + msg.length)
  211. uni.uploadFile({ // 上传接口
  212. url: this.config("APIHOST1") + '/alioss/upload', //真实的接口地址
  213. filePath: e.tempFilePath,
  214. name: 'file',
  215. success: (uploadFileRes) => {
  216. uni.hideLoading();
  217. this.content = JSON.parse(uploadFileRes.data).data;
  218. console.log("语音:" + this.content)
  219. this.setChatSave();
  220. uni.hideLoading();
  221. }
  222. });
  223. } else {
  224. this.$queue.showToast('语音要大于一秒才可以发送!')
  225. }
  226. } else {
  227. console.log('取消发送录音');
  228. }
  229. this.willStop = false;
  230. },
  231. config: function(name) {
  232. var info = null;
  233. if (name) {
  234. var name2 = name.split("."); //字符分割
  235. if (name2.length > 1) {
  236. info = configdata[name2[0]][name2[1]] || null;
  237. } else {
  238. info = configdata[name] || null;
  239. }
  240. if (info == null) {
  241. let web_config = cache.get("web_config");
  242. if (web_config) {
  243. if (name2.length > 1) {
  244. info = web_config[name2[0]][name2[1]] || null;
  245. } else {
  246. info = web_config[name] || null;
  247. }
  248. }
  249. }
  250. }
  251. return info;
  252. },
  253. }
  254. }
  255. </script>
  256. <style lang="scss">
  257. @import "../setting/css/style.scss";
  258. page {
  259. background: #346EF6;
  260. }
  261. .datt {
  262. font-size: 42rpx;
  263. font-family: PingFang SC;
  264. font-weight: 800;
  265. }
  266. </style>