fix: 添加windows系统设置出题页面

src/views/paper/question/WindowsSystemSettingForm.vue

@@ -0,0 +1,576 @@
+<template>
+  <div class="edit-dialog">
+    <Dialog v-model="dialogVisible" :title="dialogTitle" width="85%" top="10vh">
+      <el-scrollbar>
+        <div class="main">
+          <el-form
+            ref="formRef"
+            v-loading="formLoading"
+            :model="formData"
+            :rules="formRules"
+            label-width="80px"
+          >
+            <el-row>
+              <el-col :span="12">
+                <el-form-item label="专业" prop="specialtyName">
+                  <el-input v-model="formData.specialtyName" placeholder="请输入专业" disabled />
+                </el-form-item>
+              </el-col>
+
+              <el-col :span="12">
+                <el-form-item label="章节名称" prop="chapteridDictText">
+                  <el-input
+                    v-model="formData.chapteridDictTextVo"
+                    placeholder="请输入章节名称"
+                    disabled
+                  />
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row>
+              <el-col :span="12">
+                <el-form-item label="课程" prop="courseName">
+                  <el-input v-model="formData.courseName" placeholder="请输入课程" disabled />
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="题型难度" prop="quLevel">
+                  <el-select v-model="formData.quLevel" placeholder="请选择题型难度" clearable>
+                    <el-option
+                      v-for="dict in getIntDictOptions(DICT_TYPE.EXAM_QUE_DIFF)"
+                      :key="dict.value"
+                      :label="dict.label"
+                      :value="dict.value"
+                    />
+                  </el-select>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row>
+              <el-col :span="12">
+                <el-form-item label="题型" prop="subjectName">
+                  <el-input v-model="formData.subjectName" placeholder="请输入题型" disabled />
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="知识点" prop="pointNames">
+                  <el-input
+                    v-model="formData.pointNamesVo"
+                    placeholder="请选择知识点"
+                    readonly
+                    @click="openPoints()"
+                  />
+                </el-form-item>
+              </el-col>
+
+              <el-dialog v-model="dialogVisiblePoints" title="选择知识点" width="30%">
+                <el-tree
+                  ref="treeRef"
+                  :data="deptList"
+                  node-key="id"
+                  :props="{ label: 'name', children: 'children' }"
+                  highlight-current
+                  default-expand-all
+                  @node-click="handleNodeClick"
+                />
+              </el-dialog>
+            </el-row>
+            <el-row>
+              <el-col :span="12">
+                <el-form-item label="启用状态" prop="status">
+                  <el-radio-group v-model="formData.status">
+                    <el-radio :label="'0'">启用</el-radio>
+                    <el-radio :label="'1'">禁用</el-radio>
+                  </el-radio-group>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </el-form>
+          <div class="edit-bottom">
+            <div class="edit-left bottom-common">
+              <el-tabs v-model="leftActiveName" class="demo-tabs">
+                <el-tab-pane label="试题描述" name="desc">
+                  <div class="block">
+                    <Editor v-model="formData.content" height="150px" />
+                  </div>
+                </el-tab-pane>
+              </el-tabs>
+            </div>
+            <div class="edit-right bottom-common">
+              <el-tabs v-model="rightActiveName" class="demo-tabs" @tab-click="rightHandleClick">
+                <el-tab-pane label="试题解析" name="analysis">
+                  <div class="block">
+                    <Editor v-model="formData.analysis" height="150px" />
+                  </div>
+                </el-tab-pane>
+                <el-tab-pane name="answer">
+                  <template #label>
+                    <div class="custom-tabs-label">
+                      <p>试题考点</p>
+                      <el-dropdown>
+                        <span class="el-dropdown-link" @click.stop="false">
+                          <div class="setting_icon"></div>
+                        </span>
+                        <template #dropdown>
+                          <el-dropdown-menu>
+                            <el-dropdown-item>
+                              <el-button @click="addWindowsSystemInfo">添加</el-button>
+                            </el-dropdown-item>
+                          </el-dropdown-menu>
+                        </template>
+                      </el-dropdown>
+                    </div>
+                  </template>
+                  <div class="block">
+                    <el-table
+                      v-loading="loading"
+                      :data="list"
+                      @selection-change="handleSelectionChange"
+                    >
+                      <el-table-column label="考点" align="center" prop="contentIn" width="390px" />
+                      <el-table-column label="权值" align="center" prop="scoreRate" width="120px">
+                        <template #default="scope">
+                          <el-input v-model="scope.row.scoreRate" placeholder="请输入权值" />
+                        </template>
+                      </el-table-column>
+                      <el-table-column label="操作" align="center" width="100px">
+                        <template #default="scope">
+                          <el-button type="danger" plain @click="handleDelete(scope.row)" link>
+                            删除
+                          </el-button>
+                        </template>
+                      </el-table-column>
+                    </el-table>
+                  </div>
+                </el-tab-pane>
+              </el-tabs>
+            </div>
+          </div>
+        </div>
+      </el-scrollbar>
+      <template #footer>
+        <el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="dialogVisible = false">取 消</el-button>
+      </template>
+    </Dialog>
+  </div>
+  <!-- 表单弹窗：添加/修改 -->
+  <FileForm ref="FileRef" @success="handleUploadSuccess" />
+  <el-dialog
+    v-model="dialogFormVisibleWindowsSystemInfo"
+    title="Windows系统设置考点"
+    width="1100px"
+    @close="handleFrom"
+  >
+    <WindowsSystemSetting />
+  </el-dialog>
+</template>
+<script lang="ts" setup>
+import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
+import { FormRules } from 'element-plus'
+import * as QuestionApi from '@/api/paper/question'
+import FileForm from './components/FileForm.vue'
+import WindowsSystemSetting from '@/components/WindowsSystemSetting/index.vue'
+import * as SpecialtyApi from '@/api/points'
+import { handleTree } from '@/utils/tree'
+import { useSettingStore } from '@/store/modules/settings'
+const settingStore = useSettingStore()
+
+defineOptions({ name: 'WindowsSystemSettingForm' })
+
+const list = ref<any>([]) // 列表的数
+const handleFrom = () => {
+  list.value = [...settingStore.settingsFormList]
+}
+
+const { t } = useI18n() // 国际化
+const message = useMessage() // 消息弹窗
+const loading = ref(false) // 列表的加载中
+const dialogVisible = ref(false) // 弹窗的是否展示
+const dialogTitle = ref('') // 弹窗的标题
+const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
+const formType = ref('') // 表单的类型：create - 新增；update - 修改
+const formData = ref({
+  pointNamesVo: '',
+  chapteridDictTextVo: '',
+  content: '',
+  specialtyName: '',
+  courseName: '',
+  quBankName: '',
+  required: '',
+  chapteridDictText: '',
+  analysis: '',
+  quLevel: 0,
+  pointNames: '',
+  subjectName: '',
+  status: ' ',
+  resourceValue: '',
+  answerList: [
+    {
+      image: '',
+      content: '',
+      contentIn: '',
+      scoreRate: ''
+    }
+  ],
+  fileUploads: [
+    {
+      quId: '',
+      url: '',
+      fileType: '0',
+      fileName: ''
+    },
+    {
+      quId: '',
+      url: '',
+      fileType: '1',
+      fileName: ''
+    },
+    {
+      quId: '',
+      url: '',
+      fileType: '2',
+      fileName: ''
+    }
+  ]
+})
+
+const documentList = ref([
+  {
+    quId: '',
+    url: '',
+    fileType: '0',
+    fileName: ''
+  },
+  {
+    quId: '',
+    url: '',
+    fileType: '1',
+    fileName: ''
+  },
+  {
+    quId: '',
+    url: '',
+    fileType: '2',
+    fileName: ''
+  }
+])
+const dialogFormVisibleWindowsSystemInfo = ref(false)
+
+const addWindowsSystemInfo = async () => {
+  dialogFormVisibleWindowsSystemInfo.value = true
+}
+
+const handleDelete = (row) => {
+  for (let i = 0; i < list.value.length; i++) {
+    if (row.content == list.value[i].content) {
+      list.value.splice(i, 1)
+    }
+  }
+}
+
+const formRules = reactive<FormRules>({
+  status: [{ required: true, message: '启用状态必填', trigger: 'blur' }]
+})
+const formRef = ref() // 表单 Ref
+// 左侧试题描述
+const leftActiveName = ref('desc')
+// 右侧tab
+const rightActiveName = ref('answer')
+const rightHandleClick = (tab, e) => {
+  rightActiveName.value = tab.paneName.value
+}
+
+const selections = ref([])
+const handleSelectionChange = (rows) => {
+  selections.value = rows
+}
+
+/** 添加/修改操作 */
+const FileRef = ref()
+const openForm = (type: string) => {
+  FileRef.value.open(type)
+}
+
+const handleUploadSuccess = ({ url, fileType }) => {
+  const index = documentList.value.findIndex((item) => item.fileType === fileType)
+  if (index !== -1) {
+    documentList.value[index].url = url
+  }
+}
+
+// 知识点相关
+const dialogVisiblePoints = ref(false)
+const deptList = ref<any>([])
+const treeRef = ref()
+
+const openPoints = () => {
+  dialogVisiblePoints.value = true
+  getTreePoint()
+}
+
+const getTreePoint = async () => {
+  const res = await SpecialtyApi.listPoints()
+  deptList.value = handleTree(res)
+}
+
+const handleNodeClick = (data: any) => {
+  formData.value.pointNamesVo = data.name
+  formData.value.pointNames = data.id
+  dialogVisiblePoints.value = false
+}
+
+/** 打开弹窗 */
+const open = async (queryParams: any, type: string, id?: number) => {
+  dialogVisible.value = true
+  settingStore.settingsFormList = []
+  dialogTitle.value = t('action.' + type)
+  formType.value = type
+
+  // 修改时，设置数据
+  if (id) {
+    formLoading.value = true
+    try {
+      const res = await QuestionApi.getQuestion(id)
+      formData.value = res
+      console.log(formData.value)
+      list.value = formData.value.answerList
+      settingStore.settingsFormList = [...list.value]
+      documentList.value = res.fileUploads
+    } finally {
+      formLoading.value = false
+    }
+  } else {
+    resetForm()
+    formData.value.specialtyName = queryParams.specialtyName
+    formData.value.courseName = queryParams.courseName
+    formData.value.subjectName = queryParams.subjectName
+    formData.value.pointNames = queryParams.pointNamesVo
+    formData.value.pointNamesVo = queryParams.pointNames
+    formData.value.chapteridDictText = queryParams.chapteridDictTextVo
+    formData.value.chapteridDictTextVo = queryParams.chapteridDictText
+  }
+}
+defineExpose({ open }) // 提供 open 方法，用于打开弹窗
+
+/** 提交表单 */
+const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
+const submitForm = async () => {
+  formData.value.answerList = list.value
+  formData.value.fileUploads = documentList.value
+  // 校验表单
+  if (!formRef.value) return
+  const valid = await formRef.value.validate()
+  if (!valid) return
+  // 提交请求
+  formLoading.value = true
+  try {
+    const data = formData.value as unknown
+    if (formType.value === 'create') {
+      await QuestionApi.addQuestion(data)
+      message.success(t('common.createSuccess'))
+    } else {
+      await QuestionApi.editQuestion(data)
+      message.success(t('common.updateSuccess'))
+    }
+    dialogVisible.value = false
+    // 发送操作成功的事件
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+
+/** 重置表单 */
+const resetForm = () => {
+  formData.value = {
+    pointNamesVo: '',
+    chapteridDictTextVo: '',
+    content: '',
+    specialtyName: '',
+    courseName: '',
+    quBankName: '',
+    required: '',
+    chapteridDictText: '',
+    analysis: '',
+    quLevel: 0,
+    pointNames: '',
+    subjectName: '',
+    status: ' ',
+    resourceValue: '',
+    answerList: [
+      {
+        image: '',
+        content: '',
+        contentIn: '',
+        scoreRate: ''
+      }
+    ],
+    fileUploads: [
+      {
+        quId: '',
+        url: '',
+        fileType: '0',
+        fileName: ''
+      },
+      {
+        quId: '',
+        url: '',
+        fileType: '1',
+        fileName: ''
+      },
+      {
+        quId: '',
+        url: '',
+        fileType: '2',
+        fileName: ''
+      }
+    ]
+  }
+  formRef.value?.resetFields()
+}
+</script>
+
+<style lang="scss" scoped>
+.edit-dialog {
+  :deep(.el-dialog) {
+    display: flex;
+    flex-direction: column;
+    .el-dialog__header {
+      border-bottom: 1px solid #ededed;
+    }
+    .el-dialog__footer {
+      border-top: 1px solid #ededed;
+    }
+    .el-dialog__body {
+      flex: 1;
+      overflow: hidden;
+      .main {
+        .el-form {
+          padding: 10px;
+          .el-row {
+            justify-content: space-between;
+            margin-bottom: 10px;
+          }
+          .el-form-item {
+            width: 100%;
+            margin-bottom: 0;
+            align-items: center;
+          }
+        }
+        .edit-bottom {
+          display: flex;
+          justify-content: space-between;
+          padding-bottom: 10px;
+          .bottom-common {
+            width: calc(50% - 10px);
+            .el-tabs {
+              height: 100%;
+              .el-tabs__content {
+                flex: 1;
+                overflow-y: auto;
+                .block {
+                  width: 100%;
+                  height: 200px;
+                  overflow: auto;
+                }
+                .answer {
+                  .tip {
+                    color: #8a6d3b;
+                    background-color: #fcf8e3;
+                    border-color: #faebcc;
+                    padding: 10px 20px;
+                    display: flex;
+                    align-items: center;
+                    > p {
+                      flex-shrink: 0;
+                    }
+                  }
+                  .el-radio-group {
+                    width: 100%;
+                    display: inline-flex;
+                    align-items: flex-start;
+                    font-size: 0;
+                    flex-direction: column;
+                    .options {
+                      width: 100%;
+                      margin-top: 15px;
+                      .content {
+                        display: flex;
+                        .text {
+                          width: 100%;
+                          height: 70px;
+                          border: 1px solid #ededed;
+                          .el-textarea__inner {
+                            resize: none;
+                          }
+                        }
+                      }
+                      .more-btn {
+                        margin-top: 8px;
+                        background-color: #ffffff;
+                        border-color: #007bff;
+                        color: #007bff;
+                        width: auto;
+                        height: auto;
+                        padding: 10px 10px;
+                      }
+                    }
+                  }
+                }
+              }
+
+              .custom-tabs-label {
+                display: flex;
+                align-items: center;
+                .setting_icon {
+                  width: 16px;
+                  height: 16px;
+                  background: url('@/assets/icon/setting_blue.png') no-repeat center;
+                  background-size: 100%;
+                  margin-left: 3px;
+                  display: none;
+                }
+              }
+              .is-active {
+                .custom-tabs-label {
+                  .setting_icon {
+                    display: block;
+                  }
+                }
+              }
+              :deep(.ele-pro-table) {
+                flex: 1;
+                margin-top: 10px;
+                .el-table--fit {
+                  height: 100%;
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+}
+
+:deep(.tox-tinymce) {
+  .tox-statusbar {
+    display: none;
+  }
+}
+
+:deep(.el-table) {
+  .el-table__header-wrapper {
+    .el-table__header {
+      thead {
+        tr {
+          th {
+            background: #ebebeb;
+          }
+        }
+      }
+    }
+  }
+}
+</style>

src/views/paper/question/index.vue

@@ -338,6 +338,7 @@
   <WpsWordForm ref="wformRef" @success="getList" />
   <WpsPptxForm ref="pformRef" @success="getList" />
   <SettingForm ref="setformRef" @success="getList" />
+  <WindowsSystemSettingForm ref="windowsSystemFormRef" @success="getList" />
   <EmailForm ref="emailformRef" @success="getList" />
   <WpsXlsxForm ref="xlsxformRef" @success="getList" />
   <PsForm ref="psformRef" @success="getList" />
@@ -360,6 +361,7 @@ import UserImportForm from './UserImportForm.vue'
 import WpsWordForm from './WpsWordForm.vue'
 import WpsPptxForm from './WpsPptxForm.vue'
 import SettingForm from './SettingForm.vue'
+import WindowsSystemSettingForm from './WindowsSystemSettingForm.vue'
 import WpsXlsxForm from './WpsXlsxForm.vue'
 import PsForm from './PsForm.vue'
 import EmailForm from './EmailForm.vue'
@@ -743,6 +745,7 @@ const fformRef = ref()
 const wformRef = ref()
 const pformRef = ref()
 const setformRef = ref()
+const windowsSystemFormRef = ref()
 const emailformRef = ref()
 const xlsxformRef = ref()
 const psformRef = ref()
@@ -767,6 +770,8 @@ const openForm = (type: string, id?: number) => {
     pformRef.value.open(queryParams, type, id)
   } else if (chooseQuestionType.value.includes('windows网络设置')) {
     setformRef.value.open(queryParams, type, id)
+  } else if (chooseQuestionType.value.includes('windows系统设置')) {
+    windowsSystemFormRef.value.open(queryParams, type, id)
   } else if (chooseQuestionType.value.includes('邮箱')) {
     emailformRef.value.open(queryParams, type, id)
   } else if (chooseQuestionType.value.includes('表格')) {
@@ -850,8 +855,8 @@ const handleDeletes = async () => {
       type: 'warning'
     })
     selectedRows.value = rows.map((d: any) => d.quId) // 保存选中的行数据
-   const res =  await QuestionApi.removeQuestions(selectedRows.value)
-      if (res == '删除成功') {
+    const res = await QuestionApi.removeQuestions(selectedRows.value)
+    if (res == '删除成功') {
       message.success(res)
     } else {
       message.error(res)