index.vue 37 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417
  1. <template>
  2. <view class="home">
  3. <view class="top_view">
  4. <u-navbar :title-bold="true" :border-bottom="false"
  5. :background="{ background: `rgba(64, 118, 214, ${scroll_top / 100})` }" :is-back="false" title=" ">
  6. <view class="title">{{ enterprise.enterpriseName || '工作台' }}</view>
  7. </u-navbar>
  8. <!-- <uniStatusBar></uniStatusBar> -->
  9. <!-- <view class="title">{{ enterprise.enterpriseName || '--' }}</view> -->
  10. <view class="user_img clearfix">
  11. <view class="img">
  12. <image :src="enterprise.logo" mode="aspectFill"></image>
  13. <span class="img_title">{{ userInfo.name }}</span>
  14. </view>
  15. <view class="Icon">
  16. <view class="btn-li" @click="goPage('/pages/enterprise/index', 'reLaunch')">
  17. <u-icon name="qiehuan-" custom-prefix="custom-icon" size="36" color="#4076D6"></u-icon>
  18. </view>
  19. <view class="btn-li" @click="overview('reset')">
  20. <u-icon name="shuaxin" size="36" color="#4076D6" custom-prefix="custom-icon"></u-icon>
  21. </view>
  22. <view class="btn-li" @click="goPage('/pages/index/WxCode')">
  23. <u-icon name="erweima" size="32" custom-prefix="custom-icon" color="#4076D6"></u-icon>
  24. </view>
  25. <view class="btn-li" @click="goPage('/pagesT/notice/notice')">
  26. <u-icon name="bell" size="36" color="#4076D6"></u-icon>
  27. </view>
  28. <view class="btn-li" @click="logout">
  29. <u-icon name="zhuxiao" custom-prefix="custom-icon" size="34" color="#4076D6"></u-icon>
  30. </view>
  31. </view>
  32. </view>
  33. <!-- <view class="top_money clearfix" v-if="$accessCheck($Access.overview)">
  34. <view class="float_left" style="font-weight: 400;">
  35. <u-icon name="jinbi" size="36" color="#ffffff" margin-left="12" label-color="#ffffff" label-size="24" label="应收账款" custom-prefix="custom-icon"></u-icon>
  36. </view>
  37. <view class="float_right">
  38. <text class="rmb-icon">¥</text>
  39. {{ $utils.formatNub(now.totalShouldReceive) }}
  40. </view>
  41. </view> -->
  42. </view>
  43. <!-- <view class="top_bottom" v-if="$accessCheck($Access.overview)">
  44. <view class="money-li">
  45. <view>
  46. <u-icon name="jinbi" size="36" color="#f69844" margin-left="12" label-color="#BABBC6" label-size="24" label="应付账款" custom-prefix="custom-icon"></u-icon>
  47. </view>
  48. <view class="num">
  49. ¥
  50. <text class="written">{{ $utils.formatNub(now.totalShouldPay) }}</text>
  51. </view>
  52. </view>
  53. <view class="money-li">
  54. <navigator open-type="switchTab" url="/pages/customer/CustomerList">
  55. <view>
  56. <u-icon
  57. name="customer"
  58. size="36"
  59. color="#7a15ff"
  60. margin-left="12"
  61. label-color="#BABBC6"
  62. label-size="24"
  63. label="当前客户数"
  64. custom-prefix="custom-icon"
  65. ></u-icon>
  66. <view class="num">
  67. <text class="written">{{ Number(now.customerTotalNum) || 0 }}</text>
  68. </view>
  69. </view>
  70. </navigator>
  71. </view>
  72. <view class="money-li">
  73. <view>
  74. <u-icon
  75. name="shangpin1"
  76. size="36"
  77. color="#3f64d9"
  78. margin-left="12"
  79. label-color="#BABBC6"
  80. label-size="24"
  81. label="库存商品数"
  82. custom-prefix="custom-icon"
  83. ></u-icon>
  84. </view>
  85. <view class="num">
  86. <text class="written">{{ Number(now.numberOfProductsInStock) || 0 }}</text>
  87. </view>
  88. </view>
  89. <view class="money-li">
  90. <view>
  91. <u-icon name="jine" size="36" color="#f54957" margin-left="12" label-color="#BABBC6" label-size="24" label="库存总金额" custom-prefix="custom-icon"></u-icon>
  92. </view>
  93. <view class="num">
  94. ¥
  95. <text class="written">{{ $utils.formatNub(now.totalMoneyOfInventory) }}</text>
  96. </view>
  97. </view>
  98. </view> -->
  99. <!-- 内容 -->
  100. <view class="content">
  101. <!-- 工作台 -->
  102. <view class="content_main" style="margin-top: 0;">
  103. <view class="content_top clearfix"
  104. style="background: linear-gradient(270deg, #FDFFFE 0%, #EAFEEE 100%);">
  105. <image src="../../static/img/ic-work.png" class="img"></image>
  106. <text class="title-text">工作台</text>
  107. <view class="edit-btn float_right" @click="goPage('/pages/app/index')">
  108. <u-icon name="edit-pen-fill" color="#4076D6" label-color="#4076D6" size="28" label="编辑"
  109. label-size="28"></u-icon>
  110. </view>
  111. </view>
  112. <view class="cont">
  113. <swiper class="swiper" indicator-color="#B8C0C8" indicator-active-color="#4076D6" :autoplay="false"
  114. :interval="2000" :duration="500">
  115. <swiper-item v-for="(item, index) in nav_list_yg" :key="index">
  116. <view class="app-ul">
  117. <block v-for="(app, appi) in item" :key="appi">
  118. <view class="app-li" @click="goPage(app.url)"
  119. v-if="$accessCheck($Access[app.access])">
  120. <view class="icon-view" :style="{ background: app.color }"><text
  121. :class="[app.icon]" class="custom-icon"></text></view>
  122. <view class="label ellipsis">{{ app.label }}</view>
  123. </view>
  124. </block>
  125. </view>
  126. </swiper-item>
  127. </swiper>
  128. </view>
  129. </view>
  130. <view class="content_main" style="margin-top: 0;">
  131. <view class="content_top clearfix"
  132. style="background: linear-gradient(270deg, #FDFFFE 0%, #EAFEEE 100%);">
  133. <image src="../../static/img/ic-work.png" class="img"></image>
  134. <text class="title-text">工作台</text>
  135. <view class="edit-btn float_right" @click="goPage('/pages/app/index')">
  136. <u-icon name="edit-pen-fill" color="#4076D6" label-color="#4076D6" size="28" label="编辑"
  137. label-size="28"></u-icon>
  138. </view>
  139. </view>
  140. <view class="cont">
  141. <swiper class="swiper" indicator-color="#B8C0C8" indicator-active-color="#4076D6" :autoplay="false"
  142. :interval="2000" :duration="500">
  143. <swiper-item v-for="(item, index) in nav_list" :key="index">
  144. <view class="app-ul">
  145. <block v-for="(app, appi) in item" :key="appi">
  146. <view class="app-li" @click="goPage(app.url)"
  147. v-if="$accessCheck($Access[app.access])">
  148. <view class="icon-view" :style="{ background: app.color }"><text
  149. :class="[app.icon]" class="custom-icon"></text></view>
  150. <view class="label ellipsis">{{ app.label }}</view>
  151. </view>
  152. </block>
  153. </view>
  154. </swiper-item>
  155. </swiper>
  156. </view>
  157. </view>
  158. <view class="content_main" v-if="$accessCheck($Access.overview)">
  159. <view class="content_top">
  160. <image src="../../static/img/ic-jy.png" class="img" mode="aspectFill"></image>
  161. <text class="title-text">经营概况</text>
  162. </view>
  163. <!-- 经营概况 -->
  164. <view class="content_text">
  165. <ul class="content-ul">
  166. <li class="li-list">
  167. <view class="order_money">下单金额</view>
  168. <view class="num">{{ businessOverview.orderTotalMoney }}</view>
  169. <!-- <view class='txt'>同比<span style='margin-left: 3rpx;color: #2CB244;'>+10%</span><span>
  170. <image src="../../static/img/ic-sh.png" style="width: 16rpx;height: 16rpx;">
  171. </image>
  172. </span></view> -->
  173. <!-- <view class="time">
  174. 昨日
  175. <span style="margin-left: 4rpx;">13409.00</span>
  176. </view> -->
  177. </li>
  178. <li class="li-list">
  179. <view class="order_money">营业金额</view>
  180. <view class="num">{{ businessOverview.orderConfirmedMoney }}</view>
  181. <!-- <view class='txt'>同比<span style='margin-left: 8rpx;color: #FA6400;'>+10%</span><span>
  182. <image src="../../static/img/ic-xd.png" style="width: 16rpx;height: 16rpx;">
  183. </image>
  184. </span></view> -->
  185. <!-- <view class="time">
  186. 昨日
  187. <span style="margin-left: 4rpx;">13409.00</span>
  188. </view> -->
  189. </li>
  190. <li class="li-list">
  191. <view class="order_money">今日毛利</view>
  192. <view class="num">{{ businessOverview.todayGrossProfit }}</view>
  193. <!-- <view class='txt'>同比<span style='margin-left: 3rpx;color: #2CB244;'>+10%</span><span>
  194. <image src="../../static/img/ic-sh.png" style="width: 16rpx;height: 16rpx;">
  195. </image>
  196. </span></view> -->
  197. <!-- <view class="time">
  198. 昨日
  199. <span style="margin-left: 4rpx;">13409.00</span>
  200. </view> -->
  201. </li>
  202. <li class="li-list bottom-li">
  203. <view class="order_money">今日收款</view>
  204. <view class="num">{{ businessOverview.todayReceivedMoney }}</view>
  205. <!-- <view class='txt'>同比<span style='margin-left: 3rpx;color: #2CB244;'>+10%</span><span>
  206. <image src="../../static/img/ic-sh.png" style="width: 16rpx;height: 16rpx;">
  207. </image>
  208. </span></view> -->
  209. <!-- <view class="time">
  210. 昨日
  211. <span style="margin-left: 4rpx;">13409.00</span>
  212. </view> -->
  213. </li>
  214. <li class="li-list bottom-li">
  215. <view class="order_money">今日新增客户数</view>
  216. <view class="num">{{ businessOverview.todayNewCustomerNum }}</view>
  217. <!-- <view class='txt'>同比<span style='margin-left: 3rpx;color: #2CB244;'>+10%</span><span>
  218. <image src="../../static/img/ic-sh.png" style="width: 16rpx;height: 16rpx;">
  219. </image>
  220. </span></view> -->
  221. <!-- <view class="time">
  222. 昨日
  223. <span style="margin-left: 4rpx;">13409.00</span>
  224. </view> -->
  225. </li>
  226. </ul>
  227. </view>
  228. </view>
  229. <!-- 订单概况 -->
  230. <view class="content_main" v-if="$accessCheck($Access.overview)">
  231. <view class="content_top clearfix"
  232. style="background: linear-gradient(270deg, #FFFFFF 0%, #FDF6E8 100%); ">
  233. <view class="float_left">
  234. <image src="../../static/img/ic-jyh3.png" class="img" mode="aspectFill"></image>
  235. <text class="title-text">订单概况</text>
  236. </view>
  237. <!-- <view class="float_right" style="color: #B8C0C8;">选择店铺</view> -->
  238. </view>
  239. <view class="content_text">
  240. <ul class="content-ul">
  241. <li class="li-list">
  242. <view class="order_money">今日订单</view>
  243. <view class="num">{{ businessOverview.todayConfirmedOrderNum }}</view>
  244. <!-- <view class='txt'>同比<span style='margin-left: 3rpx;color: #2CB244;'>+10%</span><span>
  245. <image src="../../static/img/ic-sh.png" style="width: 16rpx;height: 16rpx;">
  246. </image>
  247. </span></view> -->
  248. <!-- <view class="time">
  249. 昨日
  250. <span style="margin-left: 4rpx;">13409.00</span>
  251. </view> -->
  252. </li>
  253. <li class="li-list">
  254. <view class="order_money">下单客户</view>
  255. <view class="num">{{ businessOverview.todayConfirmedOrderCustomerNum }}</view>
  256. <!-- <view class='txt'>同比<span style='margin-left: 8rpx;color: #FA6400;'>+10%</span><span>
  257. <image src="../../static/img/ic-xd.png" style="width: 16rpx;height: 16rpx;">
  258. </image>
  259. </span></view> -->
  260. <!-- <view class="time">
  261. 昨日
  262. <span style="margin-left: 4rpx;">13409.00</span>
  263. </view> -->
  264. </li>
  265. <li class="li-list">
  266. <view class="order_money">今日客单价</view>
  267. <view class="num">{{ businessOverview.customerAverageMoney }}</view>
  268. <!-- <view class='txt'>同比<span style='margin-left: 3rpx;color: #2CB244;'>+10%</span><span>
  269. <image src="../../static/img/ic-sh.png" style="width: 16rpx;height: 16rpx;">
  270. </image>
  271. </span></view> -->
  272. <!-- <view class="time">
  273. 昨日
  274. <span style="margin-left: 4rpx;">13409.00</span>
  275. </view> -->
  276. </li>
  277. <li class="li-list bottom-li">
  278. <view class="order_money">未出库订单</view>
  279. <view class="num">{{ businessOverview.orderNumOfNotOutOfStock }}</view>
  280. <!-- <view class='txt'>同比<span style='margin-left: 3rpx;color: #2CB244;'>+10%</span><span>
  281. <image src="../../static/img/ic-sh.png" style="width: 16rpx;height: 16rpx;">
  282. </image>
  283. </span></view> -->
  284. <!-- <view class="time">
  285. 昨日
  286. <span style="margin-left: 4rpx;">13409.00</span>
  287. </view> -->
  288. </li>
  289. <li class="li-list bottom-li">
  290. <view class="order_money">今日取消订单</view>
  291. <view class="num">{{ businessOverview.todayCanceledOrder }}</view>
  292. <!-- <view class='txt'>同比<span style='margin-left: 3rpx;color: #2CB244;'>+10%</span><span>
  293. <image src="../../static/img/ic-sh.png" style="width: 16rpx;height: 16rpx;">
  294. </image>
  295. </span></view> -->
  296. <!-- <view class="time">
  297. 昨日
  298. <span style="margin-left: 4rpx;">13409.00</span>
  299. </view> -->
  300. </li>
  301. </ul>
  302. </view>
  303. </view>
  304. <!-- 近7日交易统计图 -->
  305. <view class="content_main" v-if="$accessCheck($Access.overview)">
  306. <view class="content_top" style="background: linear-gradient(270deg, #FDFFFF 0%, #EAFAFE 100%);">
  307. <image src="../../static/img/ic-jyh2.png" class="img" style="vertical-align: middle;"></image>
  308. <text class="title-text">近7日交易趋势</text>
  309. </view>
  310. <view class="charts-box">
  311. <qiun-data-charts type="area" :chartData="chartData" :echartsH5="true" :echartsApp="true"
  312. background="none" :animation="false" />
  313. </view>
  314. </view>
  315. <!-- tab -->
  316. <view class="content_main" v-if="$accessCheck($Access.overview)">
  317. <view class="content_top tabs-ul">
  318. <ul class="ul_tag">
  319. <li v-for="(item, index) in tag" :key="index" @click="changeTag(item.value)" class="ul_tag_item"
  320. :class="[item.value === rank_on ? 'hover' : '']">
  321. {{ item.label }}
  322. </li>
  323. </ul>
  324. </view>
  325. <view class="content_bottom">
  326. <view class="bottom_top clearfix">
  327. <view class="float_left">
  328. <text class="sale" @click="changeSel(1)"
  329. :class="[ranking_sel === 1 ? 'show-on' : '']">销额</text>
  330. <text
  331. style="width: 1rpx;height: 24rpx;display: inline-block;border-left: 1rpx solid #ECF0F7;"></text>
  332. <text class="sale_num" @click="changeSel(2)"
  333. :class="[ranking_sel === 2 ? 'show-on' : '']">销量</text>
  334. </view>
  335. <view v-if="false" class="float_right" @click="goPage('/pagesT/shop/selShop')">
  336. <u-icon name="arrow-down-fill" color="#B8C0C8" margin-right="20" label-size="28rpx"
  337. label-color="#B8C0C8" size="14" label="选择店铺" label-pos="left"></u-icon>
  338. </view>
  339. </view>
  340. <view style="margin-top:40rpx">
  341. <ul class="progress-ul" v-if="rank_on === 1">
  342. <li class="clearfix progress-li" v-for="(item, index) in ranking.categoryRanking"
  343. :key="index">
  344. <view class="float_left label ellipsis">{{ item.categoryName }}</view>
  345. <view class="float_left line">
  346. <u-line-progress active-color="#4076D6" :percent="item.percent"
  347. :show-percent="false" height="16prx" width="423prx" :round="true">
  348. </u-line-progress>
  349. </view>
  350. <view class="float_right num">{{ item.numberOrMoney }}</view>
  351. </li>
  352. </ul>
  353. <ul class="progress-ul" v-if="rank_on === 2">
  354. <li class="clearfix progress-li" v-for="(item, index) in ranking.goodsRanking" :key="index">
  355. <view class="float_left label ellipsis">{{ item.goodsName || '未设置' }}</view>
  356. <view class="float_left line">
  357. <u-line-progress active-color="#4076D6" :percent="item.percent"
  358. :show-percent="false" height="16prx" width="423prx" :round="true">
  359. </u-line-progress>
  360. </view>
  361. <view class="float_right num">{{ item.numberOrMoney }}</view>
  362. </li>
  363. </ul>
  364. <ul class="progress-ul" v-if="rank_on === 3">
  365. <li class="clearfix progress-li" v-for="(item, index) in ranking.customerRanking"
  366. :key="index">
  367. <view style="width: 450rpx;border: 0;" class="float_left label ellipsis">
  368. {{ item.customerName }}</view>
  369. <view style="width: 200rpx;text-align: left;" class="float_right num">
  370. {{ item.numberOrMoney }}</view>
  371. </li>
  372. </ul>
  373. <ul class="progress-ul" v-if="rank_on === 4">
  374. <li class="clearfix progress-li ellipsis" v-for="(item, index) in ranking.supplierRanking"
  375. :key="index">
  376. <view style="width: 450rpx;border: 0;" class="float_left label">{{ item.supplierName }}
  377. </view>
  378. <view style="width: 200rpx;text-align: left;" class="float_right num">
  379. {{ item.numberOrMoney }}</view>
  380. </li>
  381. </ul>
  382. </view>
  383. </view>
  384. </view>
  385. <!-- 员工订单 -->
  386. <view class="ygdd">
  387. <view class="dd-tit">
  388. <view class="tit-left">
  389. <view class="sx">
  390. </view>
  391. <view class="">
  392. 我的订单
  393. </view>
  394. </view>
  395. <view class="tit-right" @click="goPage('/pagesS/order/allorder')">
  396. 全部订单
  397. <image src="../../static/img/down-right-w.png" mode=""></image>
  398. </view>
  399. </view>
  400. <view class="dd-wrap">
  401. <view class="dd-id-status">
  402. <view class="dd-stata">
  403. 待服务
  404. </view>
  405. <view class="dd-id">
  406. ddddadfasfdasdf-adfas
  407. </view>
  408. <view class="dd-status">
  409. 已预约
  410. </view>
  411. </view>
  412. <view class="dd-info" style="margin-top: 20rpx;">
  413. 客服名称<text>小圆</text>
  414. </view>
  415. <view class="dd-info">
  416. 下单时间<text>2022-11-03 9:30~10:30</text>
  417. </view>
  418. <view class="dd-info">
  419. 预约时间<text class="chs" style="color:#FF5600;">2022-11-03 9:30~10:30</text>
  420. </view>
  421. <view class="dd-btm">
  422. <view class="btm-price">
  423. 订单金额: <text>¥2400</text>
  424. </view>
  425. <view class="btm-btn">
  426. 联系客户
  427. </view>
  428. </view>
  429. <view class="add-dd" @click="goPage('/pagesS/order/addorder')">
  430. <image src="../../static/img/add-dd.png" mode=""></image>
  431. <view class="">
  432. 添加项目
  433. </view>
  434. </view>
  435. </view>
  436. </view>
  437. </view>
  438. <u-popup v-model="noticePop" border-radius="18" mode="center" height="905" :custom-style="{
  439. background: 'rgba(0,0,0,0)'
  440. }">
  441. <view class="mag-view">
  442. <view class="mag-top">
  443. <image class="notice-i" src="../../static/img/notice-i.png" mode=""></image>
  444. </view>
  445. <view class="msg-cont">
  446. <image class="msg-yun" src="../../static/img/notice-bg.png" mode=""></image>
  447. <view class="mag-tit">{{ notice_data.title }}</view>
  448. <scroll-view class="mag-main" scroll-y>{{ notice_data.content }}</scroll-view>
  449. </view>
  450. <view class="confirm-btn primary-btn-pain" @click="noticePop = false">我知道了</view>
  451. </view>
  452. </u-popup>
  453. <!-- 底部tabbar -->
  454. <Tabbar v-model="tabbar_current"></Tabbar>
  455. </view>
  456. </template>
  457. <script>
  458. import {
  459. mapActions
  460. } from 'vuex';
  461. import uniStatusBar from '../../components/uni-status-bar.vue';
  462. export default {
  463. data() {
  464. return {
  465. tabbar_current: 0,
  466. notice_data: {
  467. title: '',
  468. content: ''
  469. },
  470. noticePop: false,
  471. shopData: '',
  472. ranking: [],
  473. now: {}, //
  474. type: true,
  475. businessOverview: {},
  476. active: false,
  477. rank_on: 1,
  478. list: ['快销品', '包装食品', '饼干糕点', '保健品', '营养保健品', '速冻面店', '办公器材', '美容化妆'],
  479. tag: [{
  480. value: 1,
  481. label: '类目排行',
  482. active: true
  483. },
  484. {
  485. value: 2,
  486. label: '商品排行',
  487. active: false
  488. },
  489. {
  490. value: 3,
  491. label: '客户排行',
  492. active: false
  493. },
  494. {
  495. value: 4,
  496. label: '供应商排行',
  497. active: false
  498. }
  499. ],
  500. chartData: {
  501. categories: [],
  502. series: []
  503. },
  504. tabs_current: 0,
  505. tabs_list: [{
  506. name: '订单金额'
  507. },
  508. {
  509. name: '客户统计'
  510. },
  511. {
  512. name: '资金统计'
  513. },
  514. {
  515. name: '订单数'
  516. }
  517. ],
  518. ranking_sel: 1,
  519. nav_list_yg: [
  520. [{
  521. url: '/pagesT/customer/StaffList',
  522. label: '销售排行',
  523. icon: 'custom-icon-paihangbang',
  524. color: '#f29611',
  525. access: 'salesRanking'
  526. },
  527. {
  528. url: '/pagesS/yg/dkdetail',
  529. label: '考勤记录',
  530. icon: 'custom-icon-paihangbang',
  531. color: '#f29611',
  532. access: 'salesRanking'
  533. },
  534. {
  535. url: '/pagesS/yg/gqdetail',
  536. label: '股权管理',
  537. icon: 'custom-icon-piliangxiadan',
  538. color: '#f29611',
  539. access: 'OrderAdd'
  540. },
  541. {
  542. url: '/pagesS/yg/yjjl',
  543. label: '业绩奖励',
  544. icon: 'custom-icon-piliangxiadan',
  545. color: '#f29611',
  546. access: 'OrderAdd'
  547. },
  548. {
  549. url: '/pagesS/yg/gztx',
  550. label: '工资提现',
  551. icon: 'custom-icon-piliangxiadan',
  552. color: '#f29611',
  553. access: 'OrderAdd'
  554. },
  555. {
  556. url: '/pagesS/yg/ygdetail',
  557. label: '我的评价',
  558. icon: 'custom-icon-piliangxiadan',
  559. color: '#f29611',
  560. access: 'OrderAdd'
  561. },
  562. {
  563. url: '/pagesS/yg/myteam',
  564. label: '我的转介绍',
  565. icon: 'custom-icon-piliangxiadan',
  566. color: '#f29611',
  567. access: 'OrderAdd'
  568. }
  569. ]
  570. ],
  571. nav_list: [
  572. [{
  573. url: '/pagesT/customer/StaffList',
  574. label: '销售排行',
  575. icon: 'custom-icon-paihangbang',
  576. color: '#f29611',
  577. access: 'salesRanking'
  578. },
  579. {
  580. url: '/pagesT/customer/selCustomert',
  581. label: '客户拜访',
  582. icon: 'custom-icon-fuwu',
  583. color: '#f29611',
  584. access: 'CustomerListvisitedLogs'
  585. },
  586. {
  587. url: '/pagesS/goods/xhplist',
  588. label: '消耗品管理',
  589. icon: 'custom-icon-fuwu',
  590. color: '#f29611',
  591. access: 'CustomerListvisitedLogs'
  592. },
  593. {
  594. url: '/pagesS/goods/valetbuy',
  595. label: '代客预约',
  596. icon: 'custom-icon-fuwu',
  597. color: '#f29611',
  598. access: 'CustomerListvisitedLogs'
  599. },
  600. {
  601. url: '/pagesS/yg/dklist',
  602. label: '员工打卡',
  603. icon: 'custom-icon-fuwu',
  604. color: '#f29611',
  605. access: 'CustomerListvisitedLogs'
  606. },
  607. {
  608. url: '/pagesS/yg/yglist?type=yg',
  609. label: '门店员工',
  610. icon: 'custom-icon-fuwu',
  611. color: '#f29611',
  612. access: 'CustomerListvisitedLogs'
  613. },
  614. {
  615. url: '/pagesS/yg/yglist?type=gz',
  616. label: '工资表',
  617. icon: 'custom-icon-fuwu',
  618. color: '#f29611',
  619. access: 'CustomerListvisitedLogs'
  620. },
  621. {
  622. url: '/pages/order/OrderAdd',
  623. label: '代客下单',
  624. icon: 'custom-icon-piliangxiadan',
  625. color: '#f29611',
  626. access: 'OrderAdd'
  627. }
  628. ]
  629. ],
  630. scroll_top: 0
  631. };
  632. },
  633. onPageScroll(e) {
  634. this.scroll_top = e.scrollTop;
  635. },
  636. components: {
  637. uniStatusBar
  638. },
  639. computed: {
  640. hasLogin() {
  641. return this.$store.state.hasLogin;
  642. },
  643. userInfo() {
  644. return this.$store.state.userInfo;
  645. },
  646. enterprise() {
  647. return this.$store.state.enterprise;
  648. }
  649. },
  650. watch: {
  651. shopData(val) {}
  652. },
  653. async onLoad() {
  654. // this.noticePop=true
  655. if (!this.hasLogin) {
  656. this.logout();
  657. return;
  658. }
  659. await this.overview();
  660. await this.getupStatusAnnouncementInfo();
  661. await this.getBasicSetup();
  662. },
  663. async onShow() {
  664. // await this.getCommonAppInfo();
  665. },
  666. async onPullDownRefresh() {
  667. await this.overview();
  668. await this.getupStatusAnnouncementInfo();
  669. await this.getBasicSetup();
  670. },
  671. onShareAppMessage(res) {},
  672. methods: {
  673. ...mapActions({
  674. logout: 'logout'
  675. }),
  676. setChartData(timeData, orderMoney, goodsNum, orderNum) {
  677. this.chartData = {
  678. categories: timeData,
  679. series: [{
  680. name: '金额',
  681. data: orderMoney,
  682. // pointShape: 'circle',
  683. legendShape: 'line'
  684. },
  685. {
  686. name: '商品数量',
  687. data: goodsNum,
  688. // pointShape: 'circle',
  689. legendShape: 'line'
  690. },
  691. {
  692. name: '订单数量',
  693. data: orderNum,
  694. // pointShape: 'circle',
  695. legendShape: 'line'
  696. }
  697. ]
  698. };
  699. },
  700. changeTag(val) {
  701. this.rank_on = val;
  702. },
  703. changeSel(val) {
  704. this.ranking_sel = val;
  705. this.overview();
  706. },
  707. async overview(isReset) {
  708. if (isReset) {
  709. uni.showLoading({
  710. title: '加载中...'
  711. });
  712. }
  713. await this.$u.api
  714. .overview({
  715. ranking: this.ranking_sel, // "1销量排行 2销额排行",
  716. businessOverviewShopId: '', // "经营概况按店铺筛选:为空则筛选全店",
  717. categoryRankingShopId: '', // "类目排行按店铺筛选:为空则筛选全店",
  718. goodsRankingShopId: '', // "商品排行按店铺筛选:为空则筛选全店",
  719. supplierRankingShopId: '' // 供应商排行按店铺筛选:为空则筛选全店"
  720. })
  721. .then(res => {
  722. uni.stopPullDownRefresh();
  723. uni.hideLoading();
  724. this.businessOverview = res.data.businessOverview;
  725. this.now = res.data.aggregateStatistics;
  726. this.ranking = res.data.ranking;
  727. const timeData = [];
  728. const goodsNumData = [];
  729. const orderMoneyData = [];
  730. const orderNumData = [];
  731. this.$nextTick(() => {
  732. res.data.chartData.forEach(value => {
  733. const arr = value.date.split('-');
  734. timeData.push(arr[1] + '-' + arr[2]);
  735. goodsNumData.push(Number(value.goodsNum));
  736. orderMoneyData.push(Number(value.orderMoney));
  737. orderNumData.push(Number(value.orderNum));
  738. });
  739. this.setChartData(timeData, orderMoneyData, goodsNumData, orderNumData);
  740. });
  741. })
  742. .catch(err => {
  743. uni.hideLoading();
  744. uni.stopPullDownRefresh();
  745. });
  746. },
  747. async getupStatusAnnouncementInfo() {
  748. await this.$u.api.getupStatusAnnouncementInfo().then(res => {
  749. if (res.data.upStatus === 5) {
  750. this.noticePop = true;
  751. this.notice_data.title = res.data.title;
  752. this.notice_data.content = res.data.content;
  753. } else {
  754. this.noticePop = false;
  755. }
  756. });
  757. },
  758. async getCommonAppInfo() {
  759. await this.$u.api.getCommonAppInfo(this.userInfo.userCenterId).then(res => {
  760. if (res.data.jsonKey) {
  761. const jsonKey = res.data.jsonKey;
  762. if (jsonKey[0].icon.indexOf('ibon') > -1) {
  763. return;
  764. }
  765. //可对一个数进行上舍入
  766. let num = Math.ceil(jsonKey.length / 8);
  767. let arr = [];
  768. for (let i = 0; i < num; i++) {
  769. arr[i] = jsonKey.slice(i * 8, i * 8 + 8);
  770. }
  771. this.nav_list = arr;
  772. }
  773. });
  774. },
  775. // 获取基本设置
  776. async getBasicSetup() {
  777. await this.$u.api.getBasicSetup().then(res => {
  778. if (res.data.basicData) {
  779. this.$store.commit('commit_basicSet', res.data.basicData);
  780. }
  781. });
  782. }
  783. }
  784. };
  785. </script>
  786. <style lang="scss" scoped>
  787. .charts-box {
  788. width: 710rpx;
  789. height: 530rpx;
  790. padding: 24rpx 24rpx 0 0;
  791. background-color: #ffffff;
  792. }
  793. .show {
  794. color: #2d405e;
  795. }
  796. .home {
  797. font-family: DIN-Medium;
  798. .top_bottom {
  799. width: 686rpx;
  800. margin: 0 auto;
  801. background-color: #ffffff;
  802. border-radius: 8rpx;
  803. display: flex;
  804. padding: 32rpx;
  805. flex-wrap: wrap;
  806. transform: translateY(-146rpx);
  807. .money-li {
  808. padding-left: 42rpx;
  809. width: 50%;
  810. color: #2d405e;
  811. padding-top: 20rpx;
  812. &:nth-child(odd) {
  813. border-right: 1px solid #ecf0f7;
  814. }
  815. &:nth-child(2) {
  816. padding-top: 0;
  817. border-bottom: 1px solid #ecf0f7;
  818. }
  819. &:first-child {
  820. padding-top: 0;
  821. border-bottom: 1px solid #ecf0f7;
  822. }
  823. .num {
  824. padding-top: 8px;
  825. font-size: 24rpx;
  826. font-weight: 500;
  827. color: #2d405e;
  828. line-height: 50rpx;
  829. .written {
  830. font-size: 40rpx;
  831. }
  832. }
  833. }
  834. }
  835. .top_view {
  836. padding: 0 32rpx 164rpx;
  837. // height: calc(500rpx + var(--status-bar-height));
  838. background: linear-gradient(#4076d6, #4076d6, #4076d6, #4076d6, #f5f5f6 100%);
  839. .title {
  840. padding-left: 32rpx;
  841. font-size: 32rpx;
  842. font-weight: 500;
  843. color: #ffffff;
  844. }
  845. .user_img {
  846. margin-top: 52rpx;
  847. .img {
  848. float: left;
  849. image {
  850. margin-right: 8rpx;
  851. vertical-align: middle;
  852. width: 68rpx;
  853. height: 68rpx;
  854. border-radius: 100%;
  855. border: 4rpx solid #ffffff;
  856. background-color: #ffffff;
  857. }
  858. .img_title {
  859. line-height: 68rpx;
  860. vertical-align: middle;
  861. font-size: 28rpx;
  862. font-weight: 500;
  863. color: #ffffff;
  864. }
  865. }
  866. .Icon {
  867. float: right;
  868. line-height: 72rpx;
  869. .btn-li {
  870. font-weight: bold;
  871. width: 50rpx;
  872. height: 50rpx;
  873. background-color: #ffffff;
  874. display: inline-block;
  875. text-align: center;
  876. vertical-align: middle;
  877. margin-left: 30rpx;
  878. line-height: 50rpx;
  879. border-radius: 6rpx;
  880. }
  881. }
  882. }
  883. .top_money {
  884. color: #ffffff;
  885. margin-top: 52rpx;
  886. .float_right {
  887. font-size: 34rpx;
  888. font-weight: 400;
  889. font-family: DINPro-Regular;
  890. .rmb-icon {
  891. margin-right: 4rpx;
  892. font-size: 24rpx;
  893. }
  894. }
  895. }
  896. .txst {
  897. width: 141rpx;
  898. height: 33px;
  899. font-size: 24px;
  900. font-weight: 400;
  901. color: #2d405e;
  902. line-height: 33px;
  903. }
  904. }
  905. .content {
  906. transform: translateY(-120rpx);
  907. .content_main {
  908. margin: 24rpx auto;
  909. width: 710rpx;
  910. border-radius: 12rpx;
  911. overflow: hidden;
  912. .content_top {
  913. background: linear-gradient(270deg, #fcfdff 0%, #e2ebff 100%);
  914. line-height: 40rpx;
  915. height: 80rpx;
  916. line-height: 80rpx;
  917. padding: 0 24rpx;
  918. overflow: hidden;
  919. .img {
  920. width: 40rpx;
  921. height: 40rpx;
  922. display: inline-block;
  923. margin-right: 16rpx;
  924. vertical-align: middle;
  925. }
  926. .title-text {
  927. font-size: 32rpx;
  928. font-weight: 600;
  929. color: #2d405e;
  930. vertical-align: middle;
  931. }
  932. .edit-btn {
  933. margin-left: 20rpx;
  934. display: inline-block;
  935. }
  936. &.tabs-ul {
  937. overflow: auto;
  938. height: 88rpx;
  939. padding: 0rpx;
  940. background: transparent;
  941. .ul_tag {
  942. display: flex;
  943. width: 710rpx;
  944. height: 72rpx;
  945. line-height: 72rpx;
  946. transform: translateY(16rpx);
  947. background: linear-gradient(217deg, #ffffff 0%, #ecf0f7 100%);
  948. .ul_tag_item {
  949. flex: 4;
  950. width: 177rpx;
  951. text-align: center;
  952. font-size: 24rpx;
  953. font-weight: 400;
  954. color: #62738e;
  955. }
  956. .hover {
  957. font-weight: 400;
  958. height: 88rpx;
  959. line-height: 88rpx;
  960. background-color: #4076d6;
  961. color: #ffffff;
  962. font-size: 28rpx;
  963. transform: translateY(-16rpx);
  964. border-radius: 8rpx 8rpx 0rpx 0rpx;
  965. }
  966. }
  967. }
  968. }
  969. .content_bottom {
  970. width: 710rpx;
  971. background-color: #ffffff;
  972. padding-top: 38rpx;
  973. .bottom_top {
  974. padding: 0 32rpx;
  975. height: 50rpx;
  976. line-height: 50rpx;
  977. font-size: 28rpx;
  978. .float_right {
  979. width: 210rpx;
  980. height: 50rpx;
  981. border-radius: 25rpx;
  982. border: 2rpx solid #b8c0c8;
  983. text-align: center;
  984. line-height: 36rpx;
  985. }
  986. .sale {
  987. font-size: 28rpx;
  988. width: 56rpx;
  989. height: 40rpx;
  990. color: #b8c0c8;
  991. margin-left: 32rpx;
  992. margin-right: 20rpx;
  993. }
  994. .sale_num {
  995. font-size: 28rpx;
  996. width: 56rpx;
  997. font-weight: 400;
  998. color: #b8c0c8;
  999. margin-left: 20rpx;
  1000. }
  1001. .show-on {
  1002. font-size: 28rpx;
  1003. font-weight: 500;
  1004. color: #2d405e;
  1005. }
  1006. .sel {
  1007. padding: 10rpx;
  1008. font-size: 28rpx;
  1009. width: 210rpx;
  1010. border-radius: 25rpx;
  1011. border: 2rpx solid #b8c0c8;
  1012. margin-left: 320rpx;
  1013. color: #b8c0c8;
  1014. }
  1015. }
  1016. }
  1017. .content_text {
  1018. background-color: #ffffff;
  1019. .content-ul {
  1020. display: flex;
  1021. flex-wrap: wrap;
  1022. padding: 0 24rpx;
  1023. .li-list {
  1024. width: 33.3333%;
  1025. text-align: center;
  1026. margin-top: 10rpx;
  1027. padding-bottom: 32rpx;
  1028. padding-top: 40rpx;
  1029. border-bottom: 1px solid #ecf0f7;
  1030. position: relative;
  1031. &::after {
  1032. content: '';
  1033. display: block;
  1034. width: 1px;
  1035. height: 120rpx;
  1036. position: absolute;
  1037. background-color: #ecf0f7;
  1038. right: 0;
  1039. top: 50%;
  1040. transform: translateY(-48%);
  1041. }
  1042. &:nth-child(5),
  1043. &:nth-child(4) {
  1044. padding-top: 32rpx;
  1045. padding-bottom: 40rpx;
  1046. border-bottom: 0;
  1047. }
  1048. &:nth-child(3),
  1049. &:last-child {
  1050. &::after {
  1051. height: 0;
  1052. width: 0;
  1053. }
  1054. }
  1055. .num {
  1056. font-size: 44rpx;
  1057. font-weight: 500;
  1058. color: #2d405e;
  1059. line-height: 56rpx;
  1060. height: 56rpx;
  1061. padding-top: 12rpx;
  1062. }
  1063. .order_money {
  1064. font-size: 24rpx;
  1065. font-weight: 400;
  1066. color: #b8c0c8;
  1067. line-height: 33rpx;
  1068. }
  1069. .txt {
  1070. font-size: 20rpx;
  1071. font-weight: 400;
  1072. color: #62738e;
  1073. line-height: 28rpx;
  1074. }
  1075. .time {
  1076. font-size: 20rpx;
  1077. font-weight: 400;
  1078. color: #62738e;
  1079. line-height: 45rpx;
  1080. }
  1081. &.bottom-li {
  1082. width: 50%;
  1083. }
  1084. }
  1085. }
  1086. }
  1087. }
  1088. }
  1089. }
  1090. .cont {
  1091. .swiper {
  1092. width: 710rpx;
  1093. height: 400rpx;
  1094. .app-ul {
  1095. padding: 40rpx 0 0;
  1096. display: flex;
  1097. flex-wrap: wrap;
  1098. background-color: #ffffff;
  1099. height: 400rpx;
  1100. .app-li {
  1101. text-align: center;
  1102. width: 25%;
  1103. margin-bottom: 40rpx;
  1104. .icon-view {
  1105. width: 72rpx;
  1106. height: 72rpx;
  1107. line-height: 72rpx;
  1108. border-radius: 30rpx;
  1109. margin: 0 auto;
  1110. .custom-icon {
  1111. font-size: 42rpx;
  1112. color: #ffffff;
  1113. }
  1114. }
  1115. .label {
  1116. font-size: 26rpx;
  1117. line-height: 36rpx;
  1118. padding-top: 16rpx;
  1119. color: #2d405e;
  1120. }
  1121. }
  1122. }
  1123. }
  1124. }
  1125. .progress-ul {
  1126. padding-bottom: 40rpx;
  1127. .progress-li {
  1128. line-height: 90rpx;
  1129. .label {
  1130. width: 152rpx;
  1131. text-align: right;
  1132. border-right: 1px solid #dddddd;
  1133. padding-right: 12rpx;
  1134. color: #2d405e;
  1135. font-size: 24rpx;
  1136. font-weight: 400;
  1137. }
  1138. .line {
  1139. width: 400rpx;
  1140. }
  1141. .num {
  1142. color: #5c79b0;
  1143. font-size: 24rpx;
  1144. margin-right: 30rpx;
  1145. }
  1146. }
  1147. }
  1148. .mag-view {
  1149. text-align: center;
  1150. transform: translateY(100rpx);
  1151. background-color: #ffffff;
  1152. width: 612rpx;
  1153. border-radius: 18rpx;
  1154. padding-bottom: 46rpx;
  1155. .mag-top {
  1156. height: 242rpx;
  1157. border-radius: 18rpx;
  1158. background-color: $uni-color-primary;
  1159. width: 100%;
  1160. position: relative;
  1161. .notice-i {
  1162. width: 422rpx;
  1163. height: 312rpx;
  1164. position: absolute;
  1165. top: -100rpx;
  1166. left: 140rpx;
  1167. }
  1168. }
  1169. .msg-cont {
  1170. padding: 0 50rpx;
  1171. padding-top: 56rpx;
  1172. position: relative;
  1173. .msg-yun {
  1174. position: absolute;
  1175. width: 622rpx;
  1176. height: 215rpx;
  1177. left: 0;
  1178. top: -116rpx;
  1179. z-index: 1;
  1180. }
  1181. .mag-main {
  1182. height: 200rpx;
  1183. }
  1184. .mag-tit {
  1185. position: relative;
  1186. z-index: 9;
  1187. font-size: 38upx;
  1188. font-weight: bold;
  1189. padding-bottom: 30rpx;
  1190. }
  1191. }
  1192. .confirm-btn {
  1193. line-height: 90rpx;
  1194. height: 90rpx;
  1195. font-size: 34rpx;
  1196. width: 506rpx;
  1197. margin: 30rpx auto 0;
  1198. border: 1px solid $uni-color-primary;
  1199. color: $uni-color-primary;
  1200. border-radius: 12rpx;
  1201. }
  1202. }
  1203. .ygdd {
  1204. width: 100%;
  1205. background-color: #0c0a16;
  1206. padding-bottom: 20rpx;
  1207. .dd-tit {
  1208. padding: 0 37rpx;
  1209. height: 95rpx;
  1210. display: flex;
  1211. justify-content: space-between;
  1212. align-items: center;
  1213. .tit-left, .tit-right {
  1214. display: flex;
  1215. align-items: center;
  1216. }
  1217. .tit-left {
  1218. color: #e3c4a5;
  1219. font-size: 30rpx;
  1220. font-weight: bold;
  1221. .sx {
  1222. background-color: #e3c4a5;
  1223. width: 7rpx;
  1224. height: 36rpx;
  1225. border-radius: 4rpx;
  1226. margin-right: 20rpx;
  1227. }
  1228. }
  1229. .tit-right {
  1230. font-size: 24rpx;
  1231. font-weight: 500;
  1232. color: #FFFFFF;
  1233. image {
  1234. width: 22rpx;
  1235. height: 22rpx;
  1236. }
  1237. }
  1238. }
  1239. .dd-wrap {
  1240. margin: auto;
  1241. width: 713rpx;
  1242. height: 314rpx;
  1243. border-radius: 20rpx;
  1244. background-color: #fff;
  1245. padding-top: 35rpx;
  1246. position: relative;
  1247. margin-bottom: 27rpx;
  1248. .dd-id-status {
  1249. height: 40rpx;
  1250. display: flex;
  1251. align-items: center;
  1252. width: 100%;
  1253. font-size: 24rpx;
  1254. padding: 0 23rpx 0 43rpx;
  1255. .dd-stata {
  1256. flex-shrink: 0;
  1257. width: 123rpx;
  1258. height: 39rpx;
  1259. background: #FF5600;
  1260. border-radius: 5rpx;
  1261. text-align: center;
  1262. line-height: 39rpx;
  1263. font-weight: 400;
  1264. color: #FFFFFF;
  1265. }
  1266. .dd-id {
  1267. margin-left: 15rpx;
  1268. flex-grow: 1;
  1269. color: #1e395a;
  1270. }
  1271. .dd-status {
  1272. flex-shrink: 0;
  1273. font-weight: 400;
  1274. color: #FCA930;
  1275. }
  1276. }
  1277. .dd-info {
  1278. font-size: 28rpx;
  1279. font-weight: 500;
  1280. color: #A0A0A0;
  1281. padding-left: 42rpx;
  1282. text {
  1283. padding-left: 32rpx;
  1284. font-size: 26rpx;
  1285. font-weight: 500;
  1286. color: #173456;
  1287. }
  1288. }
  1289. .dd-btm {
  1290. position: absolute;
  1291. bottom: 0;
  1292. height: 90rpx;
  1293. width: 713rpx;
  1294. background: linear-gradient(to right,#fbf5eb,#ffffff);
  1295. border-radius: 0 0 20rpx 20rpx;
  1296. display: flex;
  1297. justify-content: space-between;
  1298. align-items: center;
  1299. padding: 0 20rpx 0 42rpx;
  1300. .btm-price {
  1301. font-size: 26rpx;
  1302. color: #56687f;
  1303. text {
  1304. color:#ff1e00 ;
  1305. }
  1306. }
  1307. .btm-btn {
  1308. width: 126rpx;
  1309. height: 48rpx;
  1310. line-height: 48rpx;
  1311. background:#ebccae;
  1312. border-radius: 10rpx;
  1313. font-size: 24rpx;
  1314. font-weight: 400;
  1315. color: #0C0A15;
  1316. text-align: center;
  1317. }
  1318. }
  1319. .add-dd {
  1320. position: absolute;
  1321. bottom: 90rpx;
  1322. right: 20rpx;
  1323. width: 110rpx;
  1324. height: 100rpx;
  1325. font-size: 24rpx;
  1326. font-weight: 500;
  1327. color: #FF5600;
  1328. text-align: center;
  1329. image {
  1330. display: block;
  1331. margin: auto;
  1332. width: 36rpx;
  1333. height: 45rpx;
  1334. }
  1335. }
  1336. }
  1337. }
  1338. </style>