<template>
    <div id="menu" ref="selectRef" v-show="selectShow">
      <template v-for="(item,index) in projectList">
        <button @click="projectSelect(item.dcch)">{{ item.dcch }}</button>
      </template>
    </div>
</template>

<script>
import initSearch from "@/views/zyjhzx/components/search";
import {openCzplBase} from "@/api/openapi";

export default {
  name:'SelectDemo',
  data(){
    return{
      selectShow:false,
      selectText:'',
      projectList:[]
    }
  },
  methods:{
    initBase(){
      openCzplBase({}).then(res=>{
        const arr=[]
        for (const item of res.data.cbbm) {
          if (item.wgbs==='N'){
            const data={dcch:item.cbbm}
            arr.push(data)
          }
        }
        this.projectList=arr
      })
    },
    initSearch(stage){
      const {group}=initSearch()
      const selectNode=this.$refs.selectRef
      group.on('click touchstart',function (){
        selectNode.style.display = 'initial';
        const containerRect = stage.container().getBoundingClientRect();
        selectNode.style.top = containerRect.top + stage.getPointerPosition().y + 4 + 'px';
        selectNode.style.left = containerRect.left + stage.getPointerPosition().x + 4 + 'px';
      })
    },
    projectSelect(dcch){
      this.queryParam.dcch=dcch
      this.selectText.fill("black")
      this.selectText.text(dcch)
      const selectNode=this.$refs.selectRef
      selectNode.style.display = 'none';
    },
  }
}
</script>
