index.vue 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527
  1. <template>
  2. <view class="content" style="background: #F4F5F7;">
  3. <view class="qwTsBox" v-if="qwtsShow">
  4. <view class="qwTsTxt">{{msg}}</view>
  5. </view>
  6. <view class="indexTop" v-if="userDetail">
  7. <view class="top">
  8. <view>
  9. <image class="logo" :src="userDetail.avatar"></image>
  10. </view>
  11. <view class="topRight">
  12. <view class="wxName">{{userDetail.name}}</view>
  13. <view class="titleBox">
  14. <view class="title" v-for="(item,index) in customerInfo.lables">{{item.name}}</view>
  15. </view>
  16. </view>
  17. </view>
  18. <view class="tabBox">
  19. <view class="tabline" :class="{tabActive:tabIndex==1}" @click="tabFn(1)">客户信息</view>
  20. <view class="tabline" :class="{tabActive:tabIndex==2}" @click="tabFn(2)">车辆信息</view>
  21. <view class="tabline" :class="{tabActive:tabIndex==3}" @click="tabFn(3)">套餐余额</view>
  22. <view class="tabline" :class="{tabActive:tabIndex==4}" @click="tabFn(4)">优惠券</view>
  23. <view class="tabline" :class="{tabActive:tabIndex==5}" @click="tabFn(5)">消费历史</view>
  24. </view>
  25. </view>
  26. <view class="indexCont">
  27. <custom ref="customView" :token="token" @getUser="getUser" v-show="tabIndex==1"></custom>
  28. <car ref="carView" :token="token" v-show="tabIndex==2"></car>
  29. <packageV ref="packageView" v-show="tabIndex==3"></packageV>
  30. <coupon ref="couponView" v-show="tabIndex==4"></coupon>
  31. <consumption ref="consumptionView" v-show="tabIndex==5"></consumption>
  32. </view>
  33. <!-- <view>{{code}}</view>
  34. <view @click="copy(code)">复制code</view> -->
  35. <!--<view style="color: red;">{{userId}}</view>
  36. <view @click="copy(userId)">复制userId</view>
  37. <view @click="copy(token)">{{token}}</view>
  38. <view>{{agentId}}</view> -->
  39. <!-- <view @click="oAuth">重新授权</view> -->
  40. <!-- <view style="color: red;">{{userId}}</view>
  41. <view @click="copy(userId)">复制userId</view>
  42. <view>{{token}}</view>
  43. <view @click="copy(token)">复制token</view> -->
  44. <!-- <view>agentId:{{agentId}}</view> -->
  45. <!-- <view>code1:{{code1}}</view>
  46. <view>code2:{{code2}}</view>
  47. <view>code3:{{code3}}</view> -->
  48. </view>
  49. </template>
  50. <script>
  51. import custom from './custom.vue'
  52. import car from './car.vue'
  53. import packageV from './package.vue'
  54. import coupon from './coupon.vue'
  55. import consumption from './consumption.vue'
  56. export default {
  57. components: {
  58. custom,car,packageV,coupon,consumption
  59. },
  60. data() {
  61. return {
  62. title: 'Hello',
  63. tabIndex:1,
  64. token:'',
  65. code:'',
  66. userId:'',
  67. userDetail:'',
  68. customerInfo:'',
  69. corpID:'',
  70. agentId:'',
  71. unionID:'',
  72. qwtsShow:false,
  73. code1:'',
  74. code2:'',
  75. code3:'',
  76. msg:'',
  77. }
  78. },
  79. onLoad() {
  80. var that=this
  81. this.code=uni.getStorageSync('code')
  82. this.token=uni.getStorageSync('token')
  83. this.corpID=uni.getStorageSync('corpID')
  84. this.agentId=uni.getStorageSync('agentId')
  85. console.log(this.$configUrl)
  86. /* this.corpID='wpMGjbBgAA_zIu6wbKy48zFSbGiGeP8g'
  87. this.agentId='1000051'
  88. this.userId='wmMGjbBgAA0JAbGD5Vu8BzEuYgZhvhOA'
  89. this.token='D226815BF1F1A11DE73489E7B8B3F7CEB2FA7AB1E002EF21F835C7D505158C7DAF945459643F62A3A6FD87751E6880BB'
  90. */
  91. //this.token='26AF53EA2DC528681ABD7B3AC46072E96F0A964431A2453CF0F1DA1C28732A1EAF945459643F62A3A6FD87751E6880BB'
  92. //this.userId='wmMGjbBgAALroygkoaVBN4-W2O1daIkg'
  93. //this.token='065BAA93971FEB1A37A08D682FCDB41CC69E76FC36BB038790FB99C5CD71C28EAF945459643F62A3A6FD87751E6880BB'
  94. //this.userId='wmMGjbBgAAeKTdCmEN0CLKPNwJ4ACTxw'
  95. //this.token='0A809B6077F4044EDECFC49762B59668E9508B2CA4C6C4791C8894B2B1A7338AAF945459643F62A3A6FD87751E6880BB'
  96. /* uni.setStorage({
  97. key: 'token',
  98. data: that.token,
  99. success: function () {
  100. that.extCustomerInfo()
  101. that.extUserDetail()
  102. }
  103. });
  104. uni.setStorage({
  105. key: 'userId',
  106. data: that.userId,
  107. success: function () {
  108. }
  109. }); */
  110. /* this.code='aSBU0ums_4Z3ofjrfgSlYppwI9Cku5qtIg45ECkJTYY'
  111. */
  112. /* if(!this.token){
  113. this.authUserInfo()
  114. }else{
  115. this.extCustomerInfo()
  116. //this.$refs.customView.getdata()
  117. this.extUserDetail()
  118. //this.init()
  119. }
  120. */
  121. this.authUserInfo()
  122. //this.extUserDetail()
  123. },
  124. methods: {
  125. tabFn(num){
  126. this.tabIndex=num
  127. if(num==1){
  128. this.$refs.customView.getdata()
  129. }
  130. if(num==2){
  131. this.$refs.carView.getdata()
  132. }
  133. if(num == 3){
  134. this.$refs.packageView.getdata()
  135. }
  136. if(num==4){
  137. this.$refs.couponView.getdata()
  138. }
  139. if(num==5){
  140. this.$refs.consumptionView.getdata()
  141. }
  142. },
  143. extCustomerInfo(){
  144. var that=this;
  145. /* uni.showModal({
  146. title: '提示',
  147. content: 'extCustomerInfo',
  148. success: function (res) {
  149. if (res.confirm) {
  150. console.log('用户点击确定');
  151. } else if (res.cancel) {
  152. console.log('用户点击取消');
  153. }
  154. }
  155. }); */
  156. this.$http('enterprise/wechat/extCustomerInfo', {
  157. //corpID:'wpMGjbBgAA_zIu6wbKy48zFSbGiGeP8g',
  158. corpID:that.corpID,
  159. // extUserId:'wmMGjbBgAA0JAbGD5Vu8BzEuYgZhvhOA',
  160. extUserId:this.userId,
  161. token:this.token
  162. }, 'GET').then(res => {
  163. console.log(res.code)
  164. this.code2=res.code
  165. uni.hideLoading();
  166. if(res.code!=1){
  167. //uni.clearStorageSync()
  168. if(res.code == 401){
  169. this.qwtsShow=true
  170. this.msg=res.msg
  171. }else{
  172. uni.showToast({
  173. title: res.msg,
  174. icon: 'none',
  175. duration: 3000
  176. });
  177. }
  178. }else{
  179. this.customerInfo=res.data.customerInfo
  180. uni.setStorage({
  181. key: 'integral',
  182. data: that.customerInfo.integral,
  183. success: function () { }
  184. });
  185. uni.setStorage({
  186. key: 'levelName',
  187. data: that.customerInfo.levelName,
  188. success: function () { }
  189. });
  190. var map=res.data.map
  191. var arr=[]
  192. if(map.length){
  193. map.forEach(item=>{
  194. arr.push(item.PlateNumber)
  195. })
  196. }
  197. uni.setStorage({
  198. key: 'PlateNumberArr',
  199. data: arr,
  200. success: function () { }
  201. });
  202. }
  203. })
  204. },
  205. extUserDetail(){
  206. var that=this;
  207. console.log("extUserDetail")
  208. this.$http('enterpriseWechat/auth/extUserDetail', {
  209. corpID:that.corpID,
  210. // extUserId:'wmMGjbBgAA0JAbGD5Vu8BzEuYgZhvhOA'
  211. extUserId:this.userId
  212. }, 'GET').then(res => {
  213. console.log("extUserDetailRES"+res.code)
  214. uni.hideLoading();
  215. this.code1=res.code
  216. if(res.code == 401){
  217. this.qwtsShow=true
  218. this.msg=res.msg
  219. }
  220. this.userDetail=res.data
  221. this.$refs.customView.getdata()
  222. })
  223. },
  224. getUser(){
  225. var that=this;
  226. this.extCustomerInfo()
  227. this.$http('enterpriseWechat/auth/extUserDetail', {
  228. corpID:that.corpID,
  229. // extUserId:'wmMGjbBgAA0JAbGD5Vu8BzEuYgZhvhOA'
  230. extUserId:this.userId
  231. }, 'GET').then(res => {
  232. uni.hideLoading();
  233. this.userDetail=res.data
  234. if(res.code!=1){
  235. uni.showToast({
  236. title: res.msg,
  237. icon: 'none',
  238. duration: 3000
  239. });
  240. }
  241. })
  242. },
  243. authUserInfo(){
  244. var that=this;
  245. uni.showLoading({
  246. title: '加载中'
  247. });
  248. this.$http('enterpriseWechat/auth/authUserInfo', {
  249. corpID:that.corpID,
  250. code: this.code
  251. }, 'GET').then(res => {
  252. this.code3=res.code
  253. if(res.code!=1){
  254. uni.hideLoading();
  255. if(res.code == 401){
  256. this.qwtsShow=true
  257. this.msg=res.msg
  258. }else if(res.code == 0){
  259. this.qwtsShow=true
  260. this.msg=res.msg
  261. }else{
  262. uni.showToast({
  263. title: res.msg,
  264. //title: res.code,
  265. icon: 'none',
  266. duration: 3000
  267. });
  268. }
  269. }else{
  270. this.token=res.data.token
  271. uni.setStorage({
  272. key: 'token',
  273. data: that.token,
  274. success: function () {
  275. that.init()
  276. }
  277. });
  278. }
  279. //that.extUserDetail()
  280. //that.extCustomerInfo()
  281. })
  282. },
  283. init(){
  284. var that=this
  285. this.$http('enterpriseWechat/auth/getAgentConfig', {
  286. corpID:that.corpID,
  287. url:this.$configUrl
  288. }, 'GET').then(res => {
  289. that.$wx.agentConfig({
  290. corpid:that.corpID,// 必填,企业微信的corpid,必须与当前登录的企业一致
  291. agentid:that.agentId, // 必填,企业微信的应用id (e.g. 1000247)
  292. timestamp: res.data.timestamp, // 必填,生成签名的时间戳
  293. nonceStr: res.data.nonceStr, // 必填,生成签名的随机串
  294. signature: res.data.signature,// 必填,签名,见附录-JS-SDK使用权限签名算法
  295. jsApiList: ['getCurExternalContact','getContext','sendChatMessage'], //必填,传入需要使用的接口名称
  296. success: function(res) {
  297. console.log(res)
  298. // 回调
  299. that.getContext()
  300. },
  301. fail: function(err) {
  302. console.log(err)
  303. uni.showToast({
  304. title: 'agentConfig失败',
  305. icon: 'none',
  306. duration: 3000
  307. });
  308. if(res.errMsg.indexOf('function not exist') > -1){
  309. alert('版本过低请升级')
  310. }
  311. }
  312. });
  313. })
  314. },
  315. getContext(){
  316. var that=this;
  317. this.$wx.invoke('getContext', {
  318. }, function(res){
  319. if(res.err_msg == "getContext:ok"){
  320. // entry = res.entry ; //返回进入H5页面的入口类型,目前有normal、contact_profile、single_chat_tools、group_chat_tools、chat_attachment
  321. //shareTicket = res.shareTicket; //可用于调用getShareInfo接口
  322. that.getCurExternalContact()
  323. }else {
  324. //错误处理
  325. uni.showToast({
  326. title: '入口不对',
  327. icon: 'none',
  328. duration: 3000
  329. });
  330. }
  331. });
  332. },
  333. getCurExternalContact(){
  334. var that=this;
  335. /* uni.showModal({
  336. title: '提示',
  337. content: 'getCurExternalContact',
  338. success: function (res) {
  339. }
  340. }); */
  341. this.$wx.invoke('getCurExternalContact', {
  342. }, function(res){
  343. if(res.err_msg == "getCurExternalContact:ok"){
  344. that.userId = res.userId ; //返回当前外部联系人userId
  345. uni.setStorage({
  346. key: 'userId',
  347. data: that.userId,
  348. success: function () {
  349. }
  350. });
  351. that.extUserDetail()
  352. that.extCustomerInfo()
  353. }else {
  354. //错误处理
  355. uni.showToast({
  356. title: 'userId获取失败',
  357. icon: 'none',
  358. duration: 3000
  359. });
  360. }
  361. });
  362. },
  363. agentConfigFn(){
  364. },
  365. oAuth(){
  366. uni.navigateTo({
  367. url:'auto?appid='+this.agentId+'&agentid='+this.agentId
  368. })
  369. },
  370. copy(e){
  371. uni.setClipboardData({
  372. data: e,
  373. success: function () {
  374. uni.showToast({
  375. title: '复制成功',
  376. icon: 'success',
  377. duration: 2000
  378. });
  379. },
  380. fail: function () {
  381. console.log('复制失败');
  382. }
  383. });
  384. }
  385. },
  386. onBackPress (options) {
  387. if (options.from === "backbutton") {
  388. return true
  389. } else {
  390. return false
  391. }
  392. },
  393. onReachBottom() {
  394. },
  395. onPullDownRefresh() {
  396. var num = this.tabIndex
  397. if(num==1){
  398. this.$refs.customView.getdata()
  399. }
  400. if(num==2){
  401. this.$refs.carView.getdata()
  402. }
  403. if(num == 3){
  404. this.$refs.packageView.getdata()
  405. }
  406. if(num==4){
  407. this.$refs.couponView.getdata()
  408. }
  409. if(num==5){
  410. this.$refs.consumptionView.getdata()
  411. }
  412. setTimeout(function() {
  413. uni.stopPullDownRefresh();
  414. }, 1000);
  415. }
  416. }
  417. </script>
  418. <style scoped>
  419. .top{
  420. background: #fff;
  421. }
  422. .top{
  423. display: flex;
  424. padding: 30rpx 24rpx;
  425. }
  426. .logo{
  427. width: 98rpx;height: 98rpx;
  428. }
  429. .topRight{
  430. padding-left: 20rpx;
  431. }
  432. .wxName{
  433. font-weight: 500;
  434. font-size: 32rpx;
  435. color: #333333;
  436. line-height: 45rpx;
  437. }
  438. .titleBox{
  439. display: flex;
  440. padding-top: 10rpx;
  441. display: flex; flex-wrap: wrap;
  442. width: 500rpx;
  443. }
  444. .title{
  445. /* height: 36rpx; */
  446. border-radius: 4rpx;
  447. border: 1px solid #FF8113;
  448. /* line-height: 36rpx; */
  449. font-size: 24rpx;
  450. color: #FF8113;
  451. padding: 4rpx 8rpx;
  452. margin-right: 10rpx;
  453. margin-bottom: 10rpx;
  454. }
  455. .tabBox{
  456. display: flex;justify-content: space-between;
  457. background: #fff;
  458. margin-top: 16rpx;
  459. padding: 30rpx 24rpx;
  460. font-size: 30rpx;
  461. color: #333333;
  462. line-height: 42rpx;
  463. }
  464. .tabActive{
  465. color: #FF8113;font-weight: 500;
  466. border-bottom: 2px solid #FF8113;
  467. }
  468. .tabline{
  469. padding-bottom: 8rpx;
  470. }
  471. .qwTsBox{
  472. width: 100%;
  473. height: 100%;
  474. background: rgba(0, 0, 0, 0.5);
  475. position: fixed;
  476. top: 0;
  477. left: 0;
  478. z-index: 111;
  479. }
  480. .qwTsTxt{
  481. color: #333;
  482. text-align: center;
  483. margin-top: 40vh;
  484. background: #fff;
  485. width: 60vw;
  486. border-radius: 10rpx;
  487. margin-left: calc(20vw - 30rpx);
  488. font-size: 30rpx;
  489. padding: 30rpx;
  490. }
  491. </style>