// CommonFormItems.vue - Common form items shared across all components
<template>
  <div id="h5-config-common" ref="commonForm">

    <el-form-item label="获客链接" v-if="config.addWxFun">
      <el-select v-model="config.workUrl" filterable @change="val => updateConfig('workUrl', val)" placeholder="请选择">
        <el-option
          v-for="item in options"
          :key="item.value"
          :label="item.label"
          :value="item.value">
        </el-option>
      </el-select>
      <el-button type="primary" @click="copyLink">复制链接</el-button>
    </el-form-item>
  </div>
</template>

<script>
import {listAll} from '@/api/qw/workLink'

export default {
  name: 'CommonFormItems',
  props: {
    config: {
      type: Object,
      required: true
    },
    index: {
      type: Number,
      required: true
    },
    list: {
      type: Array,
      required: true
    }
  },
  data(){
    return {
        options: []
    }
  },
  mounted() {
    this.loadQwAddr();
  },
  methods: {
    async copyLink() {
      try {
        await navigator.clipboard.writeText(this.config.workUrl);
        this.$message.success("链接已复制到剪贴板"); // 提示成功
      } catch (err) {
        console.error("复制失败:", err);
        this.$message.error("复制失败，请手动复制"); // 提示失败
      }
    },
    loadQwAddr(){
      listAll({})
        .then(res=>{
          this.options = res.data.map(item=>{
            return {
              label: item.linkName,
              value: item.url
            }
          })
        })
        .catch(err=>console.log(err));
    },
    updateConfig(key, value) {
      this.$emit('update:config', { ...this.config, [key]: value });
    },
    handleBottom() {
      this.$emit('bottom-change');
    }
  }
}
</script>