customer-service.vue 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113
  1. <template lang="">
  2. <div>
  3. <!-- <v-btn @click="open({ templateId: 6635862 })">双子星模板</v-btn>
  4. <v-btn @click="open({ templateId: 6634867 })">唔即云模板</v-btn> -->
  5. </div>
  6. </template>
  7. <script>
  8. import qs from 'qs';
  9. import { fileKeyToUrl } from '@/plugins/file-center.js';
  10. console.log(
  11. '🚀 ~ file: customer-service.vue ~ line 10 ~ fileKeyToUrl',
  12. fileKeyToUrl,
  13. );
  14. export default {
  15. head() {
  16. return {
  17. script: [
  18. {
  19. src:
  20. 'https://qiyukf.com/script/98112bcf552907c28ee450c6a58269c3.js' +
  21. qs.stringify(
  22. {
  23. hidden: 1,
  24. sdkTemplateId:
  25. this.$route.query?.templateId ??
  26. process.env.QIYUKF_TEMPLATE_ID,
  27. },
  28. {
  29. addQueryPrefix: true,
  30. },
  31. ),
  32. async: true,
  33. callback: () => {
  34. // console.log(window.ysf);
  35. this.init(window.ysf);
  36. },
  37. },
  38. ],
  39. };
  40. },
  41. computed: {
  42. isAutoOpen() {
  43. return this.$route.query.autoopen === 'true';
  44. },
  45. isOnunread() {
  46. return this.$route.query.onunread === 'true';
  47. },
  48. },
  49. mounted() {},
  50. methods: {
  51. async init(ysf) {
  52. this.ysf = ysf;
  53. // console.log(ysf);
  54. await new Promise((resolve, reject) => {
  55. ysf('onready', resolve);
  56. });
  57. await new Promise((resolve, reject) => {
  58. ysf('config', {
  59. uid: String(this.$auth.user.id),
  60. name: this.$auth.user.userName,
  61. mobile: this.$auth.user.phone,
  62. email: this.$auth.user.email,
  63. data: JSON.stringify([
  64. { key: 'real_name', value: this.$auth.user.userName },
  65. { key: 'mobile_phone', hidden: true, value: this.$auth.user.phone },
  66. { key: 'email', value: this.$auth.user.email },
  67. {
  68. key: 'avatar',
  69. label: '头像',
  70. value:
  71. this.$auth.user.headImgFileId &&
  72. fileKeyToUrl(this.$auth.user.headImgFileId),
  73. }, // 访客头像
  74. {
  75. index: 0,
  76. key: 'account',
  77. label: '账号',
  78. value: this.$auth.user.phone,
  79. },
  80. ]),
  81. language: 'zh-cn',
  82. success: resolve,
  83. error: reject,
  84. });
  85. });
  86. if (this.isAutoOpen) {
  87. this.open();
  88. }
  89. if (this.isOnunread) {
  90. this.onunread();
  91. }
  92. },
  93. open() {
  94. const url = this.ysf('url');
  95. location.replace(url);
  96. // this.ysf('open', data);
  97. },
  98. getUnreadMsg() {
  99. const result = this.ysf('getUnreadMsg');
  100. console.log(result.total, result.type, result.message);
  101. },
  102. onunread() {
  103. this.ysf('onunread', (result) => {
  104. console.log(result.total, result.type, result.message);
  105. });
  106. },
  107. },
  108. };
  109. </script>