product-center.html 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>产品中心-创业帮</title>
  6. <meta name="keywords" content="产品中心-创业帮">
  7. <meta name="description" content="产品中心-创业帮">
  8. <meta content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,shrink-to-fit=no,user-scalable=no" name="viewport" viewport="cover">
  9. <meta name="apple-mobile-web-app-capable" content="yes">
  10. <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
  11. <meta content="telephone=no" name="format-detection">
  12. <meta content="email=no" name="format-detection">
  13. <meta name="apple-mobile-web-app-title" content="产品中心-创业帮">
  14. <meta http-equiv="Cache-Control" content="no-siteapp">
  15. <link rel="stylesheet" href="./static/css/main.css">
  16. <style>
  17. .product-center .van-tabs__content .van-tab__pane{
  18. height:100%;
  19. }
  20. .van-tabs__content{overflow-y: auto; height:100vh !important;}
  21. .product_banner{height:auto;margin:.426667rem;}
  22. .tabs_btn .van-tab__text{display:flex;justify-content:center;align-items:center;line-height:0;}
  23. </style>
  24. </head>
  25. <body class="bgc-back ovh">
  26. <div class="iphonetitle"> </div>
  27. <div class="product-center" id="app">
  28. <van-nav-bar class="camp_title user_title_normal f16" title="创业帮产品" v-if="toptitleisshow" @click-left="goback" @click-right="gosort" right-text="产品排序" left-arrow v-cloak>
  29. <template #left>
  30. <van-icon name="arrow-left" color="#333" size="20"></van-icon>
  31. </template>
  32. </van-nav-bar>
  33. <van-tabs class="tabs_btn" v-model="active" swipeable animated line-width="20" line-height="2" :ellipsis="false" sticky>
  34. <van-tab v-for="product in productTypes" :title="product.Name">
  35. <van-pull-refresh v-model="refreshing" @refresh="onRefresh" style="height:100%;min-height:0;">
  36. <div class="product-data mt16 ml16 mr16 bgcfff" v-cloak>
  37. <div class="pt16 pb16 pl16 pr16">
  38. <div class="pb16 tl"><strong class="db f16">机具管理</strong></div>
  39. <div class="tl">
  40. <van-row>
  41. <van-col span="8" @click="gomachinetotal">
  42. <div class="f12 c999 pb6">总机具数&nbsp;&nbsp;&gt;</div>
  43. <div class="index-num-b f18 c333 b">{{product.Machine.TotalMachineCount}}</div>
  44. </van-col>
  45. <van-col span="8" @click="gomachineunbind">
  46. <div class="f12 c999 pb6">未绑定&nbsp;&nbsp;&gt;</div>
  47. <div class="index-num-b f18 c333 b">{{product.Machine.UnBindCount}}</div>
  48. </van-col>
  49. <van-col span="8" @click="gomachinebind">
  50. <div class="f12 c999 pb6">已绑定&nbsp;&nbsp;&gt;</div>
  51. <div class="index-num-b f18 c333 b">{{product.Machine.BindCount}}</div>
  52. </van-col>
  53. </van-row>
  54. </div>
  55. <div class="product-data-button tc pt16">
  56. <van-button plain @click="machineapply">机具申请</van-button>
  57. <van-button plain @click="dialoutrecord">机具券</van-button>
  58. <van-button plain @click="orderdetail">订单查询</van-button>
  59. </div>
  60. </div>
  61. </div>
  62. <div class="product_banner ovh" v-for="item in product.Advertisment" :key="item.Id" @click="bannergo(product.Id)" v-if="product.Advertisment.length !== 0"><img :src="item.BannerPic" alt="" style="float:left;"></div>
  63. <div class="product-data mt16 ml16 mr16 bgcfff mb12" v-cloak>
  64. <div class="pt16 pb8">
  65. <div class="pb16 pl16 tl"><strong class="db f16">收益查看</strong></div>
  66. <div class="tl">
  67. <van-cell-group>
  68. <van-cell title="交易分润" :value="product.Profit.TradeProfit + '元'" is-link @click="trabsactiondetail"></van-cell>
  69. <van-cell title="激活奖励" :value="product.Profit.ActProfit + '元'" is-link @click="activedetail"></van-cell>
  70. <van-cell title="开机奖励" :value="product.Profit.OpenProfit + '元'" is-link @click="bootdetail"></van-cell>
  71. <van-cell title="分红奖励" :value="product.Profit.DividendsProfit + '元'" is-link @click="bonus"></van-cell>
  72. <van-cell title="分润补贴" :value="product.Profit.OtherProfit + '元'" is-link @click="subsidydetail"></van-cell>
  73. <van-cell title="流量卡分佣" :value="product.Profit.FluxProfit + '元'" is-link @click="profitdetail" v-if="product.Id !== 6"></van-cell>
  74. </van-cell-group>
  75. </div>
  76. </div>
  77. </div>
  78. </van-pull-refresh>
  79. </van-tab>
  80. </van-tabs>
  81. </div>
  82. <script src="./static/js/klm-vv.min.js"></script>
  83. <script src="./static/js/appfunc.min.js"></script>
  84. <script src="./static/js/klm-axios-config.js"></script>
  85. <script src="./static/js/publicfn.js"></script>
  86. <script>
  87. function OnStart(){
  88. app.getproductinfo();
  89. };
  90. // 通过 CDN 引入时不会自动注册 Lazyload 组件
  91. // 可以通过下面的方式手动注册
  92. Vue.use(vant.Lazyload);
  93. //--- PublicLib.SetStatusBarStyle({type:'light', isShow:1});
  94. //--- 在 #app 标签下渲染一个按钮组件
  95. let app = new Vue({
  96. el: '#app',
  97. data() {
  98. return {
  99. refreshing: false,
  100. toptitleisshow:true,
  101. banner: [
  102. {
  103. id: 1,
  104. imgUrl: './temp/index-banner.png'
  105. },
  106. {
  107. id: 2,
  108. imgUrl: './temp/index-banner.png'
  109. }
  110. ],
  111. active: 0,
  112. showFilter: false,
  113. productTypes: [
  114. //- {
  115. //- Id: 7,
  116. //- Name: '盛付通电签',
  117. //- Machine: {
  118. //- TotalMachineCount: 1, //总机具数
  119. //- UnBindCount: 0, //未绑定机具数
  120. //- BindCount: 1, //已绑定机具数
  121. //- },
  122. //- Profit: {
  123. //- TradeProfit: 0.00, //交易分润
  124. //- ActProfit: 0.00, //激活奖励
  125. //- OpenProfit: 0.00, //开机奖励
  126. //- DividendsProfit: 0.00, //分红奖励
  127. //- OtherProfit: 0.00, //分润补贴
  128. //- FluxProfit: 0.00, //流量卡分佣
  129. //- },
  130. //- },
  131. //- {
  132. //- Id: 5,
  133. //- Name: '乐刷大POS',
  134. //- Machine: {
  135. //- TotalMachineCount: 100, //总机具数
  136. //- UnBindCount: 50, //未绑定机具数
  137. //- BindCount: 50, //已绑定机具数
  138. //- },
  139. //- Profit: {
  140. //- TradeProfit: 0.00, //交易分润
  141. //- ActProfit: 0.00, //激活奖励
  142. //- OpenProfit: 0.00, //开机奖励
  143. //- DividendsProfit: 0.00, //分红奖励
  144. //- OtherProfit: 0.00, //分润补贴
  145. //- FluxProfit: 0.00, //流量卡分佣
  146. //- },
  147. //- },
  148. ],
  149. enters: [
  150. {
  151. text: '我的业绩',
  152. icon: './static/images/product-banner1.png',
  153. value: 1
  154. },
  155. {
  156. text: '快钱资质',
  157. icon: './static/images/product-banner2.png',
  158. value: 2
  159. },
  160. {
  161. text: '操作视频',
  162. icon: './static/images/product-banner3.png',
  163. value: 3
  164. },
  165. ],
  166. loading: false,
  167. finished: false,
  168. refreshing: false,
  169. };
  170. },
  171. created() {
  172. this.getproductinfo();
  173. const name = JSON.parse(PublicLib.getCookieInfo('userInfo')).RealName;
  174. const issp = name.split('').some(item=>{
  175. return item === '*';
  176. });
  177. if(issp){
  178. return PublicLib.GoBack({Level:-1});
  179. };
  180. },
  181. methods: {
  182. onRefresh() {
  183. //- this.productTypes = [];
  184. // 清空列表数据
  185. this.getproductinfo();
  186. },
  187. page(pageid){
  188. switch(pageid){
  189. //- 操作视频
  190. case 3:
  191. PublicLib.Goto({Url:'option-video'});
  192. break;
  193. //- 块钱资质
  194. case 2:
  195. PublicLib.Goto({Url:'qualifications'});
  196. break;
  197. //- 我的业绩
  198. case 1:
  199. PublicLib.Goto({Url:'product-myperformance'});
  200. break;
  201. }
  202. },
  203. //- 获取整体机具信息
  204. async getproductinfo(){
  205. const UserId = PublicLib.getCookieInfo('userId');
  206. const res = await getRequest('api/v1/pos/kqproducts/mainstatdata?t='+Math.random(6),JSON.stringify({UserId,Distribute:1}));
  207. if(res.status !== '1')return tips('机具信息获取失败!');
  208. this.refreshing = false;
  209. res.data.forEach(item=>{
  210. item.Profit.TradeProfit = item.Profit.TradeProfit.toFixed(2);
  211. item.Profit.ActProfit = item.Profit.ActProfit.toFixed(2);
  212. item.Profit.OpenProfit = item.Profit.OpenProfit.toFixed(2);
  213. item.Profit.DividendsProfit = item.Profit.DividendsProfit.toFixed(2);
  214. item.Profit.OtherProfit = item.Profit.OtherProfit.toFixed(2);
  215. item.Profit.FluxProfit = item.Profit.FluxProfit.toFixed(2);
  216. });
  217. const productlist = [];
  218. const list = PublicLib.getCookieInfo('productCenterList') ? PublicLib.getCookieInfo('productCenterList') : '[]';
  219. const testarr = JSON.parse(list) ? JSON.parse(list) : [];
  220. const productsnum = res.data.length - testarr.length;
  221. if(productsnum !== 0){
  222. for(let i = productsnum; i > 0; i--){
  223. testarr.push(res.data[res.data.length - i].Id);
  224. };
  225. };
  226. testarr.forEach((num)=>{
  227. res.data.forEach((item,index)=>{
  228. if(item.Id === Number(num)){
  229. productlist.push(item);
  230. };
  231. });
  232. });
  233. this.productTypes = productlist;
  234. //- this.productTypes.push(...res.data);
  235. },
  236. //- 中部banner跳转地址
  237. bannergo(id){
  238. if(id === 2){
  239. //- KDB
  240. PublicLib.putCookieInfo('goIndex',1);
  241. }else if(id === 1 || id === 3){
  242. //- JK
  243. PublicLib.putCookieInfo('goIndex',2);
  244. }else if(id === 4 || id === 5){
  245. //- LS
  246. PublicLib.putCookieInfo('goIndex',3);
  247. }else if(id === 6){
  248. //- LiS
  249. PublicLib.putCookieInfo('goIndex',4);
  250. }else if(id === 7){
  251. PublicLib.putCookieInfo('goIndex',5);
  252. }
  253. PublicLib.Goto({Url:'user-service-list'});
  254. },
  255. //- 总机具数
  256. gomachinetotal(){
  257. this.gomachine();
  258. PublicLib.Goto({Url:'product-machine-total-list'});
  259. },
  260. //- 已绑定机具
  261. gomachinebind(){
  262. this.gomachine();
  263. PublicLib.Goto({Url:'product-machine-bind-list'});
  264. },
  265. //- 未绑定机具
  266. gomachineunbind(){
  267. this.gomachine();
  268. PublicLib.Goto({Url:'product-machine-unbind-list'});
  269. },
  270. //- 跳转页面需要数据
  271. gomachine(){
  272. PublicLib.putCookieInfo('productMachineType', this.productTypes[this.active].Name);
  273. PublicLib.putCookieInfo('productMachineId', this.productTypes[this.active].Id);
  274. },
  275. //- 机具申请
  276. machineapply(){
  277. this.gomachine();
  278. PublicLib.Goto({Url:'product-machine-apply-1'});
  279. },
  280. //- 返回
  281. goback(){
  282. PublicLib.GoBack({Level:1});
  283. },
  284. //- 激活奖励
  285. activedetail(){
  286. this.gomachine();
  287. PublicLib.Goto({Url:'product-profit-activation'});
  288. },
  289. //- 开机奖励
  290. bootdetail(){
  291. this.gomachine();
  292. PublicLib.Goto({Url:'product-profit-boot'});
  293. },
  294. //- 流量卡分佣
  295. profitdetail(){
  296. this.gomachine();
  297. PublicLib.Goto({Url:'product-profit-flow'});
  298. },
  299. //- 分润补贴
  300. subsidydetail(){
  301. this.gomachine();
  302. PublicLib.Goto({Url:'product-profit-subsidy'});
  303. },
  304. //- 交易分润
  305. trabsactiondetail(){
  306. this.gomachine();
  307. PublicLib.Goto({Url:'product-profit-transaction'});
  308. },
  309. //- 分红奖励
  310. bonus(){
  311. this.gomachine();
  312. PublicLib.Goto({Url:'product-profit-shareoutbonus'});
  313. },
  314. //- 订单查询
  315. orderdetail(){
  316. PublicLib.putCookieInfo('producttype', this.productTypes[this.active].Id);
  317. PublicLib.Goto({Url:'mall-deal-list'});
  318. },
  319. //- 拨出记录
  320. dialoutrecord(){
  321. this.gomachine();
  322. //- PublicLib.Goto({Url:'product-profit-dialoutrecord'});
  323. PublicLib.Goto({Url:'product-machine-transfer'});
  324. },
  325. //- 排序
  326. gosort(){
  327. PublicLib.Goto({Url:'product-center-sort'});
  328. }
  329. }
  330. });
  331. </script>
  332. </body>
  333. </html>