index.vue 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768
  1. <template>
  2. <view v-if="is_login==1" class="container">
  3. <view class="storebox">
  4. <view class="tui-mybg-box">
  5. <view class="tui-header-center">
  6. <image :src="detail.store_logo" class="tui-avatar"></image>
  7. <view class="tui-info">
  8. <view class="tui-nickname">
  9. {{detail.title}}
  10. </view>
  11. <view class="tui-explain">企业店</view>
  12. </view>
  13. </view>
  14. </view>
  15. <view class="tui-content-box">
  16. <view class="tui-box tui-assets-box">
  17. <view class="tui-order-list tui-assets-list">
  18. <view class="tui-order-item">
  19. <view class="tui-assets-num"><text>{{detail.total_income}}</text></view>
  20. <view class="tui-assets-text">总收入</view>
  21. </view>
  22. <view class="tui-order-item">
  23. <view class="tui-assets-num">
  24. <text>{{detail.income}}</text>
  25. </view>
  26. <view class="tui-assets-text">本月收入</view>
  27. </view>
  28. <view class="tui-order-item">
  29. <view class="tui-assets-num">
  30. <text>{{detail.income}}</text>
  31. </view>
  32. <view class="tui-assets-text">可提现</view>
  33. </view>
  34. </view>
  35. </view>
  36. <view v-if="module==version3" class="tui-box tui-order-box" style="margin-top: 20rpx;">
  37. <tui-list-cell :arrow="true" padding="0" unlined :lineLeft="false"
  38. @click="navigateTo('/pagesA/my/adminstore/yuyueOrder?ptype=2')">
  39. <view class="tui-cell-header">
  40. <view class="tui-cell-title">服务订单管理</view>
  41. <view class="tui-cell-sub">全部订单</view>
  42. </view>
  43. </tui-list-cell>
  44. <view class="tui-order-list">
  45. <view class="tui-order-item" @tap="navigateTo('/pagesA/my/publicOrder/order?identity=store')">
  46. <view class="tui-icon-box">
  47. <tui-icon name="clock" :size="30" color="#ff1e02"></tui-icon>
  48. </view>
  49. <view class="tui-order-text">接单广场</view>
  50. </view>
  51. <view class="tui-order-item"
  52. @tap="navigateTo('/pagesA/my/adminstore/yuyueOrder?currentTab=2&ptype=2')">
  53. <view class="tui-icon-box">
  54. <tui-icon name="signin" :size="30" color="#666666"></tui-icon>
  55. </view>
  56. <view class="tui-order-text">已接单</view>
  57. </view>
  58. <view class="tui-order-item"
  59. @tap="navigateTo('/pagesA/my/adminstore/yuyueOrder?currentTab=3&ptype=2')">
  60. <view class="tui-icon-box">
  61. <tui-icon name="feedback" :size="30" color="#666666"></tui-icon>
  62. </view>
  63. <view class="tui-order-text">服务中</view>
  64. </view>
  65. <view class="tui-order-item"
  66. @tap="navigateTo('/pagesA/my/adminstore/yuyueOrder?currentTab=5&ptype=2')">
  67. <view class="tui-icon-box">
  68. <tui-icon name="square-fill" :size="30" color="#666666"></tui-icon>
  69. </view>
  70. <view class="tui-order-text">已完成</view>
  71. </view>
  72. </view>
  73. </view>
  74. <view class="tui-box tui-order-box" style="margin-top: 20rpx;">
  75. <tui-list-cell :arrow="true" padding="0" unlined :lineLeft="false"
  76. @click="navigateTo('/pagesA/my/adminstore/order?ptype=1')">
  77. <view class="tui-cell-header">
  78. <view class="tui-cell-title">商品订单管理</view>
  79. <view class="tui-cell-sub">全部订单</view>
  80. </view>
  81. </tui-list-cell>
  82. <view class="tui-order-list">
  83. <view class="tui-order-item"
  84. @tap="navigateTo('/pagesA/my/adminstore/order?currentTab=1&ptype=1')">
  85. <view class="tui-icon-box">
  86. <tui-icon name="signin" :size="30" color="#666666"></tui-icon>
  87. </view>
  88. <view class="tui-order-text">待付款</view>
  89. </view>
  90. <view class="tui-order-item"
  91. @tap="navigateTo('/pagesA/my/adminstore/order?currentTab=2&ptype=1')">
  92. <view class="tui-icon-box">
  93. <tui-icon name="signin" :size="30" color="#666666"></tui-icon>
  94. </view>
  95. <view class="tui-order-text">待发货</view>
  96. </view>
  97. <view class="tui-order-item"
  98. @tap="navigateTo('/pagesA/my/adminstore/order?currentTab=3&ptype=1')">
  99. <view class="tui-icon-box">
  100. <tui-icon name="feedback" :size="30" color="#666666"></tui-icon>
  101. </view>
  102. <view class="tui-order-text">已发货</view>
  103. </view>
  104. <view class="tui-order-item"
  105. @tap="navigateTo('/pagesA/my/adminstore/order?currentTab=5&ptype=1')">
  106. <view class="tui-icon-box">
  107. <tui-icon name="square-fill" :size="30" color="#666666"></tui-icon>
  108. </view>
  109. <view class="tui-order-text">已完成</view>
  110. </view>
  111. </view>
  112. </view>
  113. <view class="tui-box tui-tool-box">
  114. <tui-list-view>
  115. <tui-list-cell v-if="module==version3"
  116. @tap="navigateTo('/pagesA/my/publicOrder/timescard?identity=store')" :arrow="true">
  117. <view class="tui-item-box">
  118. <tui-icon name="bankcard" :size="24" color="#5677fc"></tui-icon>
  119. <view class="tui-list-cell_name">次卡订单</view>
  120. </view>
  121. </tui-list-cell>
  122. <tui-list-cell @tap="qrcode" :arrow="true">
  123. <view class="tui-item-box">
  124. <tui-icon name="qrcode" :size="24" color="#5677fc"></tui-icon>
  125. <view class="tui-list-cell_name">店铺二维码</view>
  126. </view>
  127. </tui-list-cell>
  128. <tui-list-cell v-if="detail.is_submitaudit!=1"
  129. @tap="navigateTo('/pagesA/my/withdraw/withdraw?mo=store')" :arrow="true">
  130. <view class="tui-item-box">
  131. <tui-icon name="wealth-fill" :size="24" color="#5677fc"></tui-icon>
  132. <text class="tui-list-cell_name">申请提现</text>
  133. </view>
  134. </tui-list-cell>
  135. <tui-list-cell @tap="navigateTo('/pagesA/my/withdraw/withdrawlog?mo=store')" :arrow="true">
  136. <view class="tui-item-box">
  137. <tui-icon name="listview" :size="24" color="#5677fc"></tui-icon>
  138. <view class="tui-list-cell_name">提现记录</view>
  139. </view>
  140. </tui-list-cell>
  141. <tui-list-cell v-if="detail.is_submitaudit!=1"
  142. @tap="navigateTo('/pagesA/my/memberbankcard/memberbankcard')" :arrow="true">
  143. <view class="tui-item-box">
  144. <tui-icon name="bankcard-fill" :size="24" color="#5677fc"></tui-icon>
  145. <view class="tui-list-cell_name">提现帐号</view>
  146. </view>
  147. </tui-list-cell>
  148. <!-- #ifdef MP-WEIXIN -->
  149. <tui-list-cell @tap="scancode" :arrow="true">
  150. <view class="tui-item-box">
  151. <tui-icon name="sweep" :size="24" color="#5677fc"></tui-icon>
  152. <view class="tui-list-cell_name">扫码核销</view>
  153. </view>
  154. </tui-list-cell>
  155. <tui-list-cell @tap="navigateTo('/pagesA/my/userInfo/setmpopenid')" :arrow="true">
  156. <view class="tui-item-box">
  157. <tui-icon name="setup" :size="24" color="#5677fc"></tui-icon>
  158. <view class="tui-list-cell_name">绑定公众号通知</view>
  159. </view>
  160. </tui-list-cell>
  161. <!-- #endif -->
  162. <tui-list-cell @tap="navigateTo('/pagesA/my/adminstore/update')" :arrow="true">
  163. <view class="tui-item-box">
  164. <tui-icon name="setup" :size="24" color="#5677fc"></tui-icon>
  165. <view class="tui-list-cell_name">修改资料</view>
  166. </view>
  167. </tui-list-cell>
  168. <tui-list-cell @tap="navigateTo('/pages/login/logout?ptype=store')" :arrow="true">
  169. <view class="tui-item-box">
  170. <tui-icon name="setup" :size="24" color="#5677fc"></tui-icon>
  171. <view class="tui-list-cell_name">安全退出</view>
  172. </view>
  173. </tui-list-cell>
  174. </tui-list-view>
  175. </view>
  176. </view>
  177. </view>
  178. <!--=======二维码 start=======-->
  179. <tui-modal custom :show="modalShow" backgroundColor="transparent" padding="0" @cancel="hideModal">
  180. <view class="tui-poster__box" :style="{marginTop:height+'px'}">
  181. <image src="/static/images/mall/icon_popup_closed.png" class="tui-close__img" @tap.stop="hideModal">
  182. </image>
  183. <image :src="qrcodeImg" v-if="qrcodeImg" class="tui-poster__img"></image>
  184. <tui-button type="danger" width="460rpx" height="80rpx" shape="circle" @click="savePic">保存图片
  185. </tui-button>
  186. <view class="tui-share__tips">保存二维图片到手机相册后,分享到您的圈子</view>
  187. </view>
  188. </tui-modal>
  189. <!--=======二维码 end=======-->
  190. <tui-tabbar mo='store' :current="current">
  191. </tui-tabbar>
  192. </view>
  193. </template>
  194. <script>
  195. export default {
  196. data() {
  197. return {
  198. module: this.$module,
  199. version2: this.$version2,
  200. version3: this.$version3,
  201. is_login: 0,
  202. modalShow: false,
  203. qrcodeImg: '',
  204. isLogin: false,
  205. top: 0, //标题图标距离顶部距离
  206. opacity: 0,
  207. scrollTop: 0.5,
  208. detail: []
  209. };
  210. },
  211. onLoad: function(options) {
  212. let _this = this;
  213. let obj = {};
  214. // #ifdef MP-WEIXIN
  215. obj = wx.getMenuButtonBoundingClientRect();
  216. // #endif
  217. // #ifdef MP-BAIDU
  218. obj = swan.getMenuButtonBoundingClientRect();
  219. // #endif
  220. // #ifdef MP-ALIPAY
  221. my.hideAddToDesktopMenu();
  222. // #endif
  223. uni.getSystemInfo({
  224. success: res => {
  225. this.width = obj.left || res.windowWidth;
  226. this.height = obj.top ? obj.top + obj.height + 8 : res.statusBarHeight + 44;
  227. this.top = obj.top ? obj.top + (obj.height - 32) / 2 : res.statusBarHeight + 6;
  228. this.scrollH = res.windowWidth * 0.6;
  229. }
  230. });
  231. },
  232. onShow() {
  233. let _this = this;
  234. _this.$request.get('adminstore.detail').then(res => {
  235. if (res.errno == 0 && res.is_login == 1) {
  236. _this.is_login = res.is_login;
  237. _this.detail = res.data;
  238. } else {
  239. uni.showModal({
  240. title: '提示',
  241. content: res.message || '请先登录!',
  242. showCancel: false,
  243. //是否显示取消按钮
  244. success: function(res) {
  245. if (res.cancel) { //点击取消,默认隐藏弹框
  246. } else {
  247. uni.reLaunch({
  248. url: "/pages/login/userlogin?ptype=store",
  249. })
  250. }
  251. }
  252. });
  253. }
  254. });
  255. },
  256. methods: {
  257. navigateTo(url) {
  258. uni.navigateTo({
  259. url: url
  260. });
  261. },
  262. initNavigation(e) {
  263. this.opacity = e.opacity;
  264. this.top = e.top;
  265. },
  266. opacityChange(e) {
  267. this.opacity = e.opacity;
  268. },
  269. scancode: function() {
  270. var _this = this;
  271. // 允许从相机和相册扫码
  272. uni.scanCode({
  273. success: function(res) {
  274. if (res.path) {
  275. uni.navigateTo({
  276. url: '/' + res.path
  277. });
  278. }
  279. //console.log('条码类型:' + res.scanType);
  280. //console.log('条码内容:' + res.path);
  281. }
  282. });
  283. },
  284. async qrcode() {
  285. const _this = this;
  286. if (this.qrcodeImg) {
  287. this.modalShow = true;
  288. return;
  289. }
  290. uni.showLoading({
  291. mask: true,
  292. title: '二维生成中...'
  293. });
  294. let qrdata = await _this.$request.post('qrcode.store', {
  295. sid: _this.detail.id,
  296. page: '',
  297. is_hyaline: true,
  298. expireHours: 1
  299. })
  300. //console.log(qrdata);
  301. if (qrdata.errno == 0) {
  302. uni.hideLoading();
  303. this.qrcodeImg = qrdata.data;
  304. setTimeout(() => {
  305. this.modalShow = true;
  306. }, 60);
  307. } else {
  308. uni.hideLoading();
  309. this.tui.toast('生成二维图片失败,请稍后再试');
  310. }
  311. },
  312. hideModal() {
  313. this.modalShow = false;
  314. },
  315. savePic() {
  316. if (this.qrcodeImg) {
  317. // #ifdef H5
  318. uni.previewImage({
  319. urls: [this.qrcodeImg]
  320. });
  321. // #endif
  322. // #ifndef H5
  323. this.sam.saveImage(this.qrcodeImg);
  324. //console.log(this.qrcodeImg);
  325. // #endif
  326. this.hideModal();
  327. }
  328. },
  329. },
  330. onPageScroll(e) {
  331. this.scrollTop = e.scrollTop;
  332. },
  333. onPullDownRefresh() {
  334. setTimeout(() => {
  335. uni.stopPullDownRefresh();
  336. }, 200);
  337. },
  338. onReachBottom: function() {
  339. }
  340. };
  341. </script>
  342. <style>
  343. .storebox {
  344. padding-bottom: 80rpx;
  345. }
  346. .tui-set-box {
  347. display: flex;
  348. align-items: center;
  349. justify-content: space-between;
  350. }
  351. .tui-icon-box {
  352. position: relative;
  353. }
  354. .tui-icon-setup {
  355. margin-left: 8rpx;
  356. }
  357. .tui-badge {
  358. position: absolute;
  359. font-size: 24rpx;
  360. height: 32rpx;
  361. min-width: 20rpx;
  362. padding: 0 6rpx;
  363. border-radius: 40rpx;
  364. right: 10rpx;
  365. top: -5rpx;
  366. transform: scale(0.8) translateX(60%);
  367. transform-origin: center center;
  368. display: flex;
  369. align-items: center;
  370. justify-content: center;
  371. z-index: 10;
  372. }
  373. .tui-badge-red {
  374. background: #f74d54;
  375. color: #fff;
  376. }
  377. .tui-badge-white {
  378. background: #fff;
  379. color: #f74d54;
  380. }
  381. .tui-badge-dot {
  382. position: absolute;
  383. height: 12rpx;
  384. width: 12rpx;
  385. border-radius: 50%;
  386. right: -12rpx;
  387. top: 0;
  388. background: #f74d54;
  389. }
  390. .tui-mybg-box {
  391. width: 100%;
  392. height: 264rpx;
  393. position: relative;
  394. background-color: #e41f19;
  395. }
  396. .tui-my-bg {
  397. width: 100%;
  398. height: 464rpx;
  399. display: block;
  400. }
  401. .tui-header-center {
  402. position: absolute;
  403. width: 100%;
  404. height: 128rpx;
  405. left: 0;
  406. top: 18rpx;
  407. padding: 0 30rpx;
  408. box-sizing: border-box;
  409. display: flex;
  410. align-items: center;
  411. }
  412. .tui-avatar {
  413. flex-shrink: 0;
  414. width: 128rpx;
  415. height: 128rpx;
  416. border-radius: 50%;
  417. display: block;
  418. }
  419. .tui-info {
  420. width: 60%;
  421. padding-left: 30rpx;
  422. }
  423. .tui-nickname {
  424. font-size: 30rpx;
  425. font-weight: 500;
  426. color: #fff;
  427. display: flex;
  428. align-items: center;
  429. }
  430. .tui-img-vip {
  431. width: 56rpx;
  432. height: 24rpx;
  433. margin-left: 18rpx;
  434. }
  435. .tui-explain {
  436. width: 80%;
  437. font-size: 24rpx;
  438. font-weight: 400;
  439. color: #fff;
  440. opacity: 0.75;
  441. padding-top: 8rpx;
  442. white-space: nowrap;
  443. overflow: hidden;
  444. text-overflow: ellipsis;
  445. }
  446. .tui-btn-edit {
  447. flex-shrink: 0;
  448. padding-right: 22rpx;
  449. }
  450. .tui-header-btm {
  451. width: 100%;
  452. padding: 0 30rpx;
  453. box-sizing: border-box;
  454. position: absolute;
  455. left: 0;
  456. top: 280rpx;
  457. display: flex;
  458. align-items: center;
  459. justify-content: space-between;
  460. color: #fff;
  461. }
  462. .tui-btm-item {
  463. flex: 1;
  464. display: flex;
  465. flex-direction: column;
  466. align-items: center;
  467. justify-content: center;
  468. }
  469. .tui-btm-num {
  470. font-size: 32rpx;
  471. font-weight: 600;
  472. position: relative;
  473. }
  474. .tui-btm-text {
  475. font-size: 24rpx;
  476. opacity: 0.85;
  477. padding-top: 4rpx;
  478. }
  479. .tui-content-box {
  480. width: 100%;
  481. padding: 0 30rpx;
  482. box-sizing: border-box;
  483. position: relative;
  484. top: -100rpx;
  485. z-index: 10;
  486. }
  487. .tui-box {
  488. width: 100%;
  489. background: #fff;
  490. box-shadow: 0 3rpx 20rpx rgba(183, 183, 183, 0.1);
  491. border-radius: 30rpx;
  492. overflow: hidden;
  493. }
  494. .tui-order-box {
  495. height: 208rpx;
  496. }
  497. .tui-cell-header {
  498. width: 100%;
  499. height: 74rpx;
  500. padding: 0 26rpx;
  501. box-sizing: border-box;
  502. display: flex;
  503. align-items: center;
  504. justify-content: space-between;
  505. }
  506. .tui-cell-title {
  507. font-size: 30rpx;
  508. line-height: 30rpx;
  509. font-weight: 600;
  510. color: #333;
  511. }
  512. .tui-cell-sub {
  513. font-size: 26rpx;
  514. font-weight: 400;
  515. color: #999;
  516. padding-right: 28rpx;
  517. }
  518. .tui-order-list {
  519. width: 100%;
  520. height: 134rpx;
  521. padding: 0 30rpx;
  522. box-sizing: border-box;
  523. display: flex;
  524. align-items: center;
  525. justify-content: space-between;
  526. }
  527. .tui-order-item {
  528. flex: 1;
  529. display: flex;
  530. flex-direction: column;
  531. align-items: center;
  532. }
  533. .tui-order-text,
  534. .tui-tool-text {
  535. font-size: 26rpx;
  536. font-weight: 400;
  537. color: #666;
  538. padding-top: 4rpx;
  539. }
  540. .tui-tool-text {
  541. font-size: 24rpx;
  542. }
  543. .tui-order-icon {
  544. width: 56rpx;
  545. height: 56rpx;
  546. display: block;
  547. }
  548. .tui-assets-box {
  549. height: 118rpx;
  550. margin-top: 20rpx;
  551. padding-top: 30rpx;
  552. }
  553. .tui-assets-list {
  554. height: 84rpx;
  555. }
  556. .tui-assets-num {
  557. font-size: 38rpx;
  558. font-weight: 500;
  559. color: #333;
  560. font-weight: bold;
  561. position: relative;
  562. }
  563. .tui-assets-text {
  564. font-size: 24rpx;
  565. font-weight: 400;
  566. color: #666;
  567. padding-top: 6rpx;
  568. }
  569. .tui-tool-box {
  570. margin-top: 20rpx;
  571. }
  572. .tui-flex-wrap {
  573. flex-wrap: wrap;
  574. height: auto;
  575. padding-bottom: 30rpx;
  576. }
  577. .tui-tool-item {
  578. width: 25%;
  579. display: flex;
  580. align-items: center;
  581. justify-content: center;
  582. flex-direction: column;
  583. padding-top: 30rpx;
  584. }
  585. .tui-tool-icon {
  586. width: 64rpx;
  587. height: 64rpx;
  588. display: block;
  589. }
  590. .tui-badge-icon {
  591. width: 66rpx;
  592. height: 30rpx;
  593. position: absolute;
  594. right: 0;
  595. transform: translateX(88%);
  596. top: -15rpx;
  597. }
  598. /*为你推荐*/
  599. .tui-product-list {
  600. display: flex;
  601. justify-content: space-between;
  602. flex-direction: row;
  603. flex-wrap: wrap;
  604. box-sizing: border-box;
  605. }
  606. .tui-product-container {
  607. width: 100%;
  608. display: flex;
  609. flex-direction: row;
  610. flex-wrap: wrap;
  611. }
  612. .tui-pro-item {
  613. background: #fff;
  614. box-sizing: border-box;
  615. overflow: hidden;
  616. border-radius: 12rpx;
  617. width: 48%;
  618. margin-left: 1%;
  619. margin-right: 1%;
  620. margin-bottom: 2%;
  621. }
  622. .tui-pro-img {
  623. width: 100%;
  624. display: block;
  625. }
  626. .tui-pro-content {
  627. display: flex;
  628. flex-direction: column;
  629. justify-content: space-between;
  630. box-sizing: border-box;
  631. padding: 20rpx;
  632. }
  633. .tui-pro-tit {
  634. color: #2e2e2e;
  635. font-size: 26rpx;
  636. word-break: break-all;
  637. overflow: hidden;
  638. text-overflow: ellipsis;
  639. display: -webkit-box;
  640. -webkit-box-orient: vertical;
  641. -webkit-line-clamp: 2;
  642. }
  643. .tui-pro-price {
  644. padding-top: 18rpx;
  645. }
  646. .tui-sale-price {
  647. font-size: 34rpx;
  648. font-weight: 500;
  649. color: #e41f19;
  650. }
  651. .tui-factory-price {
  652. font-size: 24rpx;
  653. color: #a0a0a0;
  654. text-decoration: line-through;
  655. padding-left: 12rpx;
  656. }
  657. .tui-pro-pay {
  658. padding-top: 10rpx;
  659. font-size: 24rpx;
  660. color: #656565;
  661. }
  662. .tui-item-box {
  663. width: 100%;
  664. display: flex;
  665. align-items: center;
  666. }
  667. .tui-list-cell_name {
  668. padding-left: 20rpx;
  669. display: flex;
  670. align-items: center;
  671. justify-content: center;
  672. }
  673. /*二维码modal弹层*/
  674. .tui-poster__box {
  675. width: 100%;
  676. position: relative;
  677. display: flex;
  678. justify-content: center;
  679. align-items: center;
  680. flex-direction: column;
  681. }
  682. .tui-close__img {
  683. width: 48rpx;
  684. height: 48rpx;
  685. position: absolute;
  686. right: 0;
  687. top: -60rpx;
  688. }
  689. .tui-poster__img {
  690. width: 560rpx;
  691. height: 560rpx;
  692. border-radius: 20rpx;
  693. margin-bottom: 40rpx;
  694. }
  695. .tui-share__tips {
  696. font-size: 24rpx;
  697. transform: scale(0.8);
  698. transform-origin: center center;
  699. color: #ffffff;
  700. padding-top: 12rpx;
  701. }
  702. </style>