makeDetail.vue 27 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052
  1. <template>
  2. <view class="page">
  3. <!-- 引入FontAwesome -->
  4. <view>
  5. <link rel="stylesheet"
  6. href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
  7. </view>
  8. <!-- 权限申请提示 -->
  9. <view v-if="showRights" class="permission-tip">
  10. <text class="permission-title">正在获取相机、存储权限</text>
  11. <text class="permission-desc">该权限用于获取设备拍摄或获取本地应用相册,进行头像或图片上传。</text>
  12. </view>
  13. <!-- 顶部导航栏 -->
  14. <view class="custom-navbar">
  15. <view class="navbar-left" @click="goBack">
  16. <text class="fa fa-angle-left"></text>
  17. </view>
  18. <view class="navbar-center">
  19. <view class="navbar-title" v-if="false">
  20. <image class="navbar-avatar" :src="myinfo.avator" mode="aspectFill"></image>
  21. <text class="navbar-text">{{ myinfo.nickname }}</text>
  22. <text class="navbar-badge" v-if="myinfo.is_vip > 0">VIP</text>
  23. </view>
  24. </view>
  25. <view class="navbar-right" @click="showActionSheet">
  26. <text class="fa fa-ellipsis-h"></text>
  27. </view>
  28. </view>
  29. <view class="topStatusBar inProgress" v-if="fileInformation.status == 2"
  30. :class="queueDetail.task_type == 1 ? 'mb20' : ''"> 审核中</view>
  31. <view class="topStatusBar fail" v-if="fileInformation.status == 4"
  32. :class="queueDetail.task_type == 2 ? 'mb20' : ''" @click="openConfirmationBox"> 审核未通过,点击查看原因</view>
  33. <!-- 灵感 -->
  34. <template v-if="queueDetail.task_type == 1">
  35. <view class="inspiration-content" v-if="home_image">
  36. <image v-if="home_image" src="../../static/makedetail/cz_img_zhanshi.png" mode="widthFix"></image>
  37. <image :src="home_image" class="inspirationPictures" mode="widthFix"></image>
  38. </view>
  39. </template>
  40. <!-- 音乐 -->
  41. <template v-else-if="queueDetail.task_type == 2">
  42. <view class="musicContentBox">
  43. <view class="headCard">
  44. <image :src="home_image" class="songCover"></image>
  45. <view class="songInfo">
  46. <view class="songTitle">{{ addBrackets(queueDetail.song_name) }}</view>
  47. <view class="songTag">
  48. <view class="tag" v-for="(item, index) in commaToArray(queueDetail.style)"
  49. :key="index + item">{{ item }}</view>
  50. </view>
  51. </view>
  52. <template v-if="queueDetail.task_type == 2 && queueDetail.status >= 9">
  53. <image @click="toggleAudio" v-if="isPlaying" src="@/static/makedetail/cz_icon_zanting.png"
  54. class="playerButton"></image>
  55. <image @click="toggleAudio" v-else src="@/static/makedetail/cz_icon_bofang.png"
  56. class="playerButton"></image>
  57. </template>
  58. </view>
  59. <view class="contentHeader">
  60. <view class="musicContent">
  61. <text style="max-width: 350rpx; display: inline-block;"> {{ queueDetail.description }}</text>
  62. <image class="roll" src="@/static/icon/roll.png"></image>
  63. </view>
  64. <view class="maskLayer"></view>
  65. </view>
  66. </view>
  67. </template>
  68. <!-- 作品描述 -->
  69. <view class="workDescription">
  70. <view class="workDescription-title">
  71. <view>创作描述 </view>
  72. <!-- <image class="pen" src="@/static/icon/wd_icon_bianji.png"></image> -->
  73. </view>
  74. <view class="workDescription-content">
  75. {{ queueDetail.lyrics || queueDetail.description }}
  76. </view>
  77. </view>
  78. <!-- 作品描述 -->
  79. <view class="workDescription" v-if="queueDetail.content">
  80. <view class="workDescription-title">
  81. <view>创作说明 </view>
  82. <!-- <image class="pen" src="@/static/icon/wd_icon_bianji.png"></image> -->
  83. </view>
  84. <view class="workDescription-content">
  85. {{ noteContent }}
  86. </view>
  87. </view>
  88. <view class="thread2"></view>
  89. <!-- 音频元素 -->
  90. <audio id="audioPlayer" :src="queueDetail.result_audio" style="display:none;"></audio>
  91. <!-- 用于处理图片像素的隐藏canvas -->
  92. <canvas canvas-id="pixelCanvas"
  93. style="width: 10px; height: 10px; position: absolute; left: -100px; top: -100px;"></canvas>
  94. <!-- 底部漂浮栏 -->
  95. <view class="floating-bar"
  96. v-if="queueDetail.status == 9 && (fileInformation.status == 3 || fileInformation.status == 0)">
  97. <view class="floating-bar-content">
  98. <view class="add-note-btn" @click="openContentPopUpWindow">
  99. <text>添加说明</text>
  100. </view>
  101. <view class="publish-btn" @click="publishWork">
  102. <text>公布作品</text>
  103. </view>
  104. </view>
  105. </view>
  106. <!-- 自定义 ActionSheet -->
  107. <ActionSheet ref="actionSheet" :items="[
  108. { text: '分享作品', icon: '../../static/icon/cz_icon_fenxiangzuopin.png' },
  109. { text: '修改封面', icon: '../../static/icon/cz_icon_xiugaifengmian.png' },
  110. { text: '删除作品', icon: '../../static/icon/sy_icon_shanchu.png', danger: true }
  111. ]" @select="handleActionSelect" @cancel="handleActionCancel" />
  112. <NicknamePopup title="添加说明" subtitle="" class="openContentPopUpWindow" ref="openContentPopUpWindow">
  113. <template v-slot:content>
  114. <uv-textarea v-model="noteContent" maxlength="500" count placeholder="请描述你添加的内容"></uv-textarea>
  115. <view class="btn-box" @click="confirmAddNote">确认</view>
  116. </template>
  117. </NicknamePopup>
  118. <CustomPopup ref="confirmationBox">
  119. <view class="failureReason">
  120. <view class="title"> 审核未通关</view>
  121. <view class="reviewContent">
  122. <uv-parse :content="fileInformation.reason"></uv-parse>
  123. </view>
  124. <view class="btn-box" @click="closeConfirmationBox">知道了</view>
  125. </view>
  126. </CustomPopup>
  127. <DialogBox ref="customConfirm"></DialogBox>
  128. <SharePopup :visible="showShare" :userId="userId" :share-title="shareTitle" :share-desc="shareDesc"
  129. :share-img="shareImg" view="makeDetail" @close="showShare = false" />
  130. </view>
  131. </template>
  132. <script>
  133. import previewImage from '@/components/kxj-previewImage/kxj-previewImage.vue'; //引用插件
  134. import NicknamePopup from '@/components//NicknamePopup/NicknamePopup.vue';
  135. import CustomPopup from '@/components/CustomPopup/CustomPopup.vue';
  136. import ActionSheet from '@/components/ActionSheet/ActionSheet.vue';
  137. import SharePopup from "@/components/SharePopup/SharePopup.vue";
  138. import permission from '@/common/permission.js';
  139. export default {
  140. components: {
  141. previewImage,
  142. NicknamePopup,
  143. CustomPopup,
  144. ActionSheet,
  145. SharePopup,
  146. },
  147. data() {
  148. return {
  149. title: '',
  150. arcID: 0,
  151. selImg: 0,
  152. home_image: '',
  153. myinfo: {},
  154. tag_list: [],
  155. image_list: [],
  156. imgs: [],
  157. descs: [],
  158. isPlaying: false,
  159. audioPlayer: null,
  160. showNotePopup: false,
  161. noteContent: '',
  162. pixelColor: null, // 存储像素颜色值
  163. queueId: 0,
  164. showShare: false,
  165. shareTitle: "",
  166. shareDesc: "",
  167. shareImg: "",
  168. userId: 0,
  169. showRights: false,
  170. // 队列详情数据
  171. queueDetail: {
  172. id: 0,
  173. sso_id: 0,
  174. task_type: 1,
  175. title: '',
  176. description: '',
  177. action: '',
  178. environment: '',
  179. subject: '',
  180. style: '',
  181. song_name: '',
  182. lyrics: '',
  183. generate_uuid: '',
  184. result_images: '',
  185. result_audio: '',
  186. queue_position: 0,
  187. status: 1,
  188. generate_status: 1,
  189. points_cost: 0,
  190. error_msg: '',
  191. create_time: '',
  192. update_time: '',
  193. all_position: 0
  194. },
  195. fileInformation: {
  196. age: 0,
  197. author: "",
  198. avator: "",
  199. city: "",
  200. content: "",
  201. create_time: "",
  202. dtime: "",
  203. id: 0,
  204. images: "",
  205. is_like: 0,
  206. is_vip: 0,
  207. like_count: 0,
  208. lyrics: "",
  209. nickname: "",
  210. num_comment: 0,
  211. num_like: 0,
  212. num_view: 0,
  213. queue_id: 0,
  214. reason: "",
  215. result_audio: "",
  216. sex: 0,
  217. sso_id: 0,
  218. status: 0, //1是成功 2是审核中 4是失败 3是未公布也就是私人状态
  219. task_type: 0,
  220. tdate: "",
  221. title: "",
  222. userID: 0,
  223. xinzuo: "",
  224. },
  225. myinfo: {},
  226. offsetY: 0,
  227. isDragging: false,
  228. startY: 0,
  229. initialOffsetY: 0,
  230. }
  231. },
  232. onLoad(parms) {
  233. let self = this;
  234. this.arcID = parms.id;
  235. this.queueId = parms.queueId;
  236. this.getMyInfo();
  237. },
  238. onShow() {
  239. this.loadData();
  240. this.getInfoData();
  241. },
  242. onReady() {
  243. // 获取音频元素
  244. this.audioPlayer = uni.createInnerAudioContext();
  245. this.audioPlayer.onEnded(() => {
  246. this.isPlaying = false;
  247. });
  248. },
  249. onUnload() {
  250. // 页面卸载时停止音频播放
  251. if (this.audioPlayer) {
  252. this.audioPlayer.stop();
  253. this.audioPlayer.destroy();
  254. }
  255. },
  256. mounted() {
  257. },
  258. methods: {
  259. openConfirmationBox() {
  260. this.$refs.confirmationBox.open();
  261. },
  262. closeConfirmationBox() {
  263. this.$refs.confirmationBox.close();
  264. },
  265. openContentPopUpWindow() {
  266. this.$refs.openContentPopUpWindow.open();
  267. },
  268. closeContentPopUpWindow() {
  269. this.$refs.openContentPopUpWindow.close();
  270. },
  271. // 获取图片第一个像素的RGB值
  272. getImagePixelColor() {
  273. console.log("图片加载完成,准备获取像素颜色");
  274. // 清空之前的颜色值,进入加载状态
  275. this.pixelColor = null;
  276. // 如果是默认图片或空图片,则直接返回
  277. if (!this.home_image || this.home_image === '../../static/home/avator.png') {
  278. console.log("无有效图片,不获取像素颜色");
  279. return;
  280. }
  281. // 使用uni.getImageInfo获取图片信息
  282. uni.getImageInfo({
  283. src: this.home_image,
  284. success: (res) => {
  285. console.log("图片信息:", res);
  286. // 创建临时canvas绘制上下文
  287. const ctx = uni.createCanvasContext('pixelCanvas', this);
  288. // 修改绘制参数,确保只绘制图片左上角的一小块区域
  289. // drawImage(图片路径, 源图片裁剪x, 源图片裁剪y, 源图片裁剪宽度, 源图片裁剪高度, canvas目标x, canvas目标y, canvas目标宽度, canvas目标高度)
  290. // 这里我们只从源图片左上角裁剪10x10的区域,绘制到canvas的左上角
  291. ctx.drawImage(res.path, 0, 0, 10, 10, 0, 0, 10, 10);
  292. ctx.draw(false, () => {
  293. // 绘制完成后,获取像素数据
  294. setTimeout(() => { // 添加短暂延迟确保绘制完成
  295. uni.canvasGetImageData({
  296. canvasId: 'pixelCanvas',
  297. x: 0, // 获取(0,0)位置的像素
  298. y: 0,
  299. width: 1,
  300. height: 1,
  301. success: (res) => {
  302. // 获取像素RGB值
  303. this.pixelColor = {
  304. r: res.data[0],
  305. g: res.data[1],
  306. b: res.data[2],
  307. a: res.data[3]
  308. };
  309. console.log("第一个像素的RGB值:", this
  310. .pixelColor);
  311. },
  312. fail: (err) => {
  313. console.error("获取像素数据失败:", err);
  314. // 显示错误提示
  315. uni.showToast({
  316. title: '获取颜色失败',
  317. icon: 'none',
  318. duration: 2000
  319. });
  320. }
  321. });
  322. }, 100);
  323. });
  324. },
  325. fail: (err) => {
  326. console.error("获取图片信息失败:", err);
  327. // 显示错误提示
  328. uni.showToast({
  329. title: '图片加载失败',
  330. icon: 'none',
  331. duration: 2000
  332. });
  333. }
  334. });
  335. },
  336. // 返回上一页
  337. goBack() {
  338. uni.navigateBack({
  339. delta: 1
  340. });
  341. },
  342. getMyInfo() {
  343. uni.request({
  344. url: this.$apiHost + '/My/getnum',
  345. method: 'GET',
  346. header: {
  347. 'content-type': 'application/json',
  348. 'sign': getApp().globalData.headerSign
  349. },
  350. data: {
  351. uuid: getApp().globalData.uuid
  352. },
  353. success: (res) => {
  354. console.log("获取用户信息:", res.data);
  355. this.myinfo = res.data
  356. }
  357. })
  358. },
  359. selPhoto(item, sel) {
  360. this.selImg = sel;
  361. this.home_image = this.image_list[sel];
  362. },
  363. toArr(imgs) {
  364. let arr = imgs.split("|");
  365. return arr;
  366. },
  367. previewOpen(imgs1, index) {
  368. this.imgs = imgs1.split("|");
  369. setTimeout(() => this.$refs.previewImage.open(index), 0)
  370. // 传入当前选中的图片地址或序号
  371. return; //如需测试和uni原生预览差别可注释这两行
  372. },
  373. // 切换音频播放状态
  374. toggleAudio() {
  375. if (!this.queueDetail.result_audio) return;
  376. if (this.isPlaying) {
  377. this.audioPlayer.pause();
  378. this.isPlaying = false;
  379. } else {
  380. this.audioPlayer.src = this.queueDetail.result_audio;
  381. this.audioPlayer.play();
  382. this.isPlaying = true;
  383. }
  384. },
  385. // 获取进度条宽度
  386. getProgressWidth() {
  387. if (this.queueDetail.all_position === 0) return '0%';
  388. const progress = (1 - (this.queueDetail.queue_position / this.queueDetail.all_position)) * 100;
  389. return `${progress}%`;
  390. },
  391. // 加载数据
  392. loadData() {
  393. uni.showLoading({
  394. title: '加载中...'
  395. });
  396. let that = this;
  397. if (this.queueId) {
  398. that.workInformation()
  399. }
  400. uni.request({
  401. url: this.$apiHost + '/WorkAI/getQueueDetail',
  402. data: {
  403. uuid: getApp().globalData.uuid,
  404. id: this.arcID
  405. },
  406. header: {
  407. "content-type": "application/json",
  408. 'sign': getApp().globalData.headerSign
  409. },
  410. success: (res) => {
  411. console.log("队列详情:", res.data);
  412. if (res.data.success === "yes") {
  413. // 更新队列详情
  414. this.queueDetail = res.data.data;
  415. this.noteContent = res.data.data.content;
  416. // 更新图片列表
  417. if (this.queueDetail.result_images && this.queueDetail.result_images !== "") {
  418. this.image_list = this.queueDetail.result_images.split(",");
  419. this.home_image = this.image_list[0];
  420. // 当图片更新后,手动触发获取像素颜色(因为图片可能从缓存加载,不会触发@load事件)
  421. // setTimeout(() => {
  422. // that.getImagePixelColor();
  423. // }, 500);
  424. } else {
  425. this.home_image = "../../static/home/avator.png";
  426. }
  427. // 如果是音频类型,设置音频源
  428. if (this.queueDetail.task_type == 2 && this.queueDetail.result_audio) {
  429. this.audioPlayer.src = this.queueDetail.result_audio;
  430. }
  431. // 更新分享相关数据
  432. this.shareTitle = res.data.data.song_name || '萌创星球';
  433. this.shareDesc = res.data.data.description;
  434. this.shareImg = this.home_image;
  435. this.userId = res.data.data.sso_id;
  436. console.log(this.shareTitle, 9, this.shareDesc, 2, this.shareImg, 3, this.userId, 4, '分享数据');
  437. } else {
  438. uni.showToast({
  439. title: '获取详情失败',
  440. icon: 'none'
  441. });
  442. }
  443. },
  444. complete: () => {
  445. uni.hideLoading();
  446. },
  447. fail: (e) => {
  448. console.log("请求失败:", e);
  449. uni.showToast({
  450. title: '网络请求失败',
  451. icon: 'none'
  452. });
  453. }
  454. });
  455. },
  456. // 加载作品信息
  457. workInformation() {
  458. uni.request({
  459. url: this.$apiHost + '/Work/getinfo',
  460. data: {
  461. uuid: getApp().globalData.uuid,
  462. id: this.queueId
  463. },
  464. header: {
  465. "content-type": "application/json",
  466. 'sign': getApp().globalData.headerSign
  467. },
  468. success: (res) => {
  469. console.log("文章信息:", res.data);
  470. if (res.data.success === "yes") {
  471. // 更新文章信息
  472. this.fileInformation = res.data.data;
  473. } else {
  474. }
  475. },
  476. complete: (com) => {
  477. // uni.hideLoading();
  478. },
  479. fail: (e) => {
  480. console.log("请求失败:", e);
  481. uni.showToast({
  482. title: '网络请求失败',
  483. icon: 'none'
  484. });
  485. }
  486. });
  487. },
  488. showActionSheet() {
  489. this.$refs.actionSheet.show();
  490. },
  491. handleActionSelect(index, item) {
  492. console.log('ActionSheet selected index:', item.text,);
  493. switch (item.text) {
  494. case '分享作品':
  495. this.showShare = true;
  496. break;
  497. case '修改封面':
  498. // 修改封面
  499. if (this.queueDetail.status == 9 && (this.fileInformation.status == 3 || this.fileInformation.status == 0)) {
  500. this.editCover();
  501. } else {
  502. if (this.queueDetail.status == 9) {
  503. uni.showToast({
  504. title: '作品已完成,无法修改封面!',
  505. icon: 'none'
  506. });
  507. } else {
  508. uni.showToast({
  509. title: '作品未完成,无法修改封面!',
  510. icon: 'none'
  511. });
  512. }
  513. break;
  514. }
  515. break;
  516. case '删除作品':
  517. // 删除作品
  518. this.deleteWork();
  519. break;
  520. }
  521. },
  522. handleActionCancel() {
  523. console.log('ActionSheet cancelled');
  524. },
  525. // 修改封面
  526. async editCover() {
  527. var _self = this;
  528. const hasPermission = await this.checkCameraPermission();
  529. if (!hasPermission) return;
  530. console.log(1111111);
  531. uni.chooseImage({
  532. count: 1,
  533. sizeType: ['compressed'],
  534. sourceType: ['album', 'camera'],
  535. success: async function (res) {
  536. console.log('res:', res)
  537. if (res.tempFilePaths.length > 0) {
  538. _self.imglocal = res.tempFilePaths[0]
  539. const tempFilePaths = res.tempFilePaths[0];
  540. console.log('tempFilePaths:', tempFilePaths);
  541. const uploadTask = uni.uploadFile({
  542. url: _self.$apiHost + '/Xweb/upload_img?skey=' + _self.skey,
  543. filePath: res.tempFilePaths[0],
  544. name: 'file',
  545. success: async function (uploadFileRes) {
  546. let resdata = JSON.parse(uploadFileRes.data)
  547. console.log('Success11:', uploadFileRes);
  548. console.log('Success21:', resdata);
  549. if (resdata.success == 'yes') {
  550. // 调用修改封面接口
  551. uni.request({
  552. url: _self.$apiHost + '/WorkAI/queueAction',
  553. method: 'GET',
  554. data: {
  555. uuid: getApp().globalData.uuid,
  556. act: 'editImg',
  557. result_images: resdata.url,
  558. id: _self.arcID
  559. },
  560. header: {
  561. 'content-type': 'application/json',
  562. 'sign': getApp().globalData.headerSign
  563. },
  564. success: async (res) => {
  565. if (res.data.success === "yes") {
  566. _self.home_image = resdata.url;
  567. uni.showToast({
  568. title: '修改封面成功',
  569. icon: 'success'
  570. });
  571. } else {
  572. uni.showToast({
  573. title: '修改封面失败',
  574. icon: 'none'
  575. });
  576. }
  577. },
  578. fail: () => {
  579. uni.showToast({
  580. title: '修改封面失败',
  581. icon: 'none'
  582. });
  583. }
  584. });
  585. }
  586. },
  587. fail: function (uploadFileFail) {
  588. console.log('Error:', uploadFileFail.data);
  589. uni.showToast({
  590. title: '图片上传失败',
  591. icon: 'none'
  592. });
  593. }
  594. });
  595. }
  596. },
  597. error: function (e) {
  598. console.log(e);
  599. uni.showToast({
  600. title: '选择图片失败',
  601. icon: 'none'
  602. });
  603. }
  604. });
  605. },
  606. // 删除作品
  607. deleteWork() {
  608. this.$refs["customConfirm"]
  609. .confirm({
  610. title: "确认删除",
  611. content: "确定要删除这个作品吗?",
  612. DialogType: "inquiry",
  613. btn1: "再考虑一下",
  614. btn2: "确认删除",
  615. animation: 0,
  616. })
  617. .then((res) => {
  618. console.log(res);
  619. if (res.confirm) {
  620. // 用户点击确定,执行删除操作
  621. this.confirmDelete();
  622. }
  623. }, () => { });
  624. },
  625. // 确认删除
  626. confirmDelete() {
  627. uni.showLoading({
  628. title: '删除中...'
  629. });
  630. let url = this.$apiHost + '/WorkAI/queueAction';
  631. let id = this.arcID;
  632. if (this.queueDetail.status == 9) {
  633. url = this.$apiHost + '/Work/doAct';
  634. id = this.queueId;
  635. }
  636. uni.request({
  637. url,
  638. method: 'GET',
  639. data: {
  640. uuid: getApp().globalData.uuid,
  641. act: 'del',
  642. id,
  643. },
  644. header: {
  645. 'content-type': 'application/json',
  646. 'sign': getApp().globalData.headerSign
  647. },
  648. success: (res) => {
  649. uni.hideLoading();
  650. if (res.data.success === "yes") {
  651. uni.showToast({
  652. title: '删除成功',
  653. icon: 'success'
  654. });
  655. // 删除成功后返回上一页
  656. setTimeout(() => {
  657. uni.navigateBack({
  658. delta: 1
  659. });
  660. }, 1500);
  661. } else {
  662. uni.showToast({
  663. title: '删除失败',
  664. icon: 'none'
  665. });
  666. }
  667. },
  668. fail: () => {
  669. uni.hideLoading();
  670. uni.showToast({
  671. title: '删除失败',
  672. icon: 'none'
  673. });
  674. }
  675. });
  676. },
  677. // 显示添加说明弹窗
  678. showAddNotePopup() {
  679. this.showNotePopup = true;
  680. },
  681. // 关闭添加说明弹窗
  682. closeAddNotePopup() {
  683. this.showNotePopup = false;
  684. },
  685. // 确认添加说明
  686. confirmAddNote() {
  687. if (!this.noteContent.trim()) {
  688. uni.showToast({
  689. title: '请输入说明内容',
  690. icon: 'none'
  691. });
  692. return;
  693. }
  694. uni.showLoading({
  695. title: '保存中...'
  696. });
  697. uni.request({
  698. url: this.$apiHost + '/WorkAI/queueAction',
  699. method: 'GET',
  700. data: {
  701. uuid: getApp().globalData.uuid,
  702. act: 'editContent',
  703. content: this.noteContent,
  704. id: this.arcID
  705. },
  706. header: {
  707. 'content-type': 'application/json',
  708. 'sign': getApp().globalData.headerSign
  709. },
  710. success: (res) => {
  711. uni.hideLoading();
  712. if (res.data.success === "yes") {
  713. uni.showToast({
  714. title: res.data.str,
  715. icon: 'success'
  716. });
  717. this.noteContent = '';
  718. this.closeContentPopUpWindow();
  719. // 重新加载数据
  720. this.loadData();
  721. } else {
  722. uni.showToast({
  723. title: res.data.str,
  724. icon: 'none'
  725. });
  726. }
  727. },
  728. fail: () => {
  729. uni.hideLoading();
  730. uni.showToast({
  731. title: '添加说明失败',
  732. icon: 'none'
  733. });
  734. }
  735. });
  736. },
  737. // 发布作品
  738. publishWork() {
  739. uni.showLoading({
  740. title: '发布中...'
  741. });
  742. uni.request({
  743. url: this.$apiHost + '/WorkAI/queueAction',
  744. method: 'GET',
  745. data: {
  746. uuid: getApp().globalData.uuid,
  747. act: 'fabu',
  748. id: this.arcID
  749. },
  750. header: {
  751. 'content-type': 'application/json',
  752. 'sign': getApp().globalData.headerSign
  753. },
  754. success: (res) => {
  755. console.log("resddd", res.data);
  756. uni.hideLoading();
  757. if (res.data.success === "yes") {
  758. uni.showToast({
  759. title: '发布成功',
  760. icon: 'success'
  761. });
  762. // 重新加载数据
  763. // this.loadData();
  764. } else {
  765. uni.showToast({
  766. title: res.data.str || '发布失败',
  767. icon: 'none'
  768. });
  769. }
  770. },
  771. fail: () => {
  772. uni.hideLoading();
  773. uni.showToast({
  774. title: '发布失败',
  775. icon: 'none'
  776. });
  777. },
  778. complete: () => {
  779. setTimeout(() => {
  780. uni.navigateBack({
  781. delta: 1
  782. });
  783. }, 800);
  784. }
  785. });
  786. },
  787. // 新增过滤器方法
  788. commaToArray(str) {
  789. if (!str) return '';
  790. return str.split(',');
  791. },
  792. // 新增过滤器方法
  793. addBrackets(str) {
  794. if (!str) return '';
  795. if (!str.startsWith('《')) {
  796. str = '《' + str;
  797. }
  798. if (!str.endsWith('》')) {
  799. str = str + '》';
  800. }
  801. return str;
  802. },
  803. getInfoData() {
  804. uni.request({
  805. url: this.$apiHost + '/Member/getinfoData',
  806. data: {
  807. uuid: getApp().globalData.uuid
  808. },
  809. header: {
  810. 'content-type': 'application/json'
  811. },
  812. success: (res) => {
  813. console.log('用户信息', res.data);
  814. }
  815. });
  816. },
  817. async chooseImage(sourceType) {
  818. try {
  819. let hasPermission = false;
  820. if (sourceType === 'camera') {
  821. hasPermission = await this.checkCameraPermission();
  822. } else if (sourceType === 'album') {
  823. hasPermission = await this.checkPhotoLibraryPermission();
  824. }
  825. if (!hasPermission) {
  826. uni.showToast({
  827. title: '未获得权限',
  828. icon: 'none'
  829. });
  830. return;
  831. }
  832. uni.chooseImage({
  833. count: 1,
  834. sizeType: ['compressed'],
  835. sourceType: [sourceType],
  836. success: async (res) => {
  837. console.log('res:', res)
  838. if (res.tempFilePaths.length > 0) {
  839. this.imglocal = res.tempFilePaths[0]
  840. const tempFilePath = res.tempFilePaths[0];
  841. console.log('tempFilePaths:', tempFilePath);
  842. await this.uploadImage(tempFilePath);
  843. }
  844. },
  845. fail: (err) => {
  846. console.error('选择图片失败:', err);
  847. uni.showToast({
  848. title: '选择图片失败',
  849. icon: 'none'
  850. });
  851. }
  852. });
  853. } catch (error) {
  854. console.error('权限检查失败:', error);
  855. uni.showToast({
  856. title: '权限检查失败',
  857. icon: 'none'
  858. });
  859. }
  860. },
  861. async checkCameraPermission() {
  862. const hasPermission = await permission.request(permission.PermissionType.CAMERA, {
  863. title: '“萌创星球”想访问你的相机',
  864. describe: '萌创星球想访问您的摄像头,便于拍摄获取图片来替换原有作品封面图'
  865. });
  866. return hasPermission;
  867. },
  868. async checkPhotoLibraryPermission() {
  869. const hasPermission = await permission.request(permission.PermissionType.PHOTO_LIBRARY, {
  870. title: '“萌创星球”想访问你的照片图库',
  871. describe: '萌创星球想访问您本地照片图库,便于获取图片来替换原有作品封面图'
  872. });
  873. return hasPermission;
  874. },
  875. uploadImage(tempFilePath) {
  876. const _self = this;
  877. const uploadTask = uni.uploadFile({
  878. url: _self.$apiHost + '/Xweb/upload_img?skey=' + _self.skey,
  879. filePath: tempFilePath,
  880. name: 'file',
  881. success: function (uploadFileRes) {
  882. let resdata = JSON.parse(uploadFileRes.data)
  883. console.log('Success11:', uploadFileRes);
  884. console.log('Success21:', resdata);
  885. if (resdata.success == 'yes') {
  886. // 调用修改封面接口
  887. uni.request({
  888. url: _self.$apiHost + '/WorkAI/queueAction',
  889. method: 'GET',
  890. data: {
  891. uuid: getApp().globalData.uuid,
  892. act: 'editImg',
  893. result_images: resdata.url,
  894. id: _self.arcID
  895. },
  896. header: {
  897. 'content-type': 'application/json',
  898. 'sign': getApp().globalData.headerSign
  899. },
  900. success: async (res) => {
  901. if (res.data.success === "yes") {
  902. _self.showRights = false;
  903. _self.home_image = resdata.url;
  904. uni.showToast({
  905. title: '修改封面成功',
  906. icon: 'success'
  907. });
  908. } else {
  909. uni.showToast({
  910. title: '修改封面失败',
  911. icon: 'none'
  912. });
  913. }
  914. },
  915. fail: () => {
  916. uni.showToast({
  917. title: '修改封面失败',
  918. icon: 'none'
  919. });
  920. }
  921. });
  922. }
  923. },
  924. fail: function (uploadFileFail) {
  925. console.error('Error:', uploadFileFail);
  926. uni.showToast({
  927. title: '上传失败,请重试',
  928. icon: 'none',
  929. duration: 1500
  930. });
  931. },
  932. complete: () => {
  933. console.log('Upload complete');
  934. }
  935. });
  936. // 显示上传进度
  937. uploadTask.onProgressUpdate((res) => {
  938. console.log('上传进度' + res.progress);
  939. console.log('已经上传的数据长度' + res.totalBytesSent);
  940. console.log('预期需要上传的数据总长度' + res.totalBytesExpectedToSend);
  941. });
  942. },
  943. editCover() {
  944. uni.showActionSheet({
  945. itemList: ['拍照', '从相册选择'],
  946. success: (res) => {
  947. const sourceType = res.tapIndex === 0 ? 'camera' : 'album';
  948. this.chooseImage(sourceType);
  949. }
  950. });
  951. },
  952. }
  953. }
  954. </script>
  955. <style scoped lang="scss">
  956. @import 'makeDetail.scss';
  957. .openContentPopUpWindow {
  958. ::v-deep.uv-textarea {
  959. width: 694rpx !important;
  960. border-radius: 20rpx !important;
  961. border: 1rpx solid #000000 !important;
  962. margin: 0 auto;
  963. margin-bottom: 44rpx;
  964. min-height: 300rpx;
  965. }
  966. }
  967. .permission-tip {
  968. width: 100%;
  969. height: 300rpx;
  970. background-color: rgba(255, 255, 255, 0.9);
  971. position: fixed;
  972. top: 0;
  973. display: flex;
  974. flex-direction: column;
  975. justify-content: center;
  976. align-items: center;
  977. z-index: 999;
  978. .permission-title {
  979. width: 90%;
  980. color: #000000;
  981. font-size: 38rpx;
  982. text-align: left;
  983. padding: 10rpx 20rpx;
  984. padding-top: 10rpx;
  985. }
  986. .permission-desc {
  987. width: 90%;
  988. color: #666666;
  989. font-size: 28rpx;
  990. text-align: left;
  991. padding: 10rpx 20rpx;
  992. }
  993. }
  994. </style>