diff --git a/src/api/question.ts b/src/api/question.ts
index 71d380a..be9307f 100644
--- a/src/api/question.ts
+++ b/src/api/question.ts
@@ -24,6 +24,19 @@ export const defaultQuestionData: IQuestionData = {
}
+export function formatQType(val: number) {
+ switch (val) {
+ case 1:
+ return '普通'
+ case 2:
+ return '图片'
+ case 3:
+ return '问卷'
+ default:
+ return '未知'
+ }
+}
+
export const getQuestions = (params: any) =>
request({
url: '/api/puzzles',
diff --git a/src/api/shoppuzzle.ts b/src/api/shoppuzzle.ts
index ef4668e..60f6786 100644
--- a/src/api/shoppuzzle.ts
+++ b/src/api/shoppuzzle.ts
@@ -27,6 +27,13 @@ export const saveShopQuestion = (data: any) =>
data
})
+export const importQuestions = (shop: string, data: any) =>
+ request({
+ url: `/api/${shop}/puzzle/import`,
+ method: 'post',
+ data
+ })
+
export const deleteShopQuestion = (shop: string, id: string) =>
request({
url: `/api/${shop}/puzzle/${id}/delete`,
diff --git a/src/views/exam/components/PuzzleList.vue b/src/views/exam/components/PuzzleList.vue
index 837099c..dbdbb94 100644
--- a/src/views/exam/components/PuzzleList.vue
+++ b/src/views/exam/components/PuzzleList.vue
@@ -94,7 +94,7 @@
label="题目类型"
>
- {{ row.type === 3 ? '问卷' : '普通' }}
+ {{ puzzleType(row.type) }}
- {{ row.a2 || '' }} {{ row.a3 || '' }} {{ row.a4 || '' }}
+ {{row.a2}}
+ {{row.a3}}
+ {{row.a4}}
@@ -277,3 +279,8 @@ export default class extends Vue {
}
}
+
diff --git a/src/views/question/shop_puzzles.vue b/src/views/question/shop_puzzles.vue
index 111a4b7..92c3cc2 100644
--- a/src/views/question/shop_puzzles.vue
+++ b/src/views/question/shop_puzzles.vue
@@ -44,23 +44,65 @@
重置
-
-
+
- 添加
+
+
+ 添加
+
+
+
+ 导入Excel
-
+
+ {{exportBtnName}}
+
+
+ {{deleteBtnName}}
+
+
+
+
{{ row.question }}
@@ -96,10 +138,18 @@
label="混淆答案"
>
- {{ row.a2 || '' }} {{ row.a3 || '' }} {{ row.a4 || '' }}
+ {{row.a2}}
+ {{row.a3}}
+ {{row.a4}}
+
+
+
+
+ {{ puzzleType(row.type) }}
-
@@ -152,12 +202,15 @@
import { Component, Vue, Watch } from 'vue-property-decorator'
import Pagination from '@/components/Pagination/index.vue'
import { getShops } from '@/api/shop'
-import { parseTime } from '@/utils'
-import { IQuestionData } from '@/api/question'
+import { formatJson, parseTime } from '@/utils'
+import { IQuestionData, formatQType } from '@/api/question'
import { UserModule } from '@/store/modules/user'
-import { deleteShopQuestion, getShopCategory, getShopQuestions } from '@/api/shoppuzzle'
+import { deleteShopQuestion, getShopCategory, getShopQuestions, importQuestions } from '@/api/shoppuzzle'
import { IShopData } from '@/api/types'
import { EVENT_SHOP_PUZZLES_UPDATE, EVENT_SHOP_UPDATE, EventBus } from '@/utils/event-bus'
+import { exportJson2Excel } from '@/utils/excel'
+import XLSX from 'xlsx'
+import { IExamQuerstion } from '@/api/exam'
@Component({
name: 'ShopPuzzles',
@@ -206,14 +259,29 @@ export default class extends Vue {
shop: ''
}
+ private excelData = {
+ header: null,
+ results: null
+ }
+
+ private deleteBtnName = '删除所有'
+ private exportBtnName = '导出所有'
+ private downloadLoading = false
+ private multipleSelection : IExamQuerstion[] = []
+
$refs!: {
filterForm: HTMLFormElement
+ 'excel-upload-input': HTMLFormElement
}
get userLevel() {
return UserModule.level
}
+ private puzzleType(val: number) {
+ return formatQType(val)
+ }
+
async created() {
if (UserModule.level === 1) {
await this.getRemoteDeptList()
@@ -315,6 +383,131 @@ export default class extends Vue {
this.cateLoading = false
}
}
+
+ // begin of excel
+
+ private handleSelectionChange(val: any) {
+ this.multipleSelection = val
+ console.log(this.multipleSelection)
+ }
+
+ @Watch('multipleSelection')
+ private selectChange() {
+ this.deleteBtnName = this.multipleSelection.length > 0 ? '删除选中项' : '删除所有'
+ this.exportBtnName = this.multipleSelection.length > 0 ? '导出选中项' : '导出所有'
+ }
+
+ private handleClick(e: MouseEvent) {
+ const files = (e.target as HTMLInputElement).files
+ if (files) {
+ const rawFile = files[0] // only use files[0]
+ this.upload(rawFile)
+ }
+ }
+
+ private handleImport() {
+ (this.$refs['excel-upload-input']).click()
+ }
+
+ private handleExport() {
+ this.handleDownload()
+ }
+
+ private upload(rawFile: File) {
+ this.$refs['excel-upload-input'].value = '' // Fixes can't select the same excel
+
+ this.readerData(rawFile)
+ }
+
+ private async handleRemoveAll() {
+ try {
+ const str = this.multipleSelection.length > 0 ? '确定删除选中的题目' : '确定删除所有题目'
+ await this.$confirm(str, 'Warning', {
+ confirmButtonText: '确定',
+ cancelButtonText: '取消',
+ type: 'warning'
+ })
+ if (this.multipleSelection.length > 0) {
+ for (const s of this.multipleSelection) {
+ this.questions.splice(this.questions.indexOf(s), 1)
+ }
+ (this.$refs.question_table as any).clearSelection()
+ } else {
+ this.questions.length = 0
+ }
+ this.sliceData()
+ this.$message({
+ type: 'success',
+ message: 'Deleted!'
+ })
+ } catch (err) {
+ console.log(err)
+ }
+ }
+
+ private handleDownload() {
+ this.downloadLoading = true
+ const tHeader = ['question', 'a1', 'a2', 'a3', 'a4', 'type', 'tags']
+ const list = this.multipleSelection.length > 0 ? this.multipleSelection.slice(0) : this.questions.slice(0)
+ this.filename = parseTime(new Date(), '{y}{m}{d}{h}{i}{s}')
+ const dataHeader = ['question', 'a1', 'a2', 'a3', 'a4', 'type', 'groups']
+ const data = formatJson(dataHeader, list)
+ console.log('begin generate excel')
+ exportJson2Excel(tHeader, data, this.filename ? this.filename : undefined, undefined, undefined, true, 'xlsx')
+ this.downloadLoading = false
+ }
+
+ private readerData(rawFile: File) {
+ this.loading = true
+ const reader = new FileReader()
+ reader.onload = e => {
+ const data = (e.target as FileReader).result
+ const workbook = XLSX.read(data, { type: 'array' })
+ const firstSheetName = workbook.SheetNames[0]
+ const worksheet = workbook.Sheets[firstSheetName]
+ const results = XLSX.utils.sheet_to_json(worksheet)
+ this.generateData(results)
+ this.loading = false
+ }
+ reader.readAsArrayBuffer(rawFile)
+ }
+
+ private getHeaderRow(sheet: { [key: string]: any }) {
+ const headers: string[] = []
+ const range = XLSX.utils.decode_range(sheet['!ref'])
+ const R = range.s.r
+ // start in the first row
+ for (let C = range.s.c; C <= range.e.c; ++C) { // walk every column in the range
+ const cell = sheet[XLSX.utils.encode_cell({ c: C, r: R })]
+ // find the cell in the first row
+ let hdr = ''
+ if (cell && cell.t) hdr = XLSX.utils.format_cell(cell)
+ if (hdr === '') {
+ hdr = 'UNKNOWN ' + C // replace with your desired default
+ }
+ headers.push(hdr)
+ }
+ return headers
+ }
+
+ private async generateData(results: any) {
+ const datas = []
+ for (const _q of results) {
+ if (_q.tags) {
+ _q.groups = _q.tags.split(',')
+ delete _q.tags
+ }
+ datas.push(_q)
+ }
+ const { data } = await importQuestions(this.filterForm.shop, { datas })
+ console.log(data)
+ const msg = `操作成功, 共新增${data.insert || 0}个题目, 更新${data.update || 0}个题目`
+ this.$message({
+ type: 'success',
+ message: msg
+ })
+ this.getList()
+ }
}
@@ -322,4 +515,15 @@ export default class extends Vue {
.el-tag{
margin-right: 5px;
}
+ .action-bar {
+ margin-bottom: 15px;
+ }
+
+ .excel-upload-input {
+ display: none;
+ z-index: -9999;
+ }
+ .el-form-item{
+ margin-bottom: 22px;
+ }