選擇字段
// 拖拽到table

.....

// 從drawer中拖拽數據

initDrop() {
?? ??? ??? ?// initDrop在mounted中觸發，使table區域可以接受拖拽?
? ? ? ? ? ? let that = this
? ? ? ? ? ? $('.table_container').droppable({
? ? ? ? ? ? ? ? scope: 'basic', // 設置兩個相同的scope接受拖拽信息
? ? ? ? ? ? ? ? tolerance: 'fit',
? ? ? ? ? ? ? ? drop(e) {
? ? ? ? ? ? ? ? ? ? let dropFieldInfo = {
? ? ? ? ? ? ? ? ? ? ? ? enName: that.dragField.enname || '',
? ? ? ? ? ? ? ? ? ? ? ? cnName: that.dragField.name || '',
? ? ? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? ? ? that.fieldInfoList.push(dropFieldInfo)
? ? ? ? ? ? ? ? ? ? that.repeatZhName() // 校驗字段是否重復的方法
? ? ? ? ? ? ? ? }
? ? ? ? ? ? })
? ? ? ? },
?choseField() {
? ? ? ? ? ? this.$refs.fieldList.setShowState(true) ?//顯示drawer
? ? ? ? ? ? // 因為drawer中的dom對象實在打開抽屜時候才會被創建，所以不能再drawer組件中進行初始化
? ? ? ? ? ? this.$nextTick(() => {
? ? ? ? ? ? ?? ?// sort-table為抽屜組件中ant-table的類名
? ? ? ? ? ? ? ? $('.sort-table tbody tr').draggable({
? ? ? ? ? ? ? ? ? ? scope: 'basic', ?//相同的scope name
? ? ? ? ? ? ? ? ? ? scroll: false,
? ? ? ? ? ? ? ? ? ? zIndex: 10000, ?// zindex設置更高避免拖拽的數據被drawer遮住，同時去除遮罩層樣式
? ? ? ? ? ? ? ? ? ? helper: 'clone',
? ? ? ? ? ? ? ? ? ? appendTo: 'body', ?//避免遮蓋
? ? ? ? ? ? ? ? ? ? containment: document.getElementById('app'),
? ? ? ? ? ? ? ? ? ? start: e => {
? ? ? ? ? ? ? ? ? ? ?? ?// rowIndex第一行是表頭，數據行的rowindex從1開始
? ? ? ? ? ? ? ? ? ? ? ? let currentIndex = e.target.rowIndex - 1
? ? ? ? ? ? ? ? ? ? ? ? // console.log(this.$refs.fieldList.tableData[currentIndex])
? ? ? ? ? ? ? ? ? ? ? ? this.dragField = this.$refs.fieldList.tableData[currentIndex]
? ? ? ? ? ? ? ? ? ? },
? ? ? ? ? ? ? ? ? ? stop: e => {
? ? ? ? ? ? ? ? ? ? ? ? // this.eventType = 'CLICK'
? ? ? ? ? ? ? ? ? ? ? ? console.log('拖拽結束事件')
? ? ? ? ? ? ? ? ? ? ? ? console.log(e)
? ? ? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? })
? ? ? ? ? ? })
? },