|
|
@@ -11,7 +11,7 @@
|
|
11
|
11
|
@click="handleAdd"
|
|
12
|
12
|
>添加题目</el-button>
|
|
13
|
13
|
</div>
|
|
14
|
|
- <ul style="list-style-type: none;margin:24px 0 0 -40px">
|
|
|
14
|
+ <!-- <ul style="list-style-type: none;margin:24px 0 0 -40px">
|
|
15
|
15
|
<li v-for="item,index in tableData" :key="index" class="questionli" @click="handleEdit(item)">
|
|
16
|
16
|
<span style="width:45px">第{{ index+1 }}题</span>
|
|
17
|
17
|
<span style="width:45px">{{ item.optType === 'single'?'单选题':item.optType==='many'?'多选题':'判断题' }}</span>
|
|
|
@@ -26,7 +26,25 @@
|
|
26
|
26
|
<el-button slot="reference" type="text" style="color:red">删除</el-button>
|
|
27
|
27
|
</el-popconfirm>
|
|
28
|
28
|
</li>
|
|
29
|
|
- </ul>
|
|
|
29
|
+ </ul> -->
|
|
|
30
|
+ <draggable v-model="tableData" chosen-class="chosen" force-fallback="true" group="people" animation="1000" @end="onEnd">
|
|
|
31
|
+ <transition-group>
|
|
|
32
|
+ <div v-for="item,index in tableData" :key="index" class="questionli" @click="handleEdit(item)">
|
|
|
33
|
+ <span style="width:45px">第{{ index+1 }}题</span>
|
|
|
34
|
+ <span style="width:45px">{{ item.optType === 'single'?'单选题':item.optType==='many'?'多选题':'判断题' }}</span>
|
|
|
35
|
+ <span style="flex:1">{{ item.title }}</span>
|
|
|
36
|
+ <el-popconfirm
|
|
|
37
|
+ style="width:30px"
|
|
|
38
|
+ icon="el-icon-info"
|
|
|
39
|
+ icon-color="red"
|
|
|
40
|
+ title="确定删除这个问题吗？"
|
|
|
41
|
+ @onConfirm="handleDelete(item)"
|
|
|
42
|
+ >
|
|
|
43
|
+ <el-button slot="reference" type="text" style="color:red">删除</el-button>
|
|
|
44
|
+ </el-popconfirm>
|
|
|
45
|
+ </div>
|
|
|
46
|
+ </transition-group>
|
|
|
47
|
+ </draggable>
|
|
30
|
48
|
<el-pagination
|
|
31
|
49
|
v-show="questionTotal!==0"
|
|
32
|
50
|
style="float:right; margin:24px 0"
|
|
|
@@ -41,10 +59,15 @@
|
|
41
|
59
|
</div>
|
|
42
|
60
|
</template>
|
|
43
|
61
|
<script>
|
|
44
|
|
-import { getQuestionList } from '@/api/question'
|
|
|
62
|
+import { getQuestionList, UpdateQuestionSort } from '@/api/question'
|
|
45
|
63
|
import { deleteGameLeverQuestion } from '@/api/gamelevelquestion'
|
|
|
64
|
+import draggable from 'vuedraggable'
|
|
46
|
65
|
|
|
47
|
66
|
export default {
|
|
|
67
|
+ // 注册draggable组件
|
|
|
68
|
+ components: {
|
|
|
69
|
+ draggable
|
|
|
70
|
+ },
|
|
48
|
71
|
props: {
|
|
49
|
72
|
gameId: {
|
|
50
|
73
|
type: String,
|
|
|
@@ -72,6 +95,14 @@ export default {
|
|
72
|
95
|
}
|
|
73
|
96
|
},
|
|
74
|
97
|
methods: {
|
|
|
98
|
+ // 拖拽结束事件
|
|
|
99
|
+ onEnd() {
|
|
|
100
|
+ const sortList = []
|
|
|
101
|
+ this.tableData.map((item, index) => {
|
|
|
102
|
+ sortList.push({ sortNo: index, serialNo: item.gameQuestionMapId })
|
|
|
103
|
+ })
|
|
|
104
|
+ UpdateQuestionSort(sortList, this.gameId)
|
|
|
105
|
+ },
|
|
75
|
106
|
handleSizeChange(val) {
|
|
76
|
107
|
this.pageSize = val
|
|
77
|
108
|
this.changePagination()
|
