Interface.vue 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134
  1. <template>
  2. <div>
  3. <!-- 对外接口 {{ decrypted }} -->
  4. <el-button type="primary" @click="updateAk()" style="margin-bottom: 20px;">更新秘钥</el-button>
  5. <el-table v-loading="loading" :data="tableData" style="width: 100%" border
  6. :header-cell-style="{ background: '#f5f7fa' }">
  7. <!-- 解密后的秘钥 -->
  8. <el-table-column prop="decryptedKey" label="秘钥" align="center">
  9. <template slot-scope="scope">
  10. {{ hideSensitiveInfo(scope.row.decryptedKey) }}
  11. </template>
  12. </el-table-column>
  13. <!-- <el-table-column prop="k" label="解密秘钥" align="center">
  14. </el-table-column> -->
  15. <el-table-column label="操作" align="center">
  16. <el-link type="primary" @click="copy()">复制秘钥</el-link>
  17. <el-link type="primary" @click="getDoc()">接口文档</el-link>
  18. </el-table-column>
  19. </el-table>
  20. </div>
  21. </template>
  22. <script>
  23. import { mapGetters } from 'vuex';
  24. import CryptoJS from 'crypto-js';
  25. export default {
  26. data() {
  27. return {
  28. tableData: [],
  29. loading: false,
  30. }
  31. },
  32. computed: {
  33. ...mapGetters(['site_info', 'user_info']),
  34. // decrypted() {
  35. // if (!(this.tableData && this.tableData.length > 0)) return "";
  36. // const keyBytes = CryptoJS.enc.Base64.parse(this.tableData[0].k);
  37. // const res = CryptoJS.AES.decrypt(this.tableData[0].v, keyBytes, { mode: CryptoJS.mode.ECB, padding: CryptoJS.pad.Pkcs7 })
  38. // return res.toString(CryptoJS.enc.Utf8);
  39. // }
  40. },
  41. filter: {},
  42. created() {
  43. this.getAk();
  44. },
  45. methods: {
  46. // 获取秘钥
  47. getAk() {
  48. this.loading = true
  49. let url = `/org/ak/${this.user_info.site_id}`
  50. this.$axiosUser('get', url).then(res => {
  51. this.loading = false
  52. if (res.data.code) {
  53. if (res.data.data) {
  54. this.tableData.push(res.data.data)
  55. if (!(this.tableData && this.tableData.length > 0)) return
  56. this.tableData.forEach(item => {
  57. const keyBytes = CryptoJS.enc.Base64.parse(item.k); // 对称解密秘钥
  58. // 用秘钥解密
  59. const res = CryptoJS.AES.decrypt(item.v, keyBytes, { mode: CryptoJS.mode.ECB, padding: CryptoJS.pad.Pkcs7 })
  60. item.decryptedKey = res.toString(CryptoJS.enc.Utf8)
  61. })
  62. }
  63. } else {
  64. this.$message.error("获取数据失败")
  65. }
  66. })
  67. },
  68. // 更新秘钥key
  69. updateAk() {
  70. this.loading = true
  71. let url = `/org/ak/${this.user_info.site_id}`
  72. this.$axiosUser('post', url).then(res => {
  73. this.loading = false
  74. this.tableData = [];
  75. if (res.data.code) {
  76. if (res.data.data) {
  77. this.tableData.push(res.data.data)
  78. if (!(this.tableData && this.tableData.length > 0)) return
  79. this.tableData.forEach(item => {
  80. const keyBytes = CryptoJS.enc.Base64.parse(item.k); // 对称解密秘钥
  81. // 用秘钥解密
  82. const res = CryptoJS.AES.decrypt(item.v, keyBytes, { mode: CryptoJS.mode.ECB, padding: CryptoJS.pad.Pkcs7 })
  83. item.decryptedKey = res.toString(CryptoJS.enc.Utf8)
  84. })
  85. }
  86. } else {
  87. this.$message.error("获取数据失败")
  88. }
  89. })
  90. },
  91. copy() {
  92. if (!(this.tableData && this.tableData.length > 0)) return
  93. //创建input标签
  94. var input = document.createElement('input')
  95. //将input的值设置为需要复制的内容
  96. input.value = this.tableData[0].decryptedKey;
  97. //添加input标签
  98. document.body.appendChild(input)
  99. //选中input标签
  100. input.select()
  101. //执行复制
  102. document.execCommand('copy')
  103. //成功提示信息
  104. this.$message.success('已复制')
  105. //移除input标签
  106. document.body.removeChild(input)
  107. },
  108. getDoc() {
  109. window.open('https://new.gdy.g107.com/system/doc');
  110. },
  111. // 显示星号
  112. hideSensitiveInfo(value, start = 5, end = 5) {
  113. if (!value) return '';
  114. const length = value.length;
  115. const visibleStart = value.slice(0, start);
  116. const visibleEnd = value.slice(length - end);
  117. const stars = '*'.repeat(length - start - end);
  118. return `${visibleStart}${stars}${visibleEnd}`;
  119. }
  120. }
  121. }
  122. </script>
  123. <style scoped lang="scss"></style>