整理

src/components/menus/MyInterview.vue

@@ -105,238 +105,242 @@
 <script>
 import axios from 'axios'
 export default {
-	name: 'MyInterview',
+    name: 'MyInterview',
 
-	data() {
-		return {
-			// 用户列表数据
-			userlist: [],
-			loading: false,
-			elementui_page_component_key: 0,
-			currentPage: Number(localStorage.getItem('lastPage')) || 1,
-			pageSize: 9,
-			total: 0,
-			formInline: {
-				question: '',
-			},
-			options: [],
-			questionType: 0,
-			// 新增的内容
-			dialogFormVisible: false,
-			dialogMutiFormVisible: false,
-			form: {
-				question: '',
-				questionType: 0,
-			},
-			formLabelWidth: '120px',
-			dialogVisible: false,
-			editVisible: false,
-			currentRowId: null,
-		}
-	},
-	watch: {
-		'formInline.question'(newVal) {
-			if (newVal === '') {
-				this.currentPage = 1
-				localStorage.setItem('lastPage', this.currentPage)
-				this.interviewPage()
-			}
-		},
-	},
-	mounted() {},
-	created() {
-		//获取问题类型的枚举
-		this.getQuestionType()
-		//获取问题列表
-		this.interviewPage()
-	},
-	methods: {
-		prepareAdd() {
-			this.form.question = ''
-			this.form.questionType = 0
-			this.dialogFormVisible = true
-		},
-		prepareMutiAdd() {
-			this.form.question = ''
-			this.form.questionType = 0
-			this.dialogMutiFormVisible = true
-		},
+    data() {
+        return {
+            // 用户列表数据
+            userlist: [],
+            loading: false,
+            elementui_page_component_key: 0,
+            currentPage: Number(localStorage.getItem('lastPage')) || 1,
+            pageSize: 9,
+            total: 0,
+            formInline: {
+                question: '',
+            },
+            options: [],
+            questionType: 0,
+            // 新增的内容
+            dialogFormVisible: false,
+            dialogMutiFormVisible: false,
+            form: {
+                question: '',
+                questionType: 0,
+            },
+            formLabelWidth: '120px',
+            dialogVisible: false,
+            editVisible: false,
+            currentRowId: null,
+        }
+    },
+    watch: {
+        'formInline.question'(newVal) {
+            if (newVal === '') {
+                this.currentPage = 1
+                localStorage.setItem('lastPage', this.currentPage)
+                this.interviewPage()
+            }
+        },
+    },
+    created() {
+        //获取问题类型的枚举
+        this.getQuestionType()
+        //获取问题列表
+        this.interviewPage()
+    },
+    mounted() {},
+    methods: {
+        prepareAdd() {
+            this.form.question = ''
+            this.form.questionType = 0
+            this.dialogFormVisible = true
+        },
+        prepareMutiAdd() {
+            this.form.question = ''
+            this.form.questionType = 0
+            this.dialogMutiFormVisible = true
+        },
 
-		prepareDelete(id) {
-			this.currentRowId = id
-			this.dialogVisible = true
-		},
-		preEdit(id, question, questionTypeName) {
-			this.form.question = question
+        prepareDelete(id) {
+            this.currentRowId = id
+            this.dialogVisible = true
+        },
+        preEdit(id, question, questionTypeName) {
+            this.form.question = question
 
-			// 定义一个映射（map）来存储 questionType 到 name 的转换
-			const questionTypeToNameMap = {}
-			this.options.forEach((option) => {
-				questionTypeToNameMap[option.name] = option.questionType
-			})
-			this.form.questionType = questionTypeToNameMap[questionTypeName]
-			this.currentRowId = id
-			this.editVisible = true
-		},
-		handleClose(done) {
-			this.$confirm('确认关闭？')
-				.then((_) => {
-					done()
-				})
-				.catch((_) => {})
-		},
-		handleConfirm(addType) {
-			this.dialogFormVisible = false // 关闭对话框
-			this.dialogMutiFormVisible = false
-			this.addQuestion(addType) // 发送请求
-		},
+            // 定义一个映射（map）来存储 questionType 到 name 的转换
+            const questionTypeToNameMap = {}
+            this.options.forEach((option) => {
+                questionTypeToNameMap[option.name] = option.questionType
+            })
+            this.form.questionType = questionTypeToNameMap[questionTypeName]
+            this.currentRowId = id
+            this.editVisible = true
+        },
+        handleClose(done) {
+            this.$confirm('确认关闭？')
+                .then((_) => {
+                    done()
+                })
+                .catch((_) => {})
+        },
+        handleConfirm(addType) {
+            this.dialogFormVisible = false // 关闭对话框
+            this.dialogMutiFormVisible = false
+            this.addQuestion(addType) // 发送请求
+        },
 
-		async addQuestion(addType) {
-			try {
-				this.loading = true
+        async addQuestion(addType) {
+            try {
+                this.loading = true
 
-				const { data: res } = await axios.post('http://localhost:8080/interviewQuestion/add', {
-					addType: addType,
-					question: this.form.question,
-					questionType: this.form.questionType,
-				})
-				if (res.code === 200) {
-					this.form.question = ''
-					this.form.questionType = 0
-					this.interviewPage() // 确保这个方法是有效的
-				} else {
-					console.error('Received non-200 status code', res)
-					this.errorMsg(res.message)
-				}
-			} catch (error) {
-				console.error('An error occurred while adding the question:', error)
-				// 异常处理逻辑
-			} finally {
-				this.loading = false
-			}
-		},
-		errorMsg(msg) {
-			this.$message({
-				showClose: true,
-				message: msg,
-				type: 'error',
-			})
-		},
-		async editConfirm() {
-			try {
-				this.loading = true
+                const { data: res } = await axios.post('http://localhost:8080/interviewQuestion/add', {
+                    addType: addType,
+                    question: this.form.question,
+                    questionType: this.form.questionType,
+                })
+                if (res.code === 200) {
+                    this.form.question = ''
+                    this.form.questionType = 0
+                    this.interviewPage() // 确保这个方法是有效的
+                } else {
+                    console.error('Received non-200 status code', res)
+                    this.errorMsg(res.message)
+                }
+            } catch (error) {
+                console.error('An error occurred while adding the question:', error)
+                // 异常处理逻辑
+            } finally {
+                this.loading = false
+            }
+        },
+        errorMsg(msg) {
+            this.$message({
+                showClose: true,
+                message: msg,
+                type: 'error',
+            })
+        },
+        async editConfirm() {
+            try {
+                this.loading = true
 
-				const { data: res } = await axios.post('http://localhost:8080/interviewQuestion/update', {
-					id: this.currentRowId,
-					question: this.form.question,
-					questionType: this.form.questionType,
-				})
-				if (res.code === 200) {
-					this.form.question = ''
-					this.form.questionType = 0
-					this.editVisible = false
-					currentRowId: null
-					this.interviewPage() // 确保这个方法是有效的
-				} else {
-					console.error('Received non-200 status code', res)
-				}
-			} catch (error) {
-				console.error('An error occurred while adding the question:', error)
-				// 异常处理逻辑
-			} finally {
-				this.loading = false
-			}
-		},
+                const { data: res } = await axios.post('http://localhost:8080/interviewQuestion/update', {
+                    id: this.currentRowId,
+                    question: this.form.question,
+                    questionType: this.form.questionType,
+                })
+                if (res.code === 200) {
+                    this.form.question = ''
+                    this.form.questionType = 0
+                    this.editVisible = false
+                    currentRowId: null
+                    this.interviewPage() // 确保这个方法是有效的
+                } else {
+                    console.error('Received non-200 status code', res)
+                }
+            } catch (error) {
+                console.error('An error occurred while adding the question:', error)
+                // 异常处理逻辑
+            } finally {
+                this.loading = false
+            }
+        },
 
-		async onDelete(id) {
-			this.dialogVisible = false
-			this.loading = true
-			const { data: res } = await axios.get('http://localhost:8080/interviewQuestion/delete', {
-				params: {
-					id: id,
-				},
-			})
-			this.interviewPage()
-			this.loading = false
-		},
-		refreshPage() {
-			//获取问题类型的枚举
-			this.getQuestionType()
-			location.reload()
-		},
+        async onDelete(id) {
+            this.dialogVisible = false
+            this.loading = true
+            const { data: res } = await axios.get('http://localhost:8080/interviewQuestion/delete', {
+                params: {
+                    id: id,
+                },
+            })
+            this.interviewPage()
+            this.loading = false
+        },
+        refreshPage() {
+            //获取问题类型的枚举
+            this.getQuestionType()
+            location.reload()
+        },
 
-		async getQuestionType() {
-			const { data: res } = await axios.get('http://localhost:8080/interviewQuestion/questionType', { params: {} })
-			if (res.code === 200) {
-				this.options = res.result
-			}
-		},
+        async getQuestionType() {
+            const { data: res } = await axios.get('http://localhost:8080/interviewQuestion/questionType', { params: {} })
+            if (res.code === 200) {
+                this.options = res.result
+            }
+        },
 
-		async interviewPage() {
-			this.loading = true
-			const { data: res } = await axios.get('http://localhost:8080/interviewQuestion/page', {
-				params: {
-					page: this.currentPage,
-					pageSize: this.pageSize,
-					question: this.formInline.question,
-					questionType: this.questionType,
-				},
-			})
-			if (res.code === 200) {
-				this.total = res.result.totalElements
-				// 定义一个映射（map）来存储 questionType 到 name 的转换
-				const questionTypeToNameMap = {}
-				this.options.forEach((option) => {
-					questionTypeToNameMap[option.questionType] = option.name
-				})
-				// 修改 userlist 中的每一个元素，将 questionType 转换为 name
-				res.result.content.forEach((user) => {
-					user.questionTypeName = questionTypeToNameMap[user.questionType] || 'Unknown'
-				})
-				this.userlist = res.result.content
-			}
-			this.loading = false
-		},
-		getClassForValue(value) {
-			// 根据值返回相应的类名
-			// 您可以根据需要编写逻辑来决定何时使用相同的类名
-			// 这里只是一个示例
-			if (value === '基础知识') {
-				return 'reddish-purple-value'
-			} else if (value === '集合') {
-				return 'new-orange-value'
-			} else if (value === 'JVM') {
-				return 'clove-tea-value'
-			} else if (value === '并发编程') {
-				return 'grassy-value'
-			} else if (value === 'MySql') {
-				return 'daylily-value'
-			} else if (value === 'Redis') {
-				return 'balloon-flower-value'
-			} else if (value === '中间件') {
-				return 'pink-value'
-			} else if (value === 'Spring') {
-				return 'purple-value'
-			} else if (value === '微服务') {
-				return 'sapphire-blue-value'
-			} else if (value === '分布式') {
-				return 'green-value'
-			} else if (value === '项目') {
-				return 'black-value'
-			} else if (value === '算法') {
-				return 'rose-hermosa-value'
-			} else if (value === '其他') {
-				return 'magenta-value'
-			} else {
-				return 'dark-blue-value'
-			}
-		},
+        async interviewPage() {
+            this.loading = true
+            const { data: res } = await axios.get('http://localhost:8080/interviewQuestion/page', {
+                params: {
+                    page: this.currentPage,
+                    pageSize: this.pageSize,
+                    question: this.formInline.question,
+                    questionType: this.questionType,
+                },
+            })
+            if (res.code === 200) {
+                this.total = res.result.totalElements
+                // 定义一个映射（map）来存储 questionType 到 name 的转换
+                const questionTypeToNameMap = {}
+                this.options.forEach((option) => {
+                    questionTypeToNameMap[option.questionType] = option.name
+                })
+                // 修改 userlist 中的每一个元素，将 questionType 转换为 name
+                res.result.content.forEach((user) => {
+                    user.questionTypeName = questionTypeToNameMap[user.questionType] || 'Unknown'
+                })
+                this.userlist = res.result.content
+            }
+            this.loading = false
+        },
+        getClassForValue(value) {
+            // 根据值返回相应的类名
+            // 您可以根据需要编写逻辑来决定何时使用相同的类名
+            // 这里只是一个示例
+            if (value === '基础知识') {
+                return 'reddish-purple-value'
+            } else if (value === '集合') {
+                return 'new-orange-value'
+            } else if (value === 'JVM') {
+                return 'clove-tea-value'
+            } else if (value === '并发编程') {
+                return 'grassy-value'
+            } else if (value === 'MySql') {
+                return 'daylily-value'
+            } else if (value === 'Redis') {
+                return 'balloon-flower-value'
+            } else if (value === '中间件') {
+                return 'pink-value'
+            } else if (value === 'Spring') {
+                return 'purple-value'
+            } else if (value === '微服务') {
+                return 'sapphire-blue-value'
+            } else if (value === '分布式') {
+                return 'green-value'
+            } else if (value === '项目') {
+                return 'black-value'
+            } else if (value === '算法') {
+                return 'rose-hermosa-value'
+            } else if (value === '反问环节') {
+                return 'white-dress-value'
+            } else if (value === '设计模式') {
+                return 'prunus-gracilis-value'
+            } else if (value === '其他') {
+                return 'magenta-value'
+            } else {
+                return 'dark-blue-value'
+            }
+        },
 
-		handleCurrentChange(currentPage) {
-			this.currentPage = currentPage
-			this.interviewPage()
-		},
-	},
+        handleCurrentChange(currentPage) {
+            this.currentPage = currentPage
+            this.interviewPage()
+        },
+    },
 }
 </script>
 
@@ -425,6 +429,12 @@ export default {
 .rose-hermosa-value {
 	color: #ff6fd8; /* 不同值的颜色 */
 }
+.white-dress-value {
+	color: #83ccd2; /* 不同值的颜色 */
+}
+.prunus-gracilis-value {
+	color: #5a79ba; /* 不同值的颜色 */
+}
 .custom-textarea {
 	width: 100%;
 	text-align: left;