批量打标-Go服务器开发

看起来你提供了一段 Vue 3 代码，但有些部分存在语法错误和格式问题。我将尝试修复并补充完整这段代码，使其可以正常工作。请注意，可能需要根据实际需求进一步调整。

<template>
  <div class="singleMarking">
    <div>
      <a-button class="cancel-btn" @click="handleCancel">取消</a-button>
    </div>
    <div class="form-tool">
      <a-button class="margin-right-10 button-light-blue" @click="openModal">批量打标</a-button>
      <a-modal v-model:open="open" title="批量打标" @ok="handleOk" width="500px">
        <a-transfer
          v-model:target-keys="targetKeys"
          v-model:selected-keys="selectedKeys"
          :data-source="dataSource"
          :titles="[ '待选状态', '已选状态' ]"
          :render="renderItem"
          @change="handleChange"
        />
      </a-modal>
    </div>
  </div>
</template>

<script setup>
import { ref, reactive, h } from 'vue';

const formState = reactive({});
const data = ref([]);
const open = ref(false);
const targetKeys = ref([]);
const selectedKeys = ref([]);

// 模拟的数据源
const dataSource = [
  { key: '1', title: '状态1', color: '#f50' },
  { key: '2', title: '状态2', color: '#2db7f5' },
  { key: '3', title: '状态3', color: '#87d068' },
  { key: '4', title: '状态4', color: '#108ee5' },
  { key: '5', title: '状态5', color: '#ffbf00' },
  { key: '6', title: '状态6', color: '#ff7f50' },
  { key: '7', title: '状态7', color:'#8a2be2' },
  { key:'8',title:'状态8',color:'#a52a2a'},
  {key:'9',title:'状态9',color:'#deb887'},
  {key:'10',title:'状态10',color:'#5f9ea0'}
];

const handleCancel = () => {
  // 向父页面发送消息，通知关闭 iframe
  window.parent.postMessage({ type: "close-dialog", action: "cancel" }, '*');
};

const openModal = () => {
  open.value = true;
};

const handleOk = () => {
  open.value = false;
  console.log('已选择的状态:', targetKeys.value);
};

const renderItem = (item) => {
   // 返回带有颜色的 Vue 元素
   return h('span',{ style:{ color:item.color }}, item.title);
};

const handleChange = (nextTargetKeys, direction, moveKeys) => {
   console.log('targetKeys:', nextTargetKeys);
   console.log('direction:', direction);
   console.log('moveKeys:', moveKeys);
};
</script>

<style lang="less">
.singleMarking {
   // 在这里添加你的样式
}
.cancel-btn {
   // 自定义取消按钮样式
}
.form-tool {
   // 工具区域样式
}
.margin-right-10 {
   margin-right: 10px;
}
.button-light-blue {
   background-color: #add8e6; /* 自定义蓝色 */
}
</style>