index.vue 31 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229
  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. that.queryHomeCardList()
  496. //that.wxPhoneLogin()
  497. this.$store.commit('mutationswxOpenData', that.wxOpenData)
  498. uni.setStorage({
  499. key: 'wxOpenData',
  500. data: that.wxOpenData,
  501. success: function () {
  502. // that.uniLogin()
  503. }
  504. });
  505. uni.setStorage({
  506. key: 'themeColor',
  507. data: that.themeColor,
  508. success: function () {
  509. // that.uniLogin()
  510. }
  511. });
  512. if(this.wxOpenData.loginInfo){
  513. this.$store.commit('mutationsuserInfo', that.wxOpenData.loginInfo.openUser)
  514. this.userInfo=that.wxOpenData.loginInfo.openUser
  515. that.queryManagerInfo()
  516. uni.setStorage({
  517. key: 'userInfo',
  518. data: that.wxOpenData.loginInfo.openUser,
  519. success: function () {
  520. that.getCarList()
  521. }
  522. });
  523. }else{
  524. this.authorizShow=true;
  525. }
  526. })
  527. },
  528. wxPhoneLogin(){
  529. var that=this;
  530. this.$http('miniApp2/sys/wxPhoneLogin', {
  531. appId:this.ext.appId,
  532. unionId:this.unionId,
  533. code:this.code,
  534. openId:this.wxOpenData.openid
  535. },'POST').then(res => {
  536. var data = res.data;
  537. if(data.loginInfo){
  538. this.userInfo=data.loginInfo.openUser;
  539. this.$store.commit('mutationsuserInfo', this.userInfo);
  540. this.$store.commit('mutationswxOpenData', data.loginInfo)
  541. uni.setStorage({
  542. key: 'userInfo',
  543. data: data.loginInfo.openUser,
  544. success: function () {
  545. that.getCarList()
  546. that.queryHomeCardList()
  547. that.queryManagerInfo()
  548. }
  549. });
  550. }
  551. })
  552. },
  553. getCarList(){
  554. this.$http('opencarOwnerHome/queryCarInfoList', {
  555. },'GET').then(res => {
  556. if(res.code==401){
  557. this.uniLogin()
  558. }else{
  559. this.carInfo=res.data[0]
  560. this.$store.commit('mutationscarInfo', this.carInfo)
  561. /* this.carInfo.insuranceExpireDate='2022-11-11';
  562. this.carInfo.nextAuditDate='2022-08-13'; */
  563. //this.carInfo.nextCareDate='2022-08-11';
  564. //this.carInfo.nextCareMilage=11
  565. this.jsTime()
  566. }
  567. })
  568. },
  569. jsTime(){
  570. if(this.carInfo.insuranceExpireDate){
  571. if (Number(new Date().getTime()) > (Number(new Date(this.carInfo.insuranceExpireDate.replace(/-/g, '/')).getTime()) || 0)) {
  572. console.log("现在时间大于开始时间")
  573. this.InsuranceExpireDate = 0
  574. } else {
  575. this.clock()
  576. }
  577. }else{
  578. this.InsuranceExpireDate=''
  579. }
  580. if(this.carInfo.nextCareDate){
  581. if (Number(new Date().getTime()) > (Number(new Date(this.carInfo.nextCareDate.replace(/-/g, '/')).getTime()) || 0)) {
  582. this.NextCareDate = 0
  583. } else {
  584. this.clock2()
  585. }
  586. }else{
  587. this.NextCareDate = ''
  588. }
  589. if(this.carInfo.nextAuditDate){
  590. if (Number(new Date().getTime()) > (Number(new Date(this.carInfo.nextAuditDate.replace(/-/g, '/')).getTime()) || 0)) {
  591. this.NextAuditDate = 0
  592. } else {
  593. this.clock3()
  594. }
  595. }else{
  596. this.NextAuditDate=''
  597. }
  598. },
  599. clock () {
  600. let _this = this
  601. let today = new Date() // 当前时间
  602. let h = today.getHours()
  603. let m = today.getMinutes()
  604. let s = today.getSeconds()
  605. let stopTime = new Date(_this.carInfo.insuranceExpireDate.replace(/-/g, '/')) // 结束时间
  606. let stopH = stopTime.getHours()
  607. let stopM = stopTime.getMinutes()
  608. let stopS = stopTime.getSeconds()
  609. let shenyu = stopTime.getTime() - today.getTime() // 倒计时毫秒数
  610. let shengyuD = parseInt(shenyu / (60 * 60 * 24 * 1000)) // 转换为天
  611. this.InsuranceExpireDate=shengyuD+1;
  612. // setTimeout(_this.clock, 500)
  613. },
  614. clock2 () {
  615. let _this = this
  616. let today = new Date() // 当前时间
  617. let stopTime = new Date(_this.carInfo.nextCareDate.replace(/-/g, '/')) // 结束时间
  618. let stopH = stopTime.getHours()
  619. let stopM = stopTime.getMinutes()
  620. let stopS = stopTime.getSeconds()
  621. let shenyu = stopTime.getTime() - today.getTime() // 倒计时毫秒数
  622. let shengyuD = parseInt(shenyu / (60 * 60 * 24 * 1000)) // 转换为天
  623. this.NextCareDate=shengyuD+1;
  624. // setTimeout(_this.clock, 500)
  625. },
  626. clock3 () {
  627. let _this = this
  628. let today = new Date() // 当前时间
  629. let stopTime = new Date(_this.carInfo.nextAuditDate.replace(/-/g, '/')) // 结束时间
  630. let shenyu = stopTime.getTime() - today.getTime() // 倒计时毫秒数
  631. let shengyuD = parseInt(shenyu / (60 * 60 * 24 * 1000)) // 转换为天
  632. this.NextAuditDate=shengyuD+1;
  633. // setTimeout(_this.clock, 500)
  634. },
  635. queryManagerInfo(){
  636. console.log("11")
  637. this.$http('openHome/queryManagerInfo', {
  638. },'GET').then(res => {
  639. this.managerInfo=res.data
  640. })
  641. },
  642. queryHomeCardList(){
  643. //console.log(this.wxOpenData)
  644. this.$http('openHome/queryHomeCardList', {
  645. unionId:this.unionId
  646. },'GET').then(res => {
  647. uni.hideLoading();
  648. this.homeCardList=res.data
  649. })
  650. },
  651. getShopinfo(num,shopId){
  652. var that=this;
  653. uni.showLoading({
  654. title: '加载中'
  655. })
  656. if(!shopId){
  657. shopId=''
  658. }
  659. this.$http('openmy/getShopinfo', {
  660. shopId:shopId
  661. },'GET').then(res => {
  662. uni.hideLoading();
  663. var res=res.data
  664. if(num==5){
  665. uni.openLocation({
  666. latitude:Number(res.lat),
  667. longitude:Number(res.lng),
  668. name: res.shopName,
  669. address: res.address,
  670. success: function() {
  671. console.log('success');
  672. },
  673. fail(err) {
  674. console.log(err)
  675. }
  676. });
  677. }else{
  678. uni.makePhoneCall({
  679. phoneNumber: res.contactorPhone
  680. });
  681. }
  682. })
  683. }
  684. }
  685. }
  686. </script>
  687. <style scoped>
  688. .bxBox{
  689. display: flex;
  690. flex-wrap: wrap;
  691. }
  692. .bxline{
  693. display: flex;
  694. padding-top: 22rpx;
  695. }
  696. .bxline1{
  697. width: 40%;
  698. }
  699. .bxline2{
  700. width: 60%;
  701. }
  702. .bxlineTitle{
  703. color: #333333;
  704. font-size: 26rpx;
  705. line-height: 37rpx;
  706. padding-left: 10rpx;
  707. }
  708. .bxlineMs1{
  709. line-height: 37rpx;
  710. color: #D53533;
  711. font-size: 26rpx;
  712. padding-left: 12rpx;
  713. }
  714. .bxlineMs2{
  715. line-height: 37rpx;
  716. color: #999999;
  717. font-size: 24rpx;
  718. padding-left: 12rpx;
  719. }
  720. .bxlineIcon{
  721. width: 34rpx;
  722. height: 34rpx;
  723. margin-left: 24rpx;
  724. }
  725. .indexTop{
  726. background: #D53533;
  727. width: 750rpx;
  728. position: fixed;
  729. top: 0;
  730. left: 0;
  731. z-index: 11;
  732. }
  733. .indexnav{
  734. height: 44px;
  735. line-height: 44px;
  736. text-align: center;
  737. font-size: 36rpx;
  738. color: #FFFFFF;
  739. }
  740. .authorizBox{
  741. width: 100vw;
  742. height: 100vh;
  743. background: rgba(0, 0, 0, 0.5);
  744. position: fixed;
  745. top: 0;
  746. left: 0;
  747. }
  748. .authorizCont{
  749. margin-top: 30vh;
  750. width: 564rpx;
  751. height: 408rpx;
  752. background: #FFFFFF;
  753. border-radius: 24rpx;
  754. margin-left: 93rpx;
  755. position: relative;
  756. }
  757. .authorizCloseImg{
  758. width: 62rpx;
  759. height: 62rpx;
  760. }
  761. .sqLogoBox{
  762. width: 180rpx;
  763. height: 180rpx;
  764. background: #FFFFFF;
  765. border-radius: 90rpx;
  766. text-align: center;
  767. position: absolute;
  768. top: -50rpx;
  769. left: 192rpx;
  770. }
  771. .authorizName{
  772. color: #333333;
  773. line-height: 42rpx;
  774. font-size: 30rpx;
  775. text-align: center;
  776. padding-top: 58rpx;
  777. }
  778. .authorizMs{
  779. color: #999999;
  780. line-height: 36rpx;
  781. font-size: 26rpx;
  782. width: 452rpx;
  783. padding-top: 24rpx;
  784. text-align: center;
  785. margin-left: 56rpx;
  786. }
  787. .authorizContbutton{
  788. width: 422rpx;
  789. height: 88rpx;
  790. background: #D53533;
  791. border-radius: 44rpx;
  792. line-height: 88rpx;
  793. text-align: center;
  794. font-size:30rpx;
  795. color: #FFFFFF;
  796. margin-top: 62rpx;
  797. margin-left:71rpx;
  798. }
  799. .content{
  800. min-height: 100vh;
  801. background: #F4F5F7;
  802. }
  803. .topBox{
  804. width: 750rpx;
  805. height: 150rpx;
  806. background: #D53533;
  807. }
  808. .yuanhu{
  809. width: 750rpx;
  810. height: 50rpx;
  811. background: #D53533;
  812. border-radius: 0 0 100% 100%;
  813. }
  814. .carinfoBox{
  815. width: 702rpx;
  816. /* height: 250rpx; */
  817. background: #FFFFFF;
  818. border-radius: 10rpx;
  819. margin-left: 24rpx;
  820. overflow: hidden;
  821. height: 270rpx;
  822. }
  823. .carinfoBox2{
  824. width: 702rpx;
  825. height: 180rpx;
  826. background: #FFFFFF;
  827. border-radius: 10rpx;
  828. margin-left: 24rpx;
  829. overflow: hidden;
  830. }
  831. .carinfoBox2{
  832. }
  833. .carinfoBox .carLogo{
  834. width: 60rpx;height: 60rpx;
  835. margin-top: 6rpx;
  836. }
  837. .carinfoBoxTop{
  838. display: flex;
  839. justify-content: space-between;
  840. padding-top: 29rpx;
  841. padding-left: 24rpx;
  842. padding-right: 20rpx;
  843. padding-bottom: 24rpx;
  844. border: 1px solid #EEEEEE;
  845. }
  846. .carinfoBoxTopCont{
  847. width: 454rpx;
  848. }
  849. .carinfoBoxTopContTop{
  850. display: flex;
  851. }
  852. .carInfoplateNumber{
  853. font-weight: 500;
  854. color: #3C3C3C;
  855. font-size: 30rpx;
  856. line-height: 42rpx;
  857. padding-right: 16rpx;
  858. }
  859. .carTnfomilage{
  860. color: #F19D01;
  861. font-size: 22rpx;
  862. padding: 0rpx 10rpx;
  863. border-radius: 4rpx;
  864. border: 1px solid #F19D01;
  865. height: 32rpx;
  866. line-height: 34rpx;
  867. margin-top: 2rpx;
  868. margin-left: 2rpx;
  869. }
  870. .carInfocarModel{
  871. width: 454rpx;
  872. color: #666666;
  873. font-size: 26rpx;
  874. white-space: nowrap;
  875. overflow: hidden;
  876. text-overflow: ellipsis;
  877. }
  878. .carinfoBoxTopRight{
  879. display: flex;padding-top: 25rpx;
  880. }
  881. .carinfoBoxTopRightIcon{
  882. width: 29rpx;
  883. height: 31rpx;
  884. }
  885. .huancheBtn{
  886. color: #666666; font-size: 26rpx;line-height: 31rpx;
  887. padding-left: 10rpx;
  888. }
  889. .carInfoBottom{
  890. display: flex;
  891. justify-content: space-around;
  892. }
  893. .carInfoBottomLineTitle{
  894. color: #999999;font-size: 24rpx;
  895. text-align: center;
  896. padding-top: 24rpx;
  897. }
  898. .carInfoBottomLineTxt{
  899. color: #3C3C3C;
  900. font-size: 26rpx;
  901. padding-top: 5rpx;
  902. text-align: center;
  903. }
  904. .carinfonocarIcon{
  905. width: 72rpx;
  906. height: 72rpx;
  907. }
  908. .carinfoBoxNocar{
  909. display: flex;
  910. padding-top: 50rpx;
  911. padding-left: 20rpx;
  912. }
  913. .carinfoBoxNocarRightTitle{
  914. font-weight: 500;
  915. color: #3C3C3C;
  916. font-size: 30rpx;
  917. }
  918. .carinfoBoxNocarRightMS{
  919. color: #666666;
  920. font-size: 26rpx;
  921. }
  922. .carinfoBoxNocarRight{
  923. padding-left: 24rpx;
  924. }
  925. .shoptopbox{
  926. margin-top: -170rpx;
  927. }
  928. .shoptopbox2{
  929. margin-top: -170rpx;
  930. }
  931. .adviser{
  932. width: 662rpx;
  933. margin-left: 24rpx;
  934. background: #FFFFFF;
  935. border-radius: 10px;
  936. display: flex;
  937. justify-content: space-between;
  938. padding: 18rpx 20rpx;
  939. margin-top: 20rpx;
  940. }
  941. .adviserLeft{
  942. display: flex;
  943. }
  944. .advisertx{
  945. width: 62rpx;height: 62rpx;
  946. }
  947. .adviserNema{
  948. color: #333333;font-size: 30rpx;
  949. line-height: 62rpx;padding-left: 24rpx;
  950. }
  951. .adviserms{
  952. width: 118rpx;
  953. height: 36rpx;
  954. border-radius: 4rpx;
  955. border: 1px solid #D53533;
  956. line-height: 36rpx;
  957. text-align: center;
  958. margin-top: 12rpx;
  959. margin-left: 20rpx;
  960. color: #D53533;
  961. font-size: 24rpx;
  962. }
  963. .adviserJt{
  964. width: 12rpx;
  965. height: 20rpx;
  966. margin-top: 20rpx;
  967. }
  968. .modular{
  969. width: 702rpx;
  970. /* height: 313rpx; */
  971. background: #FFFFFF;
  972. border-radius: 10px;
  973. margin-top: 20rpx;
  974. margin-left: 24rpx;
  975. padding-bottom: 40rpx;
  976. }
  977. .swiper-item{
  978. display: flex;
  979. flex-wrap: wrap;
  980. }
  981. .itemImg{
  982. width: 46rpx;
  983. height: 46rpx;
  984. }
  985. .Menusline{
  986. font-size: 24rpx;
  987. color: #333333;
  988. }
  989. .itemLine{
  990. width: 20%;
  991. text-align: center;
  992. padding-top: 40rpx;
  993. }
  994. .advertisement{
  995. width: 702rpx;
  996. height: 280rpx;
  997. margin-top: 20rpx;
  998. margin-left: 24rpx;
  999. border-radius: 20rpx;
  1000. }
  1001. .swiper-item2{
  1002. width: 702rpx;
  1003. height: 280px;
  1004. }
  1005. .swiper-item2Img{
  1006. width: 702rpx;
  1007. height: 280rpx;
  1008. }
  1009. .hotMoreJt{
  1010. width: 12rpx;
  1011. height: 20rpx;
  1012. margin-top: 6rpx;
  1013. }
  1014. .Hot{
  1015. width: 702rpx;
  1016. margin-top: 20rpx;
  1017. margin-left: 24rpx;
  1018. }
  1019. .hotTop{
  1020. display: flex;
  1021. justify-content: space-between;
  1022. padding: 6rpx 0;
  1023. }
  1024. .hotSx{
  1025. width: 8rpx;
  1026. height: 30rpx;
  1027. background: #FF0000;
  1028. border-radius: 5rpx;
  1029. }
  1030. .hotLeft{
  1031. display: flex;
  1032. }
  1033. .hottitle{
  1034. font-weight: 500;
  1035. color: #333333;
  1036. font-size: 30rpx;
  1037. line-height: 30rpx;
  1038. margin-left: 16rpx;
  1039. }
  1040. .hotRight{
  1041. display: flex;
  1042. }
  1043. .hotMore{
  1044. line-height: 30rpx;color: #666666;font-size: 24rpx;
  1045. margin-right: 16rpx;
  1046. }
  1047. .hotLineTopImg{
  1048. width: 702rpx;
  1049. height: 280rpx;
  1050. display: block;
  1051. }
  1052. .hotLineTop{
  1053. position: relative;
  1054. height: 280rpx;
  1055. }
  1056. .hotLine{
  1057. margin-top: 20rpx;
  1058. border-radius: 10rpx;
  1059. background: #FFFFFF;
  1060. overflow: hidden;
  1061. }
  1062. .hotlinestate1{
  1063. width: 102rpx;
  1064. height: 44rpx;
  1065. background:#FBBF00 ;
  1066. line-height: 44rpx;
  1067. font-weight: 500;
  1068. color: #333333;
  1069. font-size: 24rpx;
  1070. text-align: center;
  1071. }
  1072. .hotlinestate2{
  1073. width: 102rpx;
  1074. height: 44rpx;
  1075. background:#FF0000 ;
  1076. line-height: 44rpx;
  1077. font-weight: 500;
  1078. color: #FFFFFF;
  1079. font-size: 24rpx;
  1080. text-align: center;
  1081. }
  1082. .hotlineTimebox{
  1083. position: absolute;
  1084. left: 0;
  1085. bottom: 0;
  1086. display: flex;
  1087. align-items: flex-end;
  1088. }
  1089. .hotTime{
  1090. background: rgba(0, 0, 0, 0.5);
  1091. font-weight: 400;
  1092. color: #FFFFFF;
  1093. font-size: 24rpx;
  1094. /* line-height: 44rpx; */
  1095. padding: 5rpx 20rpx;
  1096. margin-top: 9rpx;
  1097. margin-left: -8rpx;
  1098. border-radius: 0px 10rpx 0px 0px;
  1099. }
  1100. .hotName{
  1101. padding: 24rpx 20rpx;
  1102. color: #333333;
  1103. line-height: 40rpx;
  1104. font-size: 28rpx;
  1105. }
  1106. .hotGoodsLine{
  1107. margin-top: 30rpx;
  1108. padding: 20rpx;
  1109. background: #FFFFFF;
  1110. border-radius: 16rpx;
  1111. display: flex;
  1112. }
  1113. .hotGoodsLineImg{
  1114. width: 208rpx;
  1115. height: 194rpx;
  1116. border-radius: 16rpx;
  1117. border: 1px solid #EEEEEE;
  1118. display: block;
  1119. }
  1120. .goodsName{
  1121. font-size: 28rpx;
  1122. font-family: PingFangSC-Regular, PingFang SC;
  1123. font-weight: 400;
  1124. color: #333333;
  1125. line-height: 40rpx;
  1126. text-overflow: -o-ellipsis-lastline;
  1127. overflow: hidden;
  1128. text-overflow: ellipsis;
  1129. display: -webkit-box;
  1130. -webkit-line-clamp: 2;
  1131. line-clamp: 2;
  1132. -webkit-box-orient: vertical;
  1133. }
  1134. .hotGoodsLineRIght{
  1135. padding-left: 24rpx;
  1136. }
  1137. .goodsPrice{
  1138. display: flex;
  1139. padding-top: 10rpx;
  1140. }
  1141. .goodsPrice1{
  1142. font-size: 24rpx;
  1143. font-weight: 400;
  1144. color: #FF0000;
  1145. padding-top: 8rpx;
  1146. }
  1147. .goodsPrice2{
  1148. font-size: 22rpx;
  1149. font-weight: 400;
  1150. color: #FF0000;
  1151. padding-top: 10rpx;
  1152. }
  1153. .goodsPrice3{
  1154. font-size: 32rpx;
  1155. font-weight: 500;
  1156. color: #FF0000;
  1157. }
  1158. .goodsPrice4{
  1159. font-size: 24rpx;
  1160. font-weight: 400;
  1161. color: #999999;
  1162. padding-top: 8rpx;
  1163. padding-left: 10rpx;
  1164. text-decoration:line-through;
  1165. }
  1166. .Sold{
  1167. font-weight: 400;
  1168. color: #999999;
  1169. font-size: 24rpx;
  1170. padding-top: 8rpx;
  1171. }
  1172. .jkStateImg{
  1173. width: 102rpx;
  1174. height: 53rpx;
  1175. position: relative;
  1176. }
  1177. </style>