user-service-list.html 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112
  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. </head>
  17. <body class="bgcf7f7f7">
  18. <div class="service" id="app">
  19. <van-nav-bar class="user_rank_explan_title user_title_normal" left-arrow title="服务中心" v-if="toptitleisshow" @click-left="goback">
  20. <template #left> <img src="./static/images/left.png" alt=""></template>
  21. </van-nav-bar>
  22. <div class="service-list" v-cloak>
  23. <van-search class="service_center" v-model="searchContent" placeholder="请输入搜索关键词" @click="onSearch" disabled></van-search>
  24. <van-tabs v-model="active" animated line-width="20" line-height="2" @click="changetab" swipeable>
  25. <van-tab v-for="type in servicetype" :key="type.Id" :title="type.ColName">
  26. <van-cell-group>
  27. <van-cell v-for="item in commonq" :title="item.Title" :key="item.Id" is-link :border="false" @click="articledetail(item.Id)"></van-cell>
  28. </van-cell-group>
  29. </van-tab>
  30. <van-tab disabled></van-tab>
  31. </van-tabs>
  32. </div>
  33. <van-goods-action class="mall-bottom">
  34. <van-goods-action-button color="#FD824D" text="电话客服" @click="onClickButton"></van-goods-action-button>
  35. </van-goods-action>
  36. <van-dialog style="border-radius:4px;" v-model="dialogisshow" width="70%" confirm-button-color="#FD824D" confirm-button-text="拨打" message="电话客服电话:4001363866" show-cancel-button @confirm="callservice" @cancel="dialogisshow = false"> </van-dialog>
  37. </div>
  38. <script src="./static/js/klm-vv.min.js"></script>
  39. <script src="./static/js/klm-axios-config.js"></script>
  40. <script>
  41. // 通过 CDN 引入时不会自动注册 Lazyload 组件
  42. // 可以通过下面的方式手动注册
  43. Vue.use(vant.Lazyload);
  44. // 在 #app 标签下渲染一个按钮组件
  45. let app = new Vue({
  46. el: '#app',
  47. data() {
  48. return {
  49. dialogisshow:false,
  50. toptitleisshow:false,
  51. active: 0,
  52. oldindex:0,
  53. searchContent: '',
  54. isShow: false,
  55. pageinfo:{
  56. PageSize:1000,
  57. PageNum:1
  58. },
  59. servicetype:[],
  60. commonq:[],
  61. };
  62. },
  63. created() {
  64. this.toptitleisshow = toptitleisshow;
  65. this.getservicetype()
  66. },
  67. methods: {
  68. onSearch() {
  69. PublicLib.Goto({Url:'user-service-search', Jump: 1});
  70. },
  71. //- 获取服务中心问题分类
  72. async getservicetype(){
  73. const res = await getRequest('/api/v1/col/servicecenter?t='+Math.random(6),JSON.stringify({PageSize:10,PageNum:1}));
  74. if(res.status === 1) {
  75. this.servicetype = res.data;
  76. this.getservicelist(this.servicetype[0].Id);
  77. }
  78. },
  79. //- 获取服务中心列表
  80. async getservicelist(id){
  81. const res = await getRequest('/api/v1/servicecenter/list?t='+Math.random(6),JSON.stringify({...this.pageinfo,CategoryId:id}));
  82. if(res.status === 1){
  83. this.commonq = res.data;
  84. }
  85. },
  86. //- 切换标签(根据切换的索引获取当前标签项的列表)
  87. changetab(index){
  88. if(index === this.oldindex) return;
  89. //- 添加旧状态,点击当前tab不会重新获取数据
  90. this.oldindex = index;
  91. this.getservicelist(this.servicetype[index].Id);
  92. },
  93. //- 跳转文章详情,存入Id
  94. articledetail(id){
  95. PublicLib.Goto({Url:'user-service-detail', Jump: 1});
  96. PublicLib.putCookieInfo('articleId', id);
  97. },
  98. goback(){
  99. PublicLib.GoBack({Level:1});
  100. },
  101. onClickButton(){
  102. this.dialogisshow = true;
  103. },
  104. callservice(){
  105. PublicLib.PhoneCall('4001363866');
  106. }
  107. }
  108. });
  109. </script>
  110. </body>
  111. </html>