common-config.vue 1.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576
  1. // CommonFormItems.vue - Common form items shared across all components
  2. <template>
  3. <div id="h5-config-common" ref="commonForm">
  4. <el-form-item label="获客链接" v-if="config.addWxFun">
  5. <el-select v-model="config.workUrl" filterable @change="val => updateConfig('workUrl', val)" placeholder="请选择">
  6. <el-option
  7. v-for="item in options"
  8. :key="item.value"
  9. :label="item.label"
  10. :value="item.value">
  11. </el-option>
  12. </el-select>
  13. <el-button type="primary" @click="copyLink">复制链接</el-button>
  14. </el-form-item>
  15. </div>
  16. </template>
  17. <script>
  18. import {listAll} from '@/api/qw/workLink'
  19. export default {
  20. name: 'CommonFormItems',
  21. props: {
  22. config: {
  23. type: Object,
  24. required: true
  25. },
  26. index: {
  27. type: Number,
  28. required: true
  29. },
  30. list: {
  31. type: Array,
  32. required: true
  33. }
  34. },
  35. data(){
  36. return {
  37. options: []
  38. }
  39. },
  40. mounted() {
  41. this.loadQwAddr();
  42. },
  43. methods: {
  44. async copyLink() {
  45. try {
  46. await navigator.clipboard.writeText(this.config.workUrl);
  47. this.$message.success("链接已复制到剪贴板"); // 提示成功
  48. } catch (err) {
  49. console.error("复制失败:", err);
  50. this.$message.error("复制失败,请手动复制"); // 提示失败
  51. }
  52. },
  53. loadQwAddr(){
  54. listAll({})
  55. .then(res=>{
  56. this.options = res.data.map(item=>{
  57. return {
  58. label: item.linkName,
  59. value: item.url
  60. }
  61. })
  62. })
  63. .catch(err=>console.log(err));
  64. },
  65. updateConfig(key, value) {
  66. this.$emit('update:config', { ...this.config, [key]: value });
  67. },
  68. handleBottom() {
  69. this.$emit('bottom-change');
  70. }
  71. }
  72. }
  73. </script>