選択できるのは25トピックまでです。 トピックは、先頭が英数字で、英数字とダッシュ('-')を使用した35文字以内のものにしてください。
 
 
 

1469 行
38 KiB

  1. <template>
  2. <view class="details">
  3. <!-- 头部违禁信息 -->
  4. <view class="header">
  5. <view class="h-box">
  6. <view class="h-b-top">
  7. <text class="name">{{ userlistobj.agentName || '' }}</text>
  8. <view class="status">
  9. <text class="pointer"></text>
  10. <text class="item">{{ userlistobj.violatedStatus | ViolatedStatus }}</text>
  11. </view>
  12. </view>
  13. <!-- 详细信息 -->
  14. <view class="h-b-btm" style="margin: 19rpx 0 30rpx;">
  15. <view class="item">
  16. <image class="item-imgs" src="@/static/images/img/time.png" mode=""></image>
  17. {{ userlistobj.createTime || '' }}
  18. </view>
  19. </view>
  20. <view class="h-b-btm">
  21. <view class="item">
  22. <image class="item-imgs" src="@/static/images/img/voice.png" mode=""></image>
  23. {{ userlistobj.mm || '' }}m
  24. </view>
  25. <view class="item hit">
  26. <image class="item-imgs" src="@/static/images/img/hit.png" mode=""></image>
  27. {{ userlistobj.violatedFrequency || '0' }}
  28. </view>
  29. </view>
  30. </view>
  31. </view>
  32. <!-- tab选择框 -->
  33. <template v-if="isShowMerge">
  34. <u-tabs :activeItemStyle="{background: '#2979ff', color: '#fff'}" :list="list" :is-scroll="false" bg-color="transparent" :show-bar="false" :current="current"
  35. @change="change"></u-tabs>
  36. </template>
  37. <template v-if="current == 0">
  38. <scroll-view :scroll-top="scrollTop" lower-threshold='100px' @scrolltolower="ltolower()"
  39. upper-threshold='40px' @scrolltoupper="rolltoupper()" :scroll-into-view="scrollId" scroll-y="true"
  40. class="zhuti text scroll-Y">
  41. <!-- 聊天记录-->
  42. <view class="dialog-block" style="border-bottom: none;">
  43. <block v-for="(item,index) in findTabooWordsList" :key="index">
  44. <view class="text">
  45. <view class="avatar">
  46. <view :style="[SPEAKERSTYLE(item.speaker)]">
  47. <!-- <image v-if="item.isShow && item.isShow == 0" :src="Aimg" mode="widthFix"></image> -->
  48. <text v-if="item.isShow == 0">顾</text>
  49. <text v-else>{{ item.speaker | toCapital }}</text>
  50. </view>
  51. </view>
  52. <view class="contentInfo">
  53. <view class="info">
  54. <!-- <text class="AudioUserName">{{ item.speaker | toCapital }}</text> -->
  55. <text class="AudioUserName" v-if="item.isShow == 0">{{item.username}}</text>
  56. <text class="AudioUserName" v-else>{{ item.speaker | toCapital }}</text>
  57. <text>{{conversionTiame(item.bg/1000)}}</text>
  58. </view>
  59. <view class="contentMain">
  60. <view class="content">
  61. <view v-html="item.onebest"></view>
  62. </view>
  63. <template v-if="isShowMerge">
  64. <image @click="clickbofang(0,item, 'show')" class="play"
  65. src="@/static/images/recordingManagement/play.png"></image>
  66. </template>
  67. </view>
  68. </view>
  69. </view>
  70. </block>
  71. </view>
  72. </scroll-view>
  73. </template>
  74. <template v-if="current == 1">
  75. <!-- 音频 -->
  76. <view class="audio">
  77. <!-- 标记顾问 -->
  78. <view class="headboxbott">
  79. <view class="headovfu">
  80. <u-tabs-swiper ref="tabs" font-size="30" :bold="true" swiper-width="600" :current="roleindex"
  81. @change="tapspagek()" inactive-color="#b1b1b1" active-color="#008ef2" :list="tablist"
  82. :is-scroll="true">
  83. </u-tabs-swiper>
  84. </view>
  85. <view v-if="permissions.bjgw" class="headpade">
  86. <view class="biaoji" @tap="tagtap()">标记</view>
  87. </view>
  88. </view>
  89. </view>
  90. <scroll-view :scroll-top="scrollTop" lower-threshold='100px' @scrolltolower="ltolower()"
  91. upper-threshold='40px' @scrolltoupper="rolltoupper()" :scroll-into-view="scrollId" scroll-y="true"
  92. class="zhuti text scroll-Y">
  93. <!-- 聊天记录-->
  94. <view class="dialog-block" v-for="(dialog,i) in dialogList" :key="i">
  95. <view :id="'dialog'+i" class="fileName">录音文件</view>
  96. <block v-for="(item,index) in dialog.message" :key="index">
  97. <view class="text" :id="'dialog'+csdFileindex+'text'+item.bg"
  98. :class="{active: item.bg < playNow && item.ed > playNow, reverse: Number(item.speaker) % 2 == 0}"
  99. :data-speaker="item.speaker">
  100. <view class="avatar">
  101. <view :style="[SPEAKERSTYLE(item.speaker)]">
  102. <!-- <image v-if="item.isShow == 0" :src="Aimg" mode="widthFix"></image> -->
  103. <text v-if="item.isShow == 0">顾</text>
  104. <text v-else>{{ item.speaker | toCapital }}</text>
  105. </view>
  106. </view>
  107. <view class="contentInfo">
  108. <view class="info">
  109. <!-- <text class="AudioUserName">{{ item.speaker | toCapital }}</text> -->
  110. <text class="AudioUserName" v-if="item.isShow == 0">{{ item.username }}</text>
  111. <text class="AudioUserName" v-else>{{ item.speaker | toCapital }}</text>
  112. <text>{{conversionTiame(item.bg/1000)}}</text>
  113. </view>
  114. <view class="contentMain">
  115. <view class="content">
  116. <view v-html="item.onebest"></view>
  117. </view>
  118. <image @click="clickbofang(dialog.backindex,item)" class="play"
  119. src="@/static/images/recordingManagement/play.png"></image>
  120. </view>
  121. </view>
  122. </view>
  123. </block>
  124. </view>
  125. </scroll-view>
  126. </template>
  127. <view class="bottombox">
  128. <!-- 播放块 -->
  129. <template v-if="current == 1">
  130. <zaudio :duration="duration" theme="theme4"></zaudio>
  131. </template>
  132. <template v-if="userlistobj.invalidViolatedCause">
  133. <view class="bottomtips">
  134. 无效原因:{{ userlistobj.invalidViolatedCause }}
  135. </view>
  136. </template>
  137. <view class="botbotmm">
  138. <view class="item" @click="preValid">上一条</view>
  139. <template v-if="isShowMerge">
  140. <template v-if="userlistobj.disposeStatus == 0">
  141. <view class="item" @click="setViolated(1)">确认有效</view>
  142. <view class="item" @tap="showTagValid">确认无效</view>
  143. </template>
  144. <template v-if="userlistobj.disposeStatus == 1 && userlistobj.violatedStatus == 1">
  145. <view class="item" @tap="showTagValid">无效</view>
  146. </template>
  147. <template v-if="userlistobj.disposeStatus == 1 && userlistobj.violatedStatus == 2">
  148. <view class="item" @click="setViolated(1)">确认有效</view>
  149. </template>
  150. </template>
  151. <view class="item" @click="nextValid">下一条</view>
  152. </view>
  153. </view>
  154. <!-- 标记顾问 -->
  155. <u-popup v-model="biojiisshow" mode="center">
  156. <view class="bounced">
  157. <view class="jiajinghuatit">标记为顾问</view>
  158. <view
  159. style="width: 95%;display: flex;flex-wrap: wrap;margin: 0 auto;padding-top: 30rpx;padding-bottom: 30rpx;">
  160. <view class="viewclace" :class="roleindexbiaoji == index ? 'bosdttom' : ''"
  161. @click="biaojixuanze(index)" v-for="(item,index) in tablist.slice(1,tablist.length)"
  162. :key="index">
  163. <view>{{item.name}}</view>
  164. </view>
  165. </view>
  166. <view class="bounced3" style="margin-top: 20rpx;">
  167. <view class="bounced3-1" @tap="unmarktap">取消</view>
  168. <view class="bounced3-2" @tap="Confirmthetag">确认</view>
  169. </view>
  170. </view>
  171. </u-popup>
  172. <!-- 标记无效原因 border-radius="16" -->
  173. <u-popup v-model="tagValidShow" mode="center">
  174. <view class="reason">
  175. <text class="resaon-title">无效原因</text>
  176. <view class="resaon-textbox">
  177. <textarea v-model="reasonSrc" placeholder="请输入无效原因" maxlength="60" />
  178. <text class="lastlength">{{ reasonSrc.length }}/60</text>
  179. </view>
  180. <view class="button">
  181. <text @click="inputDone">完成</text>
  182. </view>
  183. </view>
  184. </u-popup>
  185. </view>
  186. </template>
  187. <script>
  188. var util = require("@/utils/util.js");
  189. var config = require("@/config");
  190. import zaudio from '@/components/uniapp-zaudio/zaudio';
  191. export default {
  192. components: {
  193. zaudio
  194. },
  195. data() {
  196. return {
  197. Aimg: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFAAAABQCAMAAAC5zwKfAAACqVBMVEUAAAD////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////9/f3////9/f39/f3////////9/f3////////////9/f3////9/f39/f3////9/f3////////9/f3////9/f3////////////////9/f39/f3////////9/f39/f3////9/f39/f3////////9/f39/f3////////9/f39/f39/f3////////////////+/v7+/v7////+/v7////+/v7////+/v7+/v7////////+/v7+/v7////+/v7////+/v7////////////////////////////+/v7////+/v7////+/v7+/v7////////////+/v7////+/v7////+/v7+/v7////////+/v7////+/v7////////+/v7////////+/v7////+/v7+/v7+/v7////////+/v7+/v7////+/v7+/v7////+/v7////+/v7////+/v7////+/v7+/v7////+/v7+/v7////+/v7////+/v7////+/v7+/v7////+/v5jdC9iAAAA4nRSTlMAAQIDBAUGBwgLDA0ODxARExQVFhgbHB4fICEiIyQmJygpKy4wMTIzNDY3ODk6Oz0+P0BBQkRGR0lKTE5PUFFTVFVXWFlcXV9gYWJjZWZnaGlqa2xtbm9wcXJzdHV2d3h6e319foGBgoODh4mKiouMjI2QkZKSk5OUlpeYmZmam5ycnZ+foKGio6SmqKmpq6yur7CwsbGytba5uru8wMDBwcLCw8XGx8jJysrLzM7P0dLT1dXW1tfY2drc3N7f4OHh5Obm5+jp6uvs7vDx8vLz8/T09fX29/f4+fn6+vz8/f7+RVDt+wAAA55JREFUGBntwf9/1HMAB/DX7XYbuXWV1cyMoixfugrRGNXytW33pbVdJ83XkiMLSb4LJd/zZUi0SKT5FmGS77HUVaixnHP2+kt8vt3Zbp/3+7P3XR5+8XziP1E4uiYcrh1bjMNi6NzXumnoeX3eSOSrpHUv+zi0ogJ5qd3JLN1XuJGzwqW0sW4oclT0Im19XIqcuNdQ4D0vcnEDhdYgB2f+SbFZUHbEdkrsLYeqFko9CEVH7qJUohxqLqODO6BmLR18XwAVRQfpZDxUnExHjVBRR0eroGIZHX0AFe10tA8qdtNZIRR00VEPVLxLRzuh4jk62gIVy+joSaiI0tECqPDT0blQ4f6RDpI+KHmYDjZBzWQ6aIaibZSK+6BoOqViUOXqoER8BJSdlqJYFDm4h0LveJAD7+cUiFciJ1U/01aiGjk65zfaSF6EnE3azQEO1iAPFZuZZes45MUT3cM+emLFyNfwK3fQ8k1sFA6L0cElTzx9d1OVC/8bNG/gzY+GQaKk461gCQZr8iMHSNZD4nySv6wYj0EYFv2UhqcgcTsN70ePhtzER3+lJe6BxXP9jTctvrl1yS1jkLaNlkTbBR6IlF3dyT78sHh+oqkSlrJe/uOH1jGw4apem2I/1yLtGRo6kRZiP73t57mQxb+Z2dqRdikNtyLtBWb78Cz05bomyQH+KIGljIYaWNxxDtC72ouMgsdpZzosHhqqYDmFdraOQNpttHUfLKU0TITlKtra6IZpCu3tgMVPQx0sG2ivDqaVFDgOppk0LIbJm6C9DTB1UCAMU4SGZ2GqocAumL6jQBtMMRq2wLScAik3dMV/UWB/EQwrafgSpk6KlEJ3LIXOgGE9DQdgqKDQSdBNoNAiGL6i6SjowhSaAt1UCm2CzpOk6QTonqfQJdBdSKGkD5pKWqZCU7iHQtdB10KxWmjOpqUJmtMp9gB091LsIWiCtCyFZiHFXoZuHcW+hiZGy0vQvE2xT6DbTolKAI/R8hmA4SmKdUG3jxIhAG/QkigAZlAi6QJQTJk2AF1MGwXcRRkfgJGU2V8EHzP8wBeUqQQwllKTcCozpuFESk0AMJNSC3AxM8KYT6lpAFootRGLmLEQ6ynVCCBAqcSQ1cy4f8ghSs0HcMzvlKp+lRmvVFMqNQ6aaIoyd3Yy49vllOmuh+H4WZFIpFnTpJmjadTM1oQ1oVAgFNQENA0N9f01BIKh8OzGOU3NkbmXzwuV41/wNztgHKhu7WKTAAAAAElFTkSuQmCC",
  198. list: [{
  199. name: '违禁话术'
  200. }, {
  201. name: '音频识别'
  202. }],
  203. current: 0, // tab下表
  204. tablist: [], // 顾问标记列表
  205. roleindex: 0, // 选中顾问下标
  206. luyinList: [], // 录音文件
  207. newluyinList: [],
  208. dialogList: [], // 录音识别列表渲染数据
  209. permissions: {}, // 权限菜单
  210. biojiisshow: false, // 标记顾问弹窗
  211. textindex: 0, //下拉 转写文件下标
  212. toptextindex: 0, //上拉 转写文件下标
  213. dshfkjsdkksodofydwfkhwdfkjh: 0, // 顾问的id之类的
  214. status: 0, // 状态(不明白是什么状态)
  215. speaker: '', // 角色身份
  216. customerId: '', // 楼盘id吧(猜)
  217. infos: {}, // 音频内容
  218. stateisshow: '', //
  219. itemobj: {}, // 本地缓存的音频信息
  220. userlistobj: {}, // 获取到的顾问信息
  221. csdFileindex: 0, // 当前使用录音转写的下标
  222. // 录音信息
  223. recordPath: "", // 录音地址
  224. playNow: 0, // 当前播放时间
  225. audioType: false, // 音频是否自动播放状态
  226. scrollId: "", // 当前播放滚动到的位置
  227. tagValidShow: false, // 标记弹窗
  228. reasonSrc: '', // 标记无效的原因
  229. findTabooWordsList: [], // 违禁词列表
  230. nextPageObj: JSON.parse(uni.getStorageSync('nextPageObj')), // 当前页面筛选内容
  231. isMerge: 0, // 默认合并
  232. isSw:false,
  233. ACTION: Symbol('zaudio'), // 唯一值区分每个页面的方法
  234. isPageHide: false, // 是否息屏
  235. duration: '', // 总时长
  236. }
  237. },
  238. computed: {
  239. conversionTiame() {
  240. return (e) => {
  241. return this.getTime(e);
  242. }
  243. },
  244. // 是否为合并录音
  245. isShowMerge() {
  246. return this.isMerge == 0 ? true : false
  247. }
  248. },
  249. onLoad(option) {
  250. this.status = option.status;
  251. this.customerId = option.customerId;
  252. this.stateisshow = option.stateisshow;
  253. this.itemobj = uni.getStorageSync('searchobj');
  254. if (option.isMerge) this.isMerge = option.isMerge
  255. //注意: 不同的回调方法, 相同的业务函数方法名, 不会相互影响;
  256. this.$zaudio.on('stop', this.ACTION, () => {
  257. console.log('我是强制暂停或关闭小程序音频浮窗触发的')
  258. })
  259. this.$zaudio.on('seek', this.ACTION, (time) => {
  260. this.sliderChangeComplate(this.TIMEEVENT(time))
  261. })
  262. this.$zaudio.on('playing', this.ACTION, (obj) => {
  263. this.duration = obj.duration
  264. this.TimeUpdate(this.TIMEEVENT(obj.current))
  265. })
  266. this.$zaudio.on('error', this.ACTION, e => {
  267. console.log(e, '加载失败')
  268. })
  269. this.$zaudio.on('ended', this.ACTION, e => {
  270. this.$zaudio.stop()
  271. this.init({
  272. bg: 0,
  273. customerId: this.customerId
  274. })
  275. })
  276. },
  277. onShow() {
  278. //实时渲染当前的播放状态
  279. this.$zaudio.syncRender()
  280. this.permissions = uni.getStorageSync('weapp_session_Menu_data') // 权限
  281. this.roleindex = 0;
  282. if (this.stateisshow == 2) {
  283. this.infos = this.itemobj;
  284. } else {
  285. var pages = getCurrentPages();
  286. var currPage = pages[pages.length - 1]; //当前页面
  287. this.infos = currPage.data.info;
  288. }
  289. !this.isPageHide && this.init(this.infos);
  290. this.gituserlist()
  291. this.findTabooWords()
  292. },
  293. onHide() {
  294. this.isPageHide = true
  295. },
  296. onUnload() {
  297. //卸载不需要的业务和获取播放状态的业务,提高页面性能
  298. this.$zaudio.off('seek', this.ACTION);
  299. this.$zaudio.off('stop', this.ACTION);
  300. this.$zaudio.off('playing', this.ACTION);
  301. },
  302. methods: {
  303. // 获取违禁词
  304. findTabooWords() {
  305. this.$u.get('/customer/findTabooWords', {
  306. customerId: this.customerId
  307. }).then(res => {
  308. let arr = []
  309. res.map(item => {
  310. if (item.transferContent) {
  311. item.transferContents = JSON.parse(item.transferContent)
  312. arr.push(item.transferContents)
  313. }
  314. })
  315. this.findTabooWordsList = arr
  316. console.log(this.findTabooWordsList, 'findTabooWordsList')
  317. })
  318. },
  319. // 确认无效标记 setViolatedStatus = 2
  320. inputDone() {
  321. if (!this.reasonSrc) {
  322. uni.showToast({
  323. title: '请输入标记无效的原因',
  324. icon: 'none',
  325. duration: 2000
  326. })
  327. return
  328. }
  329. this.setViolated(2)
  330. },
  331. // 下一条
  332. nextValid() {
  333. console.log(this.$zaudio)
  334. if (this.nextPageObj.pageSize < this.nextPageObj.num) {
  335. this.$zaudio.stop()
  336. this.nextPageObj.pageSize++
  337. this.keyWordsMatching(this.nextPageObj)
  338. } else {
  339. uni.showToast({
  340. title: '已经是最后一条了~',
  341. icon: 'none'
  342. })
  343. }
  344. },
  345. // 上一条
  346. preValid() {
  347. if (this.nextPageObj.pageSize == 1) {
  348. uni.showToast({
  349. title: '没有更早的了~'
  350. })
  351. } else {
  352. this.$zaudio.stop()
  353. this.nextPageObj.pageSize--
  354. this.keyWordsMatching(this.nextPageObj)
  355. }
  356. },
  357. // 获取违禁话术详情
  358. keyWordsMatching(params) {
  359. this.$u.post('/customer/findbynum', params).then(res => {
  360. this.customerId = res.results[0].id;
  361. this.current = 0
  362. uni.setStorageSync('nextPageObj', JSON.stringify(this.nextPageObj))
  363. this.$zaudio.resetDatas()
  364. this.resetAudioParams()
  365. this.prohibitedMatch()
  366. }).catch(e => {
  367. this.nextPageObj = JSON.parse(uni.getStorageSync('nextPageObj')), // 当前页面筛选内容
  368. uni.showToast({
  369. title: e.message,
  370. icon: 'none',
  371. duration: 2000
  372. })
  373. })
  374. },
  375. // 违禁词播放位置
  376. prohibitedMatch() {
  377. this.$u.post('/customer/prohibitedMatch', {
  378. customerId: this.customerId
  379. }).then(res => {
  380. let newweijin = res[0];
  381. newweijin.transferContent = JSON.parse(newweijin.transferContent)
  382. var item = {
  383. bg: newweijin.transferContent.bg,
  384. customerId: newweijin.corpusId,
  385. }
  386. // 获取是否有转写的音频
  387. this.$u.post("/corpus/findByPage", {
  388. pageNum: 1,
  389. pageSize: 100,
  390. query: {
  391. customerId: this.customerId,
  392. }
  393. }).then(res => {
  394. if (res == null) {
  395. uni.showToast({
  396. icon: "none",
  397. title: "暂无音频"
  398. })
  399. return
  400. } else {
  401. let newobj = res[0];
  402. this.isMerge = res[0].merge
  403. if (res[0].merge == 0) {
  404. this.infos = item
  405. this.itemobj = item
  406. this.recordPath = res[0].recordPath
  407. uni.setStorageSync("searchobj", item); //写入缓存
  408. this.roleindex = 0;
  409. this.gituserlist()
  410. this.findTabooWords()
  411. this.zyAudio()
  412. } else {
  413. uni.showToast({
  414. icon: "none",
  415. title: "暂无音频"
  416. })
  417. }
  418. }
  419. })
  420. })
  421. },
  422. // 设置违禁状态
  423. setViolated(status) {
  424. let params = {
  425. customerId: this.customerId,
  426. violatedStatus: status,
  427. invalidViolatedCause: this.reasonSrc,
  428. }
  429. this.$u.post('/customer/setViolatedStatus', params).then(res => {
  430. this.tagValidShow = false
  431. uni.showToast({
  432. title: '标记成功',
  433. duration: 2000
  434. });
  435. this.gituserlist()
  436. setTimeout(() => {
  437. this.reasonSrc = ''
  438. }, 2000)
  439. }).catch(e => {
  440. this.tagValidShow = false
  441. uni.showToast({
  442. title: e.message,
  443. duration: 2000
  444. });
  445. })
  446. },
  447. // 展示确认无效原因输入框
  448. showTagValid() {
  449. this.tagValidShow = true
  450. },
  451. //获取用户信息
  452. gituserlist() {
  453. this.$u.get("/matchKeywords/personalReceptionRecord", {
  454. customerId: this.customerId
  455. }).then(res => {
  456. res.endTime1 = res.endTime.substring(0, 19);
  457. this.userlistobj = res;
  458. })
  459. },
  460. //标记顾问
  461. tagtap() {
  462. this.biojiisshow = !this.biojiisshow;
  463. },
  464. //取消标记
  465. unmarktap() {
  466. this.roleindexbiaoji = this.dshfkjsdkksodofydwfkhwdfkjh;
  467. },
  468. //确认标记
  469. Confirmthetag() {
  470. var num = this.roleindexbiaoji + 1;
  471. let params = {
  472. id: this.luyinList[this.csdFileindex].id,
  473. speaker: num,
  474. customerId: this.customerId
  475. }
  476. this.$u.get(config.service.markConsultant, params).then((data) => {
  477. this.biojiisshow = false;
  478. this.biaojiyuyi()
  479. this.fenjiaoseunfo()
  480. uni.showToast({
  481. title: '标记成功',
  482. duration: 2000
  483. });
  484. })
  485. },
  486. // 切换角色展示
  487. tapspagek(index) {
  488. this.roleindex = index;
  489. this.newluyinList = [];
  490. this.fenjiaoseunfo()
  491. this.$forceUpdate()
  492. },
  493. // 初始化音频以及页面数据
  494. init(info) {
  495. this.sliderMax = 0; //进度条最大值
  496. this.timeStr = "00:00"; //总的时间
  497. const parames = {
  498. pageNum: 1,
  499. pageSize: 100,
  500. query: {
  501. customerId: this.customerId
  502. }
  503. }
  504. this.$u.post("/corpus/findByPage", parames).then(res => {
  505. if (res && res.length) {
  506. let alltime = 1 + res[0].recordDuration;
  507. this.calibration = res[0].calibration;
  508. if (this.calibration == 0) {
  509. this.kehuyixiangcenterindex = 0;
  510. } else {
  511. this.kehuyixiangcenterindex = 1;
  512. }
  513. if (info.bg != 0) {
  514. this.luyinList = res;
  515. this.recordPath = res[0].recordPath
  516. this.sliderMax = this.getTime(res[0].recordDuration)
  517. this.timeStr = this.getTime(res[0].recordDuration)
  518. this.date = res[0].receptionTime;
  519. this.getCorpusAnalysis(info);
  520. this.zyAudio()
  521. } else {
  522. this.luyinList = res;
  523. this.recordPath = res[0].recordPath
  524. this.sliderMax = this.getTime(res[0].recordDuration)
  525. this.timeStr = this.getTime(res[0].recordDuration)
  526. this.date = res[0].receptionTime;
  527. this.getCorpusAnalysis(info);
  528. this.zyAudio()
  529. }
  530. }
  531. })
  532. },
  533. // 重置进度条
  534. resetAudioParams() {
  535. this.scrollId = "" // 当前播放滚动到的位置
  536. },
  537. // 获取转义后的对话结果
  538. getCorpusAnalysis(info) {
  539. this.dialogList = [];
  540. this.newluyinList = []
  541. uni.request({
  542. url: config.service.getCorpusAnal + '?corpusId=' + this.luyinList[this.csdFileindex].id +
  543. "&bg=" + info.bg + "&speaker=" + this.roleindex + '&num=50', //仅为示例,并非真实接口地址。
  544. method: "GET",
  545. header: {
  546. 'content-type': 'application/json',
  547. 'Access-Token': uni.getStorageSync('weapp_session_login_data').token
  548. },
  549. success: (data) => {
  550. this.tablist = [];
  551. this.roleindexbiaoji = 0;
  552. let jsonInfo = JSON.parse(data.data.data.audioContent);
  553. for (var i = 0; i <= data.data.data.speakerNum; i++) {
  554. if (i === 0) {
  555. this.tablist.push({
  556. name: '全部'
  557. })
  558. } else {
  559. this.tablist.push({
  560. name: String.fromCharCode(i + 64)
  561. })
  562. }
  563. }
  564. if (data.data.data.speaker == null) {
  565. this.dshfkjsdkksodofydwfkhwdfkjh = 0;
  566. } else {
  567. if(data.data.data.viewNameFlag == 1){
  568. this.tablist[data.data.data.speaker].name = this.tablist[data.data.data.speaker]
  569. .name;
  570. }else{
  571. this.tablist[data.data.data.speaker].name = this.tablist[data.data.data.speaker]
  572. .name + "顾问";
  573. }
  574. this.roleindexbiaoji = data.data.data.speaker - 1;
  575. this.dshfkjsdkksodofydwfkhwdfkjh = data.data.data.speaker - 1;
  576. }
  577. if(data.data.data.viewNameFlag == 1){
  578. let p = [{name:'顾问'}]
  579. this.tablist = [...this.tablist,...p]
  580. this.isSw = true
  581. }else{
  582. this.isSw = false
  583. }
  584. this.speaker = data.data.data.speaker;
  585. //上拉标记点
  586. this.textindex = data.data.data.index;
  587. //下拉标记点
  588. this.toptextindex = data.data.data.index;
  589. jsonInfo.forEach(item => {
  590. item.message = JSON.parse(item.onebest)
  591. item.backindex = this.csdFileindex;
  592. if (info.onebest) {
  593. item.message.forEach(che => {
  594. if (che.onebest == info.onebest) {
  595. che.onebest =
  596. `<font style='color: red'>${che.onebest}</font>`;
  597. }
  598. })
  599. }
  600. })
  601. this.newluyinList = jsonInfo;
  602. this.dialogList.push(jsonInfo[this.textindex]);
  603. var itc = parseInt(info.bg / 1000)
  604. this.adasdasdasd(itc)
  605. }
  606. })
  607. },
  608. //下一页
  609. ltolower() {
  610. var lengthcz = this.newluyinList.length - 1;
  611. if (this.textindex >= lengthcz) {
  612. uni.showToast({
  613. title: '到底了',
  614. duration: 2000
  615. });
  616. return
  617. } else {
  618. this.textindex = this.textindex + 1;
  619. this.newluyinList[this.textindex].message.forEach(item => {
  620. this.dialogList[0].message.push(item)
  621. })
  622. }
  623. },
  624. //上一页
  625. rolltoupper() {
  626. if (this.toptextindex == 0) {
  627. return
  628. } else {
  629. if (this.dialogList[0] == undefined) {
  630. return
  631. } else {
  632. this.toptextindex = this.toptextindex - 1;
  633. let reverselist = this.newluyinList[this.toptextindex].message;
  634. let runlist = reverselist.reverse();
  635. runlist.forEach(item => {
  636. this.dialogList[0].message.unshift(item)
  637. })
  638. }
  639. }
  640. },
  641. //搜索跳转
  642. adasdasdasd(e) {
  643. this.stepPlay(e)
  644. },
  645. //分角色标记刷新
  646. fenjiaoseunfo() {
  647. var bgcd = this.sliderValue * 1000;
  648. this.newluyinList = [];
  649. this.dialogList = [];
  650. let voFlagValue;
  651. if(this.roleindex==0){
  652. voFlagValue = 0
  653. }else{
  654. voFlagValue = 1
  655. }
  656. let tempRoleIndex;
  657. if(this.isSw){
  658. if(this.roleindex==this.tablist.length-1){
  659. tempRoleIndex = 0
  660. }else{
  661. tempRoleIndex = this.roleindex
  662. }
  663. }else{
  664. tempRoleIndex = this.roleindex
  665. }
  666. uni.request({
  667. url: config.service.getCorpusAnal + '?corpusId=' + this.luyinList[this.csdFileindex].id +
  668. "&bg=" + bgcd + "&speaker=" + tempRoleIndex + "&voFlag=" + voFlagValue + '&num=50', //仅为示例,并非真实接口地址。
  669. method: "GET",
  670. header: {
  671. 'content-type': 'application/json',
  672. 'Access-Token': uni.getStorageSync('weapp_session_login_data').token
  673. },
  674. success: (data) => {
  675. this.tablist = [];
  676. let jsonInfo = JSON.parse(data.data.data.audioContent);
  677. for (var i = 0; i <= data.data.data.speakerNum; i++) {
  678. if (i === 0) {
  679. this.tablist.push({
  680. name: '全部'
  681. })
  682. } else {
  683. this.tablist.push({
  684. name: String.fromCharCode(i + 64)
  685. })
  686. }
  687. }
  688. if (data.data.data.speaker == null) {
  689. this.roleindexbiaoji = 0;
  690. this.dshfkjsdkksodofydwfkhwdfkjh = 0;
  691. } else {
  692. if(data.data.data.viewNameFlag == 1){
  693. this.tablist[data.data.data.speaker].name = this.tablist[data.data.data.speaker]
  694. .name;
  695. }else{
  696. this.tablist[data.data.data.speaker].name = this.tablist[data.data.data.speaker]
  697. .name + "顾问";
  698. }
  699. this.roleindexbiaoji = data.data.data.speaker - 1;
  700. this.dshfkjsdkksodofydwfkhwdfkjh = data.data.data.speaker - 1;
  701. }
  702. if(data.data.data.viewNameFlag == 1){
  703. let p = [{name:'顾问'}]
  704. this.tablist = [...this.tablist,...p]
  705. }
  706. if (this.roleindex > this.tablist.length - 1) {
  707. this.roleindex = this.tablist.length - 1
  708. this.fenjiaoseunfo()
  709. }
  710. this.speaker = data.data.data.speaker;
  711. //上拉标记点
  712. this.textindex = data.data.data.index;
  713. //下拉标记点
  714. this.toptextindex = data.data.data.index;
  715. jsonInfo.forEach(item => {
  716. item.message = JSON.parse(item.onebest)
  717. item.backindex = this.csdFileindex
  718. })
  719. console.log(jsonInfo)
  720. this.newluyinList = jsonInfo;
  721. if (this.textindex == null) {
  722. return
  723. } else {
  724. this.dialogList.push(jsonInfo[this.textindex]);
  725. }
  726. }
  727. })
  728. },
  729. // 选中下标
  730. change(index) {
  731. console.log(index)
  732. this.current = index;
  733. if (index == 1) {
  734. this.zyAudio()
  735. }
  736. },
  737. //长按点击播放
  738. clickbofang(dialog, item, type) {
  739. if (type == 'show') {
  740. this.current = 1
  741. this.infos = item
  742. this.audioType = true
  743. this.init(this.infos)
  744. return
  745. } else {
  746. this.audioType = false
  747. }
  748. this.dialogList.forEach(res => {
  749. res.message.forEach(asd => {
  750. asd.isshow = false;
  751. })
  752. })
  753. this.$forceUpdate()
  754. let platetime = item.bg;
  755. let newtime = item.bg / 1000;
  756. console.log(newtime, 'newTime')
  757. this.dialogList = []
  758. uni.request({
  759. url: config.service.fastForward + '?corpusId=' + this.luyinList[this.csdFileindex].id +
  760. "&bg=" + platetime, //仅为示例,并非真实接口地址。
  761. method: "GET",
  762. header: {
  763. 'content-type': 'application/json',
  764. 'Access-Token': uni.getStorageSync('weapp_session_login_data').token
  765. },
  766. success: (data) => {
  767. this.textindex = data.data.data.index;
  768. this.toptextindex = data.data.data.index;
  769. this.dialogList.push(this.newluyinList[data.data.data.index])
  770. const currTimeStr = this.formatTime(newtime)
  771. console.log(currTimeStr, 'currTimeStr')
  772. this.stepPlay(newtime);
  773. }
  774. })
  775. },
  776. TimeUpdate(currentTime) {
  777. this.playNow = Math.ceil(currentTime)
  778. if (this.dialogList.length == 0) {
  779. return
  780. } else {
  781. const message = this.dialogList[0].message;
  782. if (!message) return
  783. for (let i = 0; i < message.length; i++) {
  784. if (Math.floor(message[i].bg / 1000) <= this.playNow && this.playNow < Math.floor(message[i].ed /
  785. 1000)) {
  786. console.log(message[i].bg, '我是active', message[i].ed, '我是currentTime', this.playNow)
  787. console.log(message[i].onebest)
  788. this.scrollId = "dialog" + this.csdFileindex + "text" + message[i].bg;
  789. break;
  790. }
  791. if (i < message.length - 1 && Math.floor(message[i].ed / 1000) < this.playNow && this.playNow <
  792. Math.floor(message[i + 1].bg / 1000)) {
  793. this.scrollId = "dialog" + this.csdFileindex + "text" + message[i].bg;
  794. break;
  795. }
  796. }
  797. }
  798. this.$forceUpdate()
  799. },
  800. //音频前进回退
  801. sliderChangeComplate(currentTime) {
  802. let platetime = (currentTime * 1000) || 0;
  803. this.dialogList = []
  804. uni.request({
  805. url: config.service.fastForward + '?corpusId=' + this.luyinList[this.csdFileindex].id +
  806. "&bg=" + platetime, //仅为示例,并非真实接口地址。
  807. method: "GET",
  808. header: {
  809. 'content-type': 'application/json',
  810. 'Access-Token': uni.getStorageSync('weapp_session_login_data').token
  811. },
  812. success: (data) => {
  813. this.textindex = data.data.data.index;
  814. this.toptextindex = data.data.data.index;
  815. if (data.data.data.index > this.newluyinList.length) {
  816. this.dialogList.push(this.newluyinList[0])
  817. } else {
  818. this.dialogList.push(this.newluyinList[data.data.data.index])
  819. }
  820. }
  821. })
  822. },
  823. // 格式化时间
  824. getTime(time) {
  825. return util.formatSecond(time)
  826. },
  827. // 格式化时间
  828. formatTime(num) {
  829. //格式化时间格式
  830. num = num.toFixed(0);
  831. let second = num % 60;
  832. if (second < 10) second = '0' + second;
  833. let min = Math.floor(num / 60);
  834. if (min < 10) min = '0' + min;
  835. return min + ":" + second;
  836. },
  837. //录音实例
  838. zyAudio() {
  839. let data = [{
  840. src: this.recordPath,
  841. title: '录音音频',
  842. singer: '',
  843. coverImgUrl: ''
  844. }]
  845. if (this.current == 1) {
  846. this.$zaudio.setAudio(data)
  847. //渲染第一首音频
  848. this.$zaudio.setRender(0)
  849. console.log(this.$zaudio)
  850. setTimeout(() => {
  851. this.$zaudio.operate()
  852. }, 150)
  853. }
  854. },
  855. // 跳转指定位置播放
  856. stepPlay(t) {
  857. this.$zaudio.seek(t)
  858. if (this.$zaudio.paused) {
  859. this.$zaudio.operate()
  860. }
  861. }
  862. },
  863. filters: {
  864. // violatedStatus
  865. ViolatedStatus(status) {
  866. let str = '';
  867. switch (status) {
  868. case 0:
  869. str = '待处理'
  870. break;
  871. case 1:
  872. str = '有效违禁'
  873. break;
  874. case 2:
  875. str = '无效违禁'
  876. break;
  877. }
  878. return str
  879. },
  880. // 处理状态
  881. DisposeStatus(status) {
  882. let str = '';
  883. switch (status) {
  884. case 0:
  885. str = '待处理'
  886. break;
  887. case 1:
  888. str = '有效违禁'
  889. break;
  890. case 2:
  891. str = '无效违禁'
  892. break;
  893. }
  894. return str
  895. },
  896. }
  897. }
  898. </script>
  899. <style lang="scss" scoped>
  900. .details {
  901. width: 100vw;
  902. height: calc(100vh - var(--window-top));
  903. display: flex;
  904. flex-direction: column;
  905. .header {
  906. padding: 19rpx 30rpx 0;
  907. width: 100%;
  908. height: 210rpx;
  909. .h-box {
  910. width: 100%;
  911. height: 100%;
  912. background: #fff;
  913. border-radius: 16rpx;
  914. .h-b-top {
  915. display: flex;
  916. align-items: center;
  917. justify-content: space-between;
  918. .name {
  919. font-size: 30rpx;
  920. font-weight: bold;
  921. }
  922. .status {
  923. display: flex;
  924. align-items: center;
  925. .pointer {
  926. margin: 0 .5em;
  927. width: 12rpx;
  928. height: 12rpx;
  929. border-radius: 50%;
  930. background: #2671E2;
  931. }
  932. }
  933. }
  934. .h-b-btm {
  935. display: flex;
  936. justify-content: space-between;
  937. .item {
  938. flex-shrink: 0;
  939. display: flex;
  940. align-items: center;
  941. &.hit {
  942. color: #E7483C;
  943. font-size: bold;
  944. }
  945. .item-imgs {
  946. margin-right: .5em;
  947. width: 32rpx;
  948. height: 32rpx;
  949. }
  950. }
  951. }
  952. }
  953. }
  954. .audio {
  955. .headboxbott {
  956. width: 100%;
  957. height: 88rpx;
  958. display: flex;
  959. align-items: center;
  960. .headovfu {
  961. flex: 1;
  962. height: 88rpx;
  963. overflow: hidden;
  964. }
  965. .headpade {
  966. width: 160rpx;
  967. height: 60rpx;
  968. display: flex;
  969. justify-content: center;
  970. align-items: center;
  971. border-left: 1px solid #D6D6D6;
  972. .biaoji {
  973. min-width: 120rpx;
  974. height: 48rpx;
  975. background: #E6625B;
  976. border-radius: 24rpx;
  977. text-align: center;
  978. line-height: 48rpx;
  979. color: #FFFFFF;
  980. font-size: 26rpx;
  981. }
  982. }
  983. }
  984. }
  985. .scroll-Y {
  986. flex: 1;
  987. overflow: auto;
  988. font-size: 36upx;
  989. color: #999999;
  990. background: #FFFFFF;
  991. overflow-y: scroll;
  992. width: 100%;
  993. .dialog-block {
  994. margin: 20rpx 0;
  995. border-bottom: 1px solid #ccc;
  996. .fileName {
  997. text-align: center;
  998. margin: 10rpx auto;
  999. width: 115rpx;
  1000. height: 42rpx;
  1001. line-height: 42rpx;
  1002. background: #EFEFEF;
  1003. border-radius: 4rpx;
  1004. font-size: 20rpx;
  1005. font-weight: 400;
  1006. color: #333333;
  1007. }
  1008. }
  1009. .text {
  1010. margin: 50upx 30upx;
  1011. display: flex;
  1012. align-items: center;
  1013. .avatar {
  1014. margin-right: 24rpx;
  1015. width: 64upx;
  1016. height: 64upx;
  1017. line-height: 64upx;
  1018. text-align: center;
  1019. font-size: 36rpx;
  1020. border-radius: 50%;
  1021. background: #F2F2F2;
  1022. color: #008EF2;
  1023. image {
  1024. width: 40upx;
  1025. }
  1026. }
  1027. .content {
  1028. margin-left: 30upx;
  1029. line-height: 60rpx;
  1030. text-align: left;
  1031. padding: 0 5px;
  1032. background: #2BC805;
  1033. border-radius: 8upx;
  1034. max-width: 442rpx;
  1035. color: #FFFFFF;
  1036. position: relative;
  1037. .tankuangcss {
  1038. position: absolute;
  1039. top: -140rpx;
  1040. left: -120rpx;
  1041. width: 308rpx;
  1042. height: 130rpx;
  1043. background-color: #333333;
  1044. font-size: 24rpx;
  1045. color: #FFFFFF;
  1046. padding-top: 4rpx;
  1047. padding-bottom: 4rpx;
  1048. display: flex;
  1049. flex-wrap: wrap;
  1050. border-radius: 15rpx;
  1051. z-index: 1000;
  1052. }
  1053. .bottoms {
  1054. top: unset;
  1055. bottom: -140rpx;
  1056. }
  1057. }
  1058. .contentInfo {
  1059. .info {
  1060. color: #ccc;
  1061. font-size: 18rpx;
  1062. font-size: 30rpx;
  1063. .AudioUserName {
  1064. margin-right: 20rpx;
  1065. }
  1066. }
  1067. }
  1068. .contentMain {
  1069. display: flex;
  1070. .content {
  1071. margin-left: 0;
  1072. margin-right: 30upx;
  1073. // margin: 0 30upx;
  1074. }
  1075. .play {
  1076. width: 50rpx;
  1077. height: 50rpx;
  1078. margin-right: 20rpx;
  1079. }
  1080. }
  1081. &.active {
  1082. .content {
  1083. color: #FF7538 !important;
  1084. position: relative;
  1085. }
  1086. }
  1087. &.reverse {
  1088. flex-direction: row-reverse;
  1089. text-align: right;
  1090. .avatar {
  1091. margin-left: 24rpx;
  1092. }
  1093. .content {
  1094. margin-left: 0;
  1095. margin-right: 30upx;
  1096. background: #F6F6F6;
  1097. color: #999999;
  1098. }
  1099. .contentInfo {
  1100. .info {
  1101. color: #ccc;
  1102. font-size: 18rpx;
  1103. font-size: 30rpx;
  1104. padding: 0 28rpx;
  1105. display: flex;
  1106. flex-direction: row-reverse;
  1107. .AudioUserName {
  1108. margin-left: 10rpx;
  1109. }
  1110. }
  1111. .contentMain {
  1112. display: flex;
  1113. flex-direction: row-reverse;
  1114. align-items: center;
  1115. .content {
  1116. margin-left: 0;
  1117. margin-right: 30upx;
  1118. }
  1119. .play {
  1120. width: 50rpx;
  1121. height: 50rpx;
  1122. margin-right: 20rpx;
  1123. }
  1124. }
  1125. }
  1126. }
  1127. }
  1128. }
  1129. .bottombox {
  1130. width: 100%;
  1131. min-height: 88rpx;
  1132. .bottomhead {
  1133. width: 100%;
  1134. height: 81rpx;
  1135. border-top: 1px solid #E0E0E0;
  1136. border-bottom: 1px solid #E0E0E0;
  1137. display: flex;
  1138. justify-content: space-between;
  1139. align-items: center;
  1140. .audio-slider {
  1141. width: 87%;
  1142. display: flex;
  1143. justify-content: space-between;
  1144. align-items: center;
  1145. padding-right: 30rpx;
  1146. }
  1147. .audio-slider .slider {
  1148. width: 100%;
  1149. padding: 0px 15rpx;
  1150. box-sizing: border-box;
  1151. }
  1152. .audio-time {
  1153. width: 110rpx;
  1154. text-align: right;
  1155. font-size: 26rpx;
  1156. line-height: 28rpx;
  1157. color: #70798D;
  1158. display: flex;
  1159. justify-content: space-between;
  1160. }
  1161. .audio-play {
  1162. width: 48rpx;
  1163. height: 48rpx;
  1164. flex-shrink: 0;
  1165. }
  1166. .audio-play .image {
  1167. width: 100%;
  1168. height: 100%;
  1169. margin-left: 30rpx;
  1170. }
  1171. }
  1172. .bottomtips {
  1173. padding: 0 32rpx;
  1174. min-height: 70rpx;
  1175. display: flex;
  1176. align-items: center;
  1177. background: #FDEBC6;
  1178. }
  1179. .botbotmm {
  1180. width: 100%;
  1181. height: 88rpx;
  1182. display: flex;
  1183. align-items: center;
  1184. .item {
  1185. flex: 1;
  1186. height: 100%;
  1187. display: flex;
  1188. align-items: center;
  1189. justify-content: center;
  1190. border: 1rpx solid #E0E0E0;
  1191. border-top: none;
  1192. }
  1193. }
  1194. }
  1195. .bounced {
  1196. width: 570rpx;
  1197. background: #FFFFFF;
  1198. z-index: 1000;
  1199. border-radius: 10rpx;
  1200. position: fixed;
  1201. left: 50%;
  1202. top: 50%;
  1203. transform: translate(-50%, -50%);
  1204. .headpade {
  1205. margin-top: 10rpx;
  1206. padding: 8rpx 8rpx 8rpx 8rpx;
  1207. background: #108ee9;
  1208. color: #fff;
  1209. border-radius: 16rpx;
  1210. }
  1211. /* 50%为自身尺寸的一半 */
  1212. .jiajinghuatit {
  1213. width: 100%;
  1214. height: 68rpx;
  1215. font-size: 30rpx;
  1216. text-align: center;
  1217. line-height: 68rpx;
  1218. }
  1219. .jiajinghuaview {
  1220. padding: 18rpx 18rpx 18rpx 18rpx;
  1221. display: flex;
  1222. flex-wrap: wrap;
  1223. .jiajinghuaview1 {
  1224. padding: 8rpx 8rpx 8rpx 8rpx;
  1225. font-size: 26rpx;
  1226. border-radius: 12rpx;
  1227. border: 1px solid #979797;
  1228. margin-left: 8rpx;
  1229. }
  1230. .jighuaview2 {
  1231. padding: 8rpx 18rpx 8rpx 18rpx;
  1232. font-size: 26rpx;
  1233. border-radius: 12rpx;
  1234. border: 1px solid #979797;
  1235. margin-left: 20rpx;
  1236. margin-top: 10rpx;
  1237. display: flex;
  1238. .view1-text {
  1239. text-align: center;
  1240. }
  1241. .view1-img {
  1242. width: 50rpx;
  1243. }
  1244. }
  1245. }
  1246. .bounced3 {
  1247. height: 100rpx;
  1248. width: 100%;
  1249. margin-top: 40rpx;
  1250. border-top: 1px solid #dddddd;
  1251. display: flex;
  1252. }
  1253. .bounced3-1 {
  1254. width: 50%;
  1255. height: 100%;
  1256. text-align: center;
  1257. line-height: 100rpx;
  1258. border-right: 1px solid #dddddd;
  1259. font-size: 36rpx;
  1260. color: #999999;
  1261. }
  1262. .bounced3-2 {
  1263. width: 50%;
  1264. height: 100%;
  1265. text-align: center;
  1266. line-height: 100rpx;
  1267. font-size: 36rpx;
  1268. color: #108ee9;
  1269. }
  1270. }
  1271. .reason {
  1272. padding: 0 32rpx 32rpx;
  1273. width: 686rpx;
  1274. min-height: 350rpx;
  1275. display: flex;
  1276. flex-direction: column;
  1277. box-sizing: border-box;
  1278. .resaon-title {
  1279. padding: 24rpx 0;
  1280. flex-shrink: 0;
  1281. line-height: 32rpx;
  1282. font-size: 32rpx;
  1283. box-sizing: border-box;
  1284. }
  1285. .resaon-textbox {
  1286. padding: 12rpx 16rpx 36rpx;
  1287. position: relative;
  1288. flex-grow: 1;
  1289. box-sizing: border-box;
  1290. border: 1rpx solid #979797;
  1291. // border-radius: 16rpx;
  1292. display: flex;
  1293. textarea {
  1294. flex-grow: 1;
  1295. box-sizing: border-box;
  1296. }
  1297. .lastlength {
  1298. position: absolute;
  1299. right: 32rpx;
  1300. bottom: 12rpx;
  1301. font-size: 24rpx;
  1302. box-sizing: border-box;
  1303. }
  1304. }
  1305. .button {
  1306. margin-top: 24rpx;
  1307. width: 100%;
  1308. display: flex;
  1309. justify-content: flex-end;
  1310. text {
  1311. padding: 10rpx 35rpx;
  1312. color: #fff;
  1313. background: #008EF2;
  1314. border-radius: 16rpx;
  1315. }
  1316. }
  1317. }
  1318. }
  1319. /deep/.u-tab-item {
  1320. border: 1rpx solid #dedede;
  1321. }
  1322. </style>