index.vue 32 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249
  1. <template>
  2. <view class="content">
  3. <view class="indexTop" :style="{background:'#'+themeColor}" v-if="getwxLoing">
  4. <view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
  5. <view class="indexnav">{{wxOpenData.unionName}}</view>
  6. </view>
  7. <view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
  8. <view style="height: 43px;"></view>
  9. <view class="topBox" :style="{background:'#'+themeColor}" v-if="getwxLoing"></view>
  10. <view class="yuanhu" :style="{background:'#'+themeColor}" v-if="getwxLoing"></view>
  11. <view class="shoptopbox2" v-if="!carInfo">
  12. <view class="carinfoBox2">
  13. <view class="carinfoBoxNocar" @click="addCar">
  14. <img src="../../static/timg/addcar.png" alt="" class="carinfonocarIcon">
  15. <view class="carinfoBoxNocarRight">
  16. <view class="carinfoBoxNocarRightTitle">添加我的爱车</view>
  17. <view class="carinfoBoxNocarRightMS">按照车型推荐合适的商品</view>
  18. </view>
  19. </view>
  20. </view>
  21. </view>
  22. <view class="shoptopbox" v-if="carInfo">
  23. <view class="carinfoBox" >
  24. <view class="carinfoBoxTop">
  25. <img :src="carInfo.brandLogo" alt="" class="carLogo" v-if="carInfo.brandLogo">
  26. <img src="../../static/timg/nocar.png" alt="" class="carLogo" v-else>
  27. <view class="carinfoBoxTopCont">
  28. <view class="carinfoBoxTopContTop">
  29. <view class="carInfoplateNumber">{{carInfo.plateNumber}}</view>
  30. <view class="carTnfomilage" v-if="carInfo.milage">{{carInfo.milage}}km</view>
  31. </view>
  32. <view class="carInfocarModel" v-if="carInfo.carModel">{{carInfo.carModel}}</view>
  33. <view class="carInfocarModel" v-else>暂无</view>
  34. </view>
  35. <view class="carinfoBoxTopRight" @click="changeCar">
  36. <img src="../../static/timg/icon_change@2x.png" alt="" class="carinfoBoxTopRightIcon">
  37. <view class="huancheBtn">换车</view>
  38. </view>
  39. </view>
  40. <!-- <view class="carInfoBottom">
  41. <view class="carInfoBottomLine">
  42. <view class="carInfoBottomLineTitle">下次保养里程</view>
  43. <view class="carInfoBottomLineTxt" v-if="carInfo.nextCareMilage">{{carInfo.nextCareMilage}}</view>
  44. <view class="carInfoBottomLineTxt" v-else>暂无</view>
  45. </view>
  46. <view class="carInfoBottomLine">
  47. <view class="carInfoBottomLineTitle">下次保养日期</view>
  48. <view class="carInfoBottomLineTxt" v-if="carInfo.nextCareDate">{{carInfo.nextCareDate.slice(0,10)}}</view>
  49. <view class="carInfoBottomLineTxt" v-else>暂无</view>
  50. </view>
  51. <view class="carInfoBottomLine">
  52. <view class="carInfoBottomLineTitle">保养手册</view>
  53. <view class="carInfoBottomLineTxt" @click="information">点击查看</view>
  54. </view>
  55. </view> -->
  56. <view class="bxBox">
  57. <view class="bxline bxline1">
  58. <img src="../../static/timg/car1.png" alt="" class="bxlineIcon">
  59. <view class="bxlineTitle">保险</view>
  60. <view class="bxlineMs1" v-if="carInfo.insuranceExpireDate">{{InsuranceExpireDate}}天到期</view>
  61. <view class="bxlineMs2" v-else>--</view>
  62. </view>
  63. <view class="bxline bxline2">
  64. <img src="../../static/timg/car2.png" alt="" class="bxlineIcon" >
  65. <view class="bxlineTitle">下次保养</view>
  66. <view class="bxlineMs1" v-if="carInfo.nextCareDate||carInfo.nextCareMilage">
  67. <span v-if="NextCareDate||NextCareDate===0">{{NextCareDate}}天后</span>
  68. <span v-if="NextCareDate===0&&carInfo.nextCareMilage">或</span>
  69. <span v-if="carInfo.nextCareMilage&&NextCareDate">或</span>
  70. <span v-if="carInfo.nextCareMilage">{{carInfo.nextCareMilage}}km</span>
  71. </view>
  72. <view class="bxlineMs2" v-else>--</view>
  73. </view>
  74. <view class="bxline bxline1">
  75. <img src="../../static/timg/car3.png" alt="" class="bxlineIcon" >
  76. <view class="bxlineTitle">年审</view>
  77. <view class="bxlineMs1" v-if="carInfo.nextAuditDate">{{NextAuditDate}}天到期</view>
  78. <view class="bxlineMs2" v-else>--</view>
  79. </view>
  80. <view class="bxline bxline2">
  81. <img src="../../static/timg/car4.png" alt="" class="bxlineIcon" >
  82. <view class="bxlineTitle">保养手册</view>
  83. <view class="bxlineMs2" @click="information">点击查看</view>
  84. </view>
  85. </view>
  86. </view>
  87. </view>
  88. <!-- 服务顾问 -->
  89. <view class="adviser" v-if="managerInfo" @click="goMUsers()">
  90. <view class="adviserLeft">
  91. <img v-if="managerInfo.avatar" :src="managerInfo.avatar" alt="" class="advisertx">
  92. <img v-else src="../../static/timg/pic_def_ava@2x.png" alt="" class="advisertx">
  93. <view class="adviserNema">{{managerInfo.name}}</view>
  94. <view class="adviserms" :style="{border:'1px solid #'+themeColor,color:'#'+themeColor}">服务顾问</view>
  95. </view>
  96. <img src="../../static/timg/icon_arrow_right.png" alt="" class="adviserJt">
  97. </view>
  98. <!-- 中间功能应用模块 -->
  99. <view class="modular" v-if="homeCardList.application.length>0">
  100. <view class="swiper-item">
  101. <view class="itemLine" @click="goRoter(item)" v-for="(item,index) in homeCardList.application">
  102. <view><img :src="item.icon" alt="" class="itemImg"></view>
  103. <view class="Menusline">{{item.name}}</view>
  104. </view>
  105. </view>
  106. </view>
  107. <view class="advertisement" v-if="homeCardList.ad1.length>0">
  108. <swiper class="swiper2" circular :autoplay="true" :interval="interval"
  109. :duration="duration" :indicator-dots="true" indicator-color="#CCCCCC" :indicator-active-color="'#'+themeColor">
  110. <swiper-item v-for="(item,index) in homeCardList.ad1">
  111. <view class="swiper-item2" @click="goRoter(item)">
  112. <image class="swiper-item2Img" :src="item.icon" mode=""></image>
  113. </view>
  114. </swiper-item>
  115. </swiper>
  116. </view>
  117. <view class="advertisement" v-if="homeCardList.ad2.length>0">
  118. <swiper class="swiper2" circular :autoplay="true" :interval="interval"
  119. :duration="duration" :indicator-dots="true" indicator-color="#CCCCCC" :indicator-active-color="'#'+themeColor">
  120. <swiper-item v-for="(item,index) in homeCardList.ad2">
  121. <view class="swiper-item2" @click="goRoter(item)">
  122. <image class="swiper-item2Img" :src="item.icon" mode=""></image>
  123. </view>
  124. </swiper-item>
  125. </swiper>
  126. </view>
  127. <view class="advertisement" v-if="homeCardList.ad3.length>0">
  128. <swiper class="swiper2" circular :autoplay="true" :interval="interval"
  129. :duration="duration" :indicator-dots="true" indicator-color="#CCCCCC" :indicator-active-color="'#'+themeColor">
  130. <swiper-item v-for="(item,index) in homeCardList.ad3">
  131. <view class="swiper-item2" @click="goRoter(item)">
  132. <image class="swiper-item2Img" :src="item.icon" mode=""></image>
  133. </view>
  134. </swiper-item>
  135. </swiper>
  136. </view>
  137. <!-- 热门活动 -->
  138. <view v-if="homeCardList.openMActivity">
  139. <view class="Hot" v-if="homeCardList.openMActivity.openCollectingList.length>0">
  140. <view class="hotTop">
  141. <view class="hotLeft">
  142. <view class="hotSx" :style="{background:'#'+themeColor}"></view>
  143. <view class="hottitle">热门活动</view>
  144. </view>
  145. <view class="hotRight" @click="moreJk">
  146. <view class="hotMore">更多</view>
  147. <img src="../../static/timg/icon_arrow_right.png" alt="" class="hotMoreJt">
  148. </view>
  149. </view>
  150. <view class="hotLine" @click="goJk(item)" v-for="(item,index) in homeCardList.openMActivity.openCollectingList" v-if="index<homeCardList.openMActivity.showCount">
  151. <view class="hotLineTop">
  152. <image class="hotLineTopImg" :src="item.img" mode=""></image>
  153. <view class="hotlineTimebox">
  154. <!-- <view class="hotlinestate1" v-if="item.state==2">进行中</view>
  155. <view class="hotlinestate2" v-if="item.state==1">未开始</view> -->
  156. <image class="jkStateImg" v-if="item.state==2" src="../../static/img/bg_huangse.png" mode="" ></image>
  157. <image class="jkStateImg" v-if="item.state==1" src="../../static/img/bg_hongse.png" mode="" ></image>
  158. <view class="hotTime">{{item.startTime.slice(0,10)}}-{{item.endTime.slice(0,10)}}</view>
  159. </view>
  160. </view>
  161. <view class="hotName">{{item.activityName}}</view>
  162. </view>
  163. </view>
  164. </view>
  165. <!-- 热门车型 -->
  166. <view v-if="homeCardList.openMGoods">
  167. <view class="" v-if="homeCardList.openMGoods.length>0">
  168. <view class="Hot" v-if="homeCardList.openMGoods.showType==1">
  169. <view class="hotTop">
  170. <view class="hotLeft">
  171. <view class="hotSx" :style="{background:'#'+themeColor}"></view>
  172. <view class="hottitle">热门商品</view>
  173. </view>
  174. <view class="hotRight" @click="goShop">
  175. <view class="hotMore">更多</view>
  176. <img src="../../static/timg/icon_arrow_right.png" alt="" class="hotMoreJt">
  177. </view>
  178. </view>
  179. <view class="hotGoodsLine" v-for="(item,index) in homeCardList.openMGoods.goodsList" @click="goGoods(item)" v-if="index<homeCardList.openMGoods.showCount">
  180. <view>
  181. <image :src="item.url" mode="" class="hotGoodsLineImg"></image>
  182. </view>
  183. <view class="hotGoodsLineRIght">
  184. <view class="goodsName">{{item.name}}</view>
  185. <view class="Sold">
  186. <view v-if="item.showLabel&&item.showLabel.indexOf('3')!=-1">
  187. 已售 {{item.saleQty>0?item.saleQty:0}}
  188. </view>
  189. </view>
  190. <view class="goodsPrice">
  191. <view class="goodsPrice1" >{{item.saleLabel}}</view><!-- :style="{color:'#'+themeColor}" -->
  192. <view class="goodsPrice2" >¥</view>
  193. <view class="goodsPrice3" >{{item.salePrice}}
  194. <span v-if="item.categoryIds=='7B97D114-C419-42B2-9C1E-0B4CA284CDA0'">万</span>
  195. </view>
  196. <view class="goodsPrice4" v-if="item.showLabel&&item.scribingPrice&&item.showLabel.indexOf('1')!=-1">¥{{item.scribingPrice}}</view>
  197. </view>
  198. </view>
  199. </view>
  200. </view>
  201. </view>
  202. </view>
  203. <view style="height: 60rpx;"></view>
  204. <!-- 手机号授权 -->
  205. <view class="authorizBox" v-if="authorizShow" @click="authorizShow=false">
  206. <view class="authorizCont" @click.stop="">
  207. <view class="authorizName">{{wxOpenData.miniAppName}}</view>
  208. <view class="authorizMs">您好,欢迎访问本店,授权手机号登录能获取我们最新的促销活动哦~</view>
  209. <button class="authorizContbutton" type="default" open-type="getPhoneNumber" @getphonenumber="decryptPhoneNumber">授权</button>
  210. </view>
  211. <view style="text-align: center;padding-top: 56rpx;">
  212. <image src="../../static/timg/icon_guanbi@2x.png" mode="" class="authorizCloseImg"></image>
  213. </view>
  214. </view>
  215. <!-- <view @getphonenumber="decryptPhoneNumber" >shopId:{{shopId}}</view>
  216. -->
  217. </view>
  218. </template>
  219. <script>
  220. export default {
  221. data() {
  222. return {
  223. shopId: '',
  224. url:'',
  225. wxOpenData:'',
  226. code:'',
  227. carInfo:'',
  228. homeCardList:'',
  229. authorizShow:false,
  230. miniAppName:'',
  231. iStatusBarHeight:'',
  232. managerInfo:'',
  233. unionId:'',
  234. ext:'',
  235. duration:500,
  236. interval:3000,
  237. InsuranceExpireDate:'',
  238. NextCareDate:'',
  239. NextAuditDate:'',
  240. themeColor:'',
  241. getwxLoing:false,
  242. }
  243. },
  244. onLoad() {
  245. this.iStatusBarHeight = uni.getSystemInfoSync().statusBarHeight;
  246. var that=this;
  247. //this.$common.getExtStoreId()
  248. var ext=this.$common.getExtStoreId();
  249. this.ext=ext
  250. console.log(ext)
  251. //console.log( String(Date.now()))
  252. this.shopId=ext.shopId;
  253. this.url=ext.url;
  254. this.unionId=ext.unionId
  255. // uni.setStorage({
  256. // key: 'extdata',
  257. // data: {
  258. // shopId:'E37BB296-5A08-4534-859D-B351BA611AF9',
  259. // },
  260. // success: function () {
  261. // that.uniLogin()
  262. // }
  263. // });
  264. //this.userInfo = uni.getStorageSync("userInfo");
  265. this.userInfo=this.$store.state.userInfo
  266. if(this.userInfo){
  267. //this.wxOpenData = uni.getStorageSync("wxOpenData");
  268. this.getCarList();
  269. this.queryHomeCardList()
  270. this.queryManagerInfo()
  271. }else{
  272. this.uniLogin()
  273. }
  274. },
  275. onShow() {
  276. var indexaddcar = uni.getStorageSync("indexaddcar")
  277. if(indexaddcar==1){
  278. uni.removeStorageSync('indexaddcar');
  279. this.getCarList();
  280. }else{
  281. this.carInfo=this.$store.state.carInfo;
  282. this.jsTime()
  283. }
  284. },
  285. methods: {
  286. addCar(){
  287. if(!this.userInfo){
  288. this.authorizShow=true;
  289. }else{
  290. uni.navigateTo({
  291. url:'../user/addCar/addCar?type=1'
  292. })
  293. }
  294. },
  295. goShop(){
  296. uni.switchTab({
  297. url:'../shop/shop'
  298. })
  299. },
  300. moreJk(){
  301. uni.switchTab({
  302. url:'../activity/activity'
  303. })
  304. },
  305. information(){
  306. console.log('车辆信息--',this.carInfo);
  307. uni.navigateTo({
  308. url:'handbook?mileage='+this.carInfo.milage+'&liyangId='+this.carInfo.nLevelID
  309. })
  310. },
  311. changeCar(){
  312. uni.navigateTo({
  313. url:'../user/addCar/cailist'
  314. })
  315. },
  316. goMUsers(){
  317. if(!this.userInfo){
  318. this.authorizShow=true;
  319. }else{
  320. uni.navigateTo({
  321. url:'../index/personalCard?adInfo='+JSON.stringify(this.managerInfo)
  322. })
  323. }
  324. },
  325. goGoods(item){
  326. if(!this.userInfo){
  327. this.authorizShow=true;
  328. }else{
  329. uni.navigateTo({
  330. url:'../shop/goodsDetail?id='+item.id
  331. })
  332. }
  333. },
  334. goJk(item){
  335. if(!this.userInfo){
  336. this.authorizShow=true;
  337. }else{
  338. uni.navigateTo({
  339. url:'../activity/jkDetail?id='+item.id
  340. })
  341. }
  342. },
  343. goRoter(item){
  344. console.log(item)
  345. if(!this.userInfo){
  346. this.authorizShow=true;
  347. }else{
  348. if(item.bizType==0){
  349. if(item.name=='新车'){ //
  350. uni.navigateTo({
  351. url:'newCar'
  352. })
  353. }else if(item.name=='二手车'){
  354. uni.navigateTo({
  355. url:'usedCar'
  356. })
  357. }else if(item.name=='爱车估价'){
  358. uni.navigateTo({
  359. url:'evaluation'
  360. })
  361. }
  362. else{
  363. uni.showToast({
  364. title: '敬请期待',
  365. icon:'none',
  366. duration: 3000
  367. });
  368. }
  369. }else if(item.bizType==1){ //紧急救援
  370. uni.navigateTo({
  371. url:'rescue'
  372. })
  373. }else if(item.bizType==2){ //钣金喷漆
  374. uni.navigateTo({
  375. url:'paint'
  376. })
  377. }else if(item.bizType==3){ //保养
  378. uni.navigateTo({
  379. url:'maintain'
  380. })
  381. }else if(item.bizType==4){ //在线预约
  382. uni.navigateTo({
  383. url:'onlineBooking?naShopId='+item.naShopId
  384. })
  385. }else if(item.bizType==5){ //导航
  386. this.getShopinfo(5,item.reShopId)
  387. }else if(item.bizType==6){ //联系本店
  388. this.getShopinfo(6,item.orShopId)
  389. }else if(item.bizType==7){ //7门店列表
  390. uni.navigateTo({
  391. url:'shopList'
  392. })
  393. }else if(item.bizType==8){ //我的会员卡
  394. uni.navigateTo({
  395. url:'vipCard'
  396. })
  397. }else if(item.bizType==9){ //我的优惠券
  398. uni.navigateTo({
  399. url:'discountCard'
  400. })
  401. }else if(item.bizType==10){ //我的订单
  402. uni.navigateTo({
  403. url:'../user/myOrder/myOrder'
  404. })
  405. }else if(item.bizType==11){ //我的预约
  406. uni.navigateTo({
  407. url:'../user/myBespeak'
  408. })
  409. }else if(item.bizType==12){ //历史消费
  410. uni.navigateTo({
  411. url:'../user/historySpend'
  412. })
  413. }else if(item.bizType==12){ //历史消费
  414. uni.navigateTo({
  415. url:'../user/historySpend'
  416. })
  417. }else if(item.bizType==13){ //车检报告
  418. uni.navigateTo({
  419. url:'../user/checkReport'
  420. })
  421. }else if(item.bizType==14){ //指定商品分类
  422. uni.setStorage({
  423. key: 'shopcategoryID',
  424. data: item.bizId,
  425. success: function () {
  426. getApp().globalData.shopcategoryID=item.bizId;
  427. uni.switchTab({
  428. url:'../shop/shop?shopcategoryID='+ item.bizId
  429. })
  430. }
  431. });
  432. }else if(item.bizType==15){ //商品详情
  433. uni.navigateTo({
  434. url:'../shop/goodsDetail?id=CD2D70DC-706C-4441-9864-33BD19457CAE'
  435. })
  436. }
  437. // uni.navigateTo({
  438. // url:url
  439. // })
  440. }
  441. },
  442. decryptPhoneNumber: function(e) {
  443. console.log(e);
  444. this.code=e.detail.code
  445. this.wxPhoneLogin()
  446. this.authorizShow=false;
  447. },
  448. wxgologin(){
  449. var that=this;
  450. uni.getUserProfile({
  451. lang:'zh_CN',
  452. desc:'登录',
  453. success:(res)=>{
  454. console.log(res);
  455. that.wxdata=res;
  456. uni.setStorage({
  457. key: 'wxdata',
  458. data: res,
  459. success: function () {
  460. that.uniLogin()
  461. }
  462. });
  463. },
  464. fail:(res)=>{
  465. console.log(res)
  466. }
  467. });
  468. },
  469. uniLogin(){
  470. var that=this;
  471. uni.login({
  472. provider: 'weixin',
  473. success: function (loginRes) {
  474. console.log(loginRes);
  475. that.getWxOpenID(loginRes)
  476. }
  477. });
  478. },
  479. getWxOpenID(e){
  480. var that=this;
  481. uni.showLoading({
  482. title: '加载中'
  483. })
  484. this.$http('miniApp2/sys/getWxOpenID', {
  485. code:e.code,
  486. unionId:this.unionId
  487. },'GET').then(res => {
  488. this.wxOpenData=res.data;
  489. this.themeColor=res.data.themeColor
  490. //this.themeColor='FFFFFF'
  491. this.getwxLoing=true;
  492. uni.setNavigationBarTitle({
  493. title:this.wxOpenData.miniAppName
  494. })
  495. if(this.themeColor=='6F2BE8'){
  496. var backgroundImage='/static/tabimg/index6F2BE8.png'
  497. }
  498. if(this.themeColor=='1677FF'){
  499. var backgroundImage='/static/tabimg/index1677FF.png'
  500. }
  501. if(this.themeColor=='FF4F00'){
  502. var backgroundImage='/static/tabimg/indexFF4F00.png'
  503. }
  504. if(this.themeColor=='D53533'){
  505. var backgroundImage='/static/tabimg/index1.png'
  506. }
  507. uni.setTabBarStyle({
  508. // color: '#FF0000',
  509. selectedColor: '#'+this.themeColor,
  510. })
  511. uni.setTabBarItem({
  512. index: 0,
  513. text: '首页',
  514. selectedIconPath: backgroundImage
  515. })
  516. that.queryHomeCardList()
  517. //that.wxPhoneLogin()
  518. this.$store.commit('mutationswxOpenData', that.wxOpenData)
  519. uni.setStorage({
  520. key: 'wxOpenData',
  521. data: that.wxOpenData,
  522. success: function () {
  523. // that.uniLogin()
  524. }
  525. });
  526. uni.setStorage({
  527. key: 'themeColor',
  528. data: that.themeColor,
  529. success: function () {
  530. // that.uniLogin()
  531. }
  532. });
  533. if(this.wxOpenData.loginInfo){
  534. this.$store.commit('mutationsuserInfo', that.wxOpenData.loginInfo.openUser)
  535. this.userInfo=that.wxOpenData.loginInfo.openUser
  536. that.queryManagerInfo()
  537. uni.setStorage({
  538. key: 'userInfo',
  539. data: that.wxOpenData.loginInfo.openUser,
  540. success: function () {
  541. that.getCarList()
  542. }
  543. });
  544. }else{
  545. this.authorizShow=true;
  546. }
  547. })
  548. },
  549. wxPhoneLogin(){
  550. var that=this;
  551. this.$http('miniApp2/sys/wxPhoneLogin', {
  552. appId:this.ext.appId,
  553. unionId:this.unionId,
  554. code:this.code,
  555. openId:this.wxOpenData.openid
  556. },'POST').then(res => {
  557. var data = res.data;
  558. if(data.loginInfo){
  559. this.userInfo=data.loginInfo.openUser;
  560. this.$store.commit('mutationsuserInfo', this.userInfo);
  561. this.$store.commit('mutationswxOpenData', data.loginInfo)
  562. uni.setStorage({
  563. key: 'userInfo',
  564. data: data.loginInfo.openUser,
  565. success: function () {
  566. that.getCarList()
  567. that.queryHomeCardList()
  568. that.queryManagerInfo()
  569. }
  570. });
  571. }
  572. })
  573. },
  574. getCarList(){
  575. this.$http('opencarOwnerHome/queryCarInfoList', {
  576. },'GET').then(res => {
  577. if(res.code==401){
  578. this.uniLogin()
  579. }else{
  580. this.carInfo=res.data[0]
  581. this.$store.commit('mutationscarInfo', this.carInfo)
  582. /* this.carInfo.insuranceExpireDate='2022-11-11';
  583. this.carInfo.nextAuditDate='2022-08-13'; */
  584. //this.carInfo.nextCareDate='2022-08-11';
  585. //this.carInfo.nextCareMilage=11
  586. this.jsTime()
  587. }
  588. })
  589. },
  590. jsTime(){
  591. if(this.carInfo.insuranceExpireDate){
  592. if (Number(new Date().getTime()) > (Number(new Date(this.carInfo.insuranceExpireDate.replace(/-/g, '/')).getTime()) || 0)) {
  593. console.log("现在时间大于开始时间")
  594. this.InsuranceExpireDate = 0
  595. } else {
  596. this.clock()
  597. }
  598. }else{
  599. this.InsuranceExpireDate=''
  600. }
  601. if(this.carInfo.nextCareDate){
  602. if (Number(new Date().getTime()) > (Number(new Date(this.carInfo.nextCareDate.replace(/-/g, '/')).getTime()) || 0)) {
  603. this.NextCareDate = 0
  604. } else {
  605. this.clock2()
  606. }
  607. }else{
  608. this.NextCareDate = ''
  609. }
  610. if(this.carInfo.nextAuditDate){
  611. if (Number(new Date().getTime()) > (Number(new Date(this.carInfo.nextAuditDate.replace(/-/g, '/')).getTime()) || 0)) {
  612. this.NextAuditDate = 0
  613. } else {
  614. this.clock3()
  615. }
  616. }else{
  617. this.NextAuditDate=''
  618. }
  619. },
  620. clock () {
  621. let _this = this
  622. let today = new Date() // 当前时间
  623. let h = today.getHours()
  624. let m = today.getMinutes()
  625. let s = today.getSeconds()
  626. let stopTime = new Date(_this.carInfo.insuranceExpireDate.replace(/-/g, '/')) // 结束时间
  627. let stopH = stopTime.getHours()
  628. let stopM = stopTime.getMinutes()
  629. let stopS = stopTime.getSeconds()
  630. let shenyu = stopTime.getTime() - today.getTime() // 倒计时毫秒数
  631. let shengyuD = parseInt(shenyu / (60 * 60 * 24 * 1000)) // 转换为天
  632. this.InsuranceExpireDate=shengyuD+1;
  633. // setTimeout(_this.clock, 500)
  634. },
  635. clock2 () {
  636. let _this = this
  637. let today = new Date() // 当前时间
  638. let stopTime = new Date(_this.carInfo.nextCareDate.replace(/-/g, '/')) // 结束时间
  639. let stopH = stopTime.getHours()
  640. let stopM = stopTime.getMinutes()
  641. let stopS = stopTime.getSeconds()
  642. let shenyu = stopTime.getTime() - today.getTime() // 倒计时毫秒数
  643. let shengyuD = parseInt(shenyu / (60 * 60 * 24 * 1000)) // 转换为天
  644. this.NextCareDate=shengyuD+1;
  645. // setTimeout(_this.clock, 500)
  646. },
  647. clock3 () {
  648. let _this = this
  649. let today = new Date() // 当前时间
  650. let stopTime = new Date(_this.carInfo.nextAuditDate.replace(/-/g, '/')) // 结束时间
  651. let shenyu = stopTime.getTime() - today.getTime() // 倒计时毫秒数
  652. let shengyuD = parseInt(shenyu / (60 * 60 * 24 * 1000)) // 转换为天
  653. this.NextAuditDate=shengyuD+1;
  654. // setTimeout(_this.clock, 500)
  655. },
  656. queryManagerInfo(){
  657. console.log("11")
  658. this.$http('openHome/queryManagerInfo', {
  659. },'GET').then(res => {
  660. this.managerInfo=res.data
  661. })
  662. },
  663. queryHomeCardList(){
  664. //console.log(this.wxOpenData)
  665. this.$http('openHome/queryHomeCardList', {
  666. unionId:this.unionId
  667. },'GET').then(res => {
  668. uni.hideLoading();
  669. this.homeCardList=res.data
  670. })
  671. },
  672. getShopinfo(num,shopId){
  673. var that=this;
  674. uni.showLoading({
  675. title: '加载中'
  676. })
  677. if(!shopId){
  678. shopId=''
  679. }
  680. this.$http('openmy/getShopinfo', {
  681. shopId:shopId
  682. },'GET').then(res => {
  683. uni.hideLoading();
  684. var res=res.data
  685. if(num==5){
  686. uni.openLocation({
  687. latitude:Number(res.lat),
  688. longitude:Number(res.lng),
  689. name: res.shopName,
  690. address: res.address,
  691. success: function() {
  692. console.log('success');
  693. },
  694. fail(err) {
  695. console.log(err)
  696. }
  697. });
  698. }else{
  699. uni.makePhoneCall({
  700. phoneNumber: res.contactorPhone
  701. });
  702. }
  703. })
  704. }
  705. }
  706. }
  707. </script>
  708. <style scoped>
  709. .bxBox{
  710. display: flex;
  711. flex-wrap: wrap;
  712. }
  713. .bxline{
  714. display: flex;
  715. padding-top: 22rpx;
  716. }
  717. .bxline1{
  718. width: 40%;
  719. }
  720. .bxline2{
  721. width: 60%;
  722. }
  723. .bxlineTitle{
  724. color: #333333;
  725. font-size: 26rpx;
  726. line-height: 37rpx;
  727. padding-left: 10rpx;
  728. }
  729. .bxlineMs1{
  730. line-height: 37rpx;
  731. color: #D53533;
  732. font-size: 26rpx;
  733. padding-left: 12rpx;
  734. }
  735. .bxlineMs2{
  736. line-height: 37rpx;
  737. color: #999999;
  738. font-size: 24rpx;
  739. padding-left: 12rpx;
  740. }
  741. .bxlineIcon{
  742. width: 34rpx;
  743. height: 34rpx;
  744. margin-left: 24rpx;
  745. }
  746. .indexTop{
  747. background: #D53533;
  748. width: 750rpx;
  749. position: fixed;
  750. top: 0;
  751. left: 0;
  752. z-index: 11;
  753. }
  754. .indexnav{
  755. height: 44px;
  756. line-height: 44px;
  757. text-align: center;
  758. font-size: 36rpx;
  759. color: #FFFFFF;
  760. }
  761. .authorizBox{
  762. width: 100vw;
  763. height: 100vh;
  764. background: rgba(0, 0, 0, 0.5);
  765. position: fixed;
  766. top: 0;
  767. left: 0;
  768. }
  769. .authorizCont{
  770. margin-top: 30vh;
  771. width: 564rpx;
  772. height: 408rpx;
  773. background: #FFFFFF;
  774. border-radius: 24rpx;
  775. margin-left: 93rpx;
  776. position: relative;
  777. }
  778. .authorizCloseImg{
  779. width: 62rpx;
  780. height: 62rpx;
  781. }
  782. .sqLogoBox{
  783. width: 180rpx;
  784. height: 180rpx;
  785. background: #FFFFFF;
  786. border-radius: 90rpx;
  787. text-align: center;
  788. position: absolute;
  789. top: -50rpx;
  790. left: 192rpx;
  791. }
  792. .authorizName{
  793. color: #333333;
  794. line-height: 42rpx;
  795. font-size: 30rpx;
  796. text-align: center;
  797. padding-top: 58rpx;
  798. }
  799. .authorizMs{
  800. color: #999999;
  801. line-height: 36rpx;
  802. font-size: 26rpx;
  803. width: 452rpx;
  804. padding-top: 24rpx;
  805. text-align: center;
  806. margin-left: 56rpx;
  807. }
  808. .authorizContbutton{
  809. width: 422rpx;
  810. height: 88rpx;
  811. background: #D53533;
  812. border-radius: 44rpx;
  813. line-height: 88rpx;
  814. text-align: center;
  815. font-size:30rpx;
  816. color: #FFFFFF;
  817. margin-top: 62rpx;
  818. margin-left:71rpx;
  819. }
  820. .content{
  821. min-height: 100vh;
  822. background: #F4F5F7;
  823. }
  824. .topBox{
  825. width: 750rpx;
  826. height: 150rpx;
  827. background: #D53533;
  828. }
  829. .yuanhu{
  830. width: 750rpx;
  831. height: 50rpx;
  832. background: #D53533;
  833. border-radius: 0 0 100% 100%;
  834. }
  835. .carinfoBox{
  836. width: 702rpx;
  837. /* height: 250rpx; */
  838. background: #FFFFFF;
  839. border-radius: 10rpx;
  840. margin-left: 24rpx;
  841. overflow: hidden;
  842. height: 270rpx;
  843. }
  844. .carinfoBox2{
  845. width: 702rpx;
  846. height: 180rpx;
  847. background: #FFFFFF;
  848. border-radius: 10rpx;
  849. margin-left: 24rpx;
  850. overflow: hidden;
  851. }
  852. .carinfoBox2{
  853. }
  854. .carinfoBox .carLogo{
  855. width: 60rpx;height: 60rpx;
  856. margin-top: 6rpx;
  857. }
  858. .carinfoBoxTop{
  859. display: flex;
  860. justify-content: space-between;
  861. padding-top: 29rpx;
  862. padding-left: 24rpx;
  863. padding-right: 20rpx;
  864. padding-bottom: 24rpx;
  865. border: 1px solid #EEEEEE;
  866. }
  867. .carinfoBoxTopCont{
  868. width: 454rpx;
  869. }
  870. .carinfoBoxTopContTop{
  871. display: flex;
  872. }
  873. .carInfoplateNumber{
  874. font-weight: 500;
  875. color: #3C3C3C;
  876. font-size: 30rpx;
  877. line-height: 42rpx;
  878. padding-right: 16rpx;
  879. }
  880. .carTnfomilage{
  881. color: #F19D01;
  882. font-size: 22rpx;
  883. padding: 0rpx 10rpx;
  884. border-radius: 4rpx;
  885. border: 1px solid #F19D01;
  886. height: 32rpx;
  887. line-height: 34rpx;
  888. margin-top: 2rpx;
  889. margin-left: 2rpx;
  890. }
  891. .carInfocarModel{
  892. width: 454rpx;
  893. color: #666666;
  894. font-size: 26rpx;
  895. white-space: nowrap;
  896. overflow: hidden;
  897. text-overflow: ellipsis;
  898. }
  899. .carinfoBoxTopRight{
  900. display: flex;padding-top: 25rpx;
  901. }
  902. .carinfoBoxTopRightIcon{
  903. width: 29rpx;
  904. height: 31rpx;
  905. }
  906. .huancheBtn{
  907. color: #666666; font-size: 26rpx;line-height: 31rpx;
  908. padding-left: 10rpx;
  909. }
  910. .carInfoBottom{
  911. display: flex;
  912. justify-content: space-around;
  913. }
  914. .carInfoBottomLineTitle{
  915. color: #999999;font-size: 24rpx;
  916. text-align: center;
  917. padding-top: 24rpx;
  918. }
  919. .carInfoBottomLineTxt{
  920. color: #3C3C3C;
  921. font-size: 26rpx;
  922. padding-top: 5rpx;
  923. text-align: center;
  924. }
  925. .carinfonocarIcon{
  926. width: 72rpx;
  927. height: 72rpx;
  928. }
  929. .carinfoBoxNocar{
  930. display: flex;
  931. padding-top: 50rpx;
  932. padding-left: 20rpx;
  933. }
  934. .carinfoBoxNocarRightTitle{
  935. font-weight: 500;
  936. color: #3C3C3C;
  937. font-size: 30rpx;
  938. }
  939. .carinfoBoxNocarRightMS{
  940. color: #666666;
  941. font-size: 26rpx;
  942. }
  943. .carinfoBoxNocarRight{
  944. padding-left: 24rpx;
  945. }
  946. .shoptopbox{
  947. margin-top: -170rpx;
  948. }
  949. .shoptopbox2{
  950. margin-top: -170rpx;
  951. }
  952. .adviser{
  953. width: 662rpx;
  954. margin-left: 24rpx;
  955. background: #FFFFFF;
  956. border-radius: 10px;
  957. display: flex;
  958. justify-content: space-between;
  959. padding: 18rpx 20rpx;
  960. margin-top: 20rpx;
  961. }
  962. .adviserLeft{
  963. display: flex;
  964. }
  965. .advisertx{
  966. width: 62rpx;height: 62rpx;
  967. }
  968. .adviserNema{
  969. color: #333333;font-size: 30rpx;
  970. line-height: 62rpx;padding-left: 24rpx;
  971. }
  972. .adviserms{
  973. width: 118rpx;
  974. height: 36rpx;
  975. border-radius: 4rpx;
  976. border: 1px solid #D53533;
  977. line-height: 36rpx;
  978. text-align: center;
  979. margin-top: 12rpx;
  980. margin-left: 20rpx;
  981. color: #D53533;
  982. font-size: 24rpx;
  983. }
  984. .adviserJt{
  985. width: 12rpx;
  986. height: 20rpx;
  987. margin-top: 20rpx;
  988. }
  989. .modular{
  990. width: 702rpx;
  991. /* height: 313rpx; */
  992. background: #FFFFFF;
  993. border-radius: 10px;
  994. margin-top: 20rpx;
  995. margin-left: 24rpx;
  996. padding-bottom: 40rpx;
  997. }
  998. .swiper-item{
  999. display: flex;
  1000. flex-wrap: wrap;
  1001. }
  1002. .itemImg{
  1003. width: 46rpx;
  1004. height: 46rpx;
  1005. }
  1006. .Menusline{
  1007. font-size: 24rpx;
  1008. color: #333333;
  1009. }
  1010. .itemLine{
  1011. width: 20%;
  1012. text-align: center;
  1013. padding-top: 40rpx;
  1014. }
  1015. .advertisement{
  1016. width: 702rpx;
  1017. height: 280rpx;
  1018. margin-top: 20rpx;
  1019. margin-left: 24rpx;
  1020. border-radius: 20rpx;
  1021. }
  1022. .swiper-item2{
  1023. width: 702rpx;
  1024. height: 280px;
  1025. }
  1026. .swiper-item2Img{
  1027. width: 702rpx;
  1028. height: 280rpx;
  1029. }
  1030. .hotMoreJt{
  1031. width: 12rpx;
  1032. height: 20rpx;
  1033. margin-top: 6rpx;
  1034. }
  1035. .Hot{
  1036. width: 702rpx;
  1037. margin-top: 20rpx;
  1038. margin-left: 24rpx;
  1039. }
  1040. .hotTop{
  1041. display: flex;
  1042. justify-content: space-between;
  1043. padding: 6rpx 0;
  1044. }
  1045. .hotSx{
  1046. width: 8rpx;
  1047. height: 30rpx;
  1048. background: #FF0000;
  1049. border-radius: 5rpx;
  1050. }
  1051. .hotLeft{
  1052. display: flex;
  1053. }
  1054. .hottitle{
  1055. font-weight: 500;
  1056. color: #333333;
  1057. font-size: 30rpx;
  1058. line-height: 30rpx;
  1059. margin-left: 16rpx;
  1060. }
  1061. .hotRight{
  1062. display: flex;
  1063. }
  1064. .hotMore{
  1065. line-height: 30rpx;color: #666666;font-size: 24rpx;
  1066. margin-right: 16rpx;
  1067. }
  1068. .hotLineTopImg{
  1069. width: 702rpx;
  1070. height: 280rpx;
  1071. display: block;
  1072. }
  1073. .hotLineTop{
  1074. position: relative;
  1075. height: 280rpx;
  1076. }
  1077. .hotLine{
  1078. margin-top: 20rpx;
  1079. border-radius: 10rpx;
  1080. background: #FFFFFF;
  1081. overflow: hidden;
  1082. }
  1083. .hotlinestate1{
  1084. width: 102rpx;
  1085. height: 44rpx;
  1086. background:#FBBF00 ;
  1087. line-height: 44rpx;
  1088. font-weight: 500;
  1089. color: #333333;
  1090. font-size: 24rpx;
  1091. text-align: center;
  1092. }
  1093. .hotlinestate2{
  1094. width: 102rpx;
  1095. height: 44rpx;
  1096. background:#FF0000 ;
  1097. line-height: 44rpx;
  1098. font-weight: 500;
  1099. color: #FFFFFF;
  1100. font-size: 24rpx;
  1101. text-align: center;
  1102. }
  1103. .hotlineTimebox{
  1104. position: absolute;
  1105. left: 0;
  1106. bottom: 0;
  1107. display: flex;
  1108. align-items: flex-end;
  1109. }
  1110. .hotTime{
  1111. background: rgba(0, 0, 0, 0.5);
  1112. font-weight: 400;
  1113. color: #FFFFFF;
  1114. font-size: 24rpx;
  1115. /* line-height: 44rpx; */
  1116. padding: 5rpx 20rpx;
  1117. margin-top: 9rpx;
  1118. margin-left: -8rpx;
  1119. border-radius: 0px 10rpx 0px 0px;
  1120. }
  1121. .hotName{
  1122. padding: 24rpx 20rpx;
  1123. color: #333333;
  1124. line-height: 40rpx;
  1125. font-size: 28rpx;
  1126. }
  1127. .hotGoodsLine{
  1128. margin-top: 30rpx;
  1129. padding: 20rpx;
  1130. background: #FFFFFF;
  1131. border-radius: 16rpx;
  1132. display: flex;
  1133. }
  1134. .hotGoodsLineImg{
  1135. width: 208rpx;
  1136. height: 194rpx;
  1137. border-radius: 16rpx;
  1138. border: 1px solid #EEEEEE;
  1139. display: block;
  1140. }
  1141. .goodsName{
  1142. font-size: 28rpx;
  1143. font-family: PingFangSC-Regular, PingFang SC;
  1144. font-weight: 400;
  1145. color: #333333;
  1146. line-height: 40rpx;
  1147. text-overflow: -o-ellipsis-lastline;
  1148. overflow: hidden;
  1149. text-overflow: ellipsis;
  1150. display: -webkit-box;
  1151. -webkit-line-clamp: 2;
  1152. line-clamp: 2;
  1153. -webkit-box-orient: vertical;
  1154. }
  1155. .hotGoodsLineRIght{
  1156. padding-left: 24rpx;
  1157. }
  1158. .goodsPrice{
  1159. display: flex;
  1160. padding-top: 10rpx;
  1161. }
  1162. .goodsPrice1{
  1163. font-size: 24rpx;
  1164. font-weight: 400;
  1165. color: #FF0000;
  1166. padding-top: 8rpx;
  1167. }
  1168. .goodsPrice2{
  1169. font-size: 22rpx;
  1170. font-weight: 400;
  1171. color: #FF0000;
  1172. padding-top: 10rpx;
  1173. }
  1174. .goodsPrice3{
  1175. font-size: 32rpx;
  1176. font-weight: 500;
  1177. color: #FF0000;
  1178. }
  1179. .goodsPrice4{
  1180. font-size: 24rpx;
  1181. font-weight: 400;
  1182. color: #999999;
  1183. padding-top: 8rpx;
  1184. padding-left: 10rpx;
  1185. text-decoration:line-through;
  1186. }
  1187. .Sold{
  1188. font-weight: 400;
  1189. color: #999999;
  1190. font-size: 24rpx;
  1191. padding-top: 8rpx;
  1192. }
  1193. .jkStateImg{
  1194. width: 102rpx;
  1195. height: 53rpx;
  1196. position: relative;
  1197. }
  1198. </style>