Course.vue 31 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136
  1. <template>
  2. <section
  3. v-loading.body="fileLoading"
  4. v-loading.fullscreen="loading"
  5. element-loading-text="请稍后..."
  6. class="content"
  7. >
  8. <div class="part-box">
  9. <h2 class="part-box-title">课程列表</h2>
  10. <el-form
  11. ref="primaryForm"
  12. class="part-filter-form"
  13. inline
  14. :model="formSearch"
  15. >
  16. <el-form-item label="课程名称">
  17. <el-input v-model="formSearch.name" placeholder="请输入课程名称" />
  18. </el-form-item>
  19. <el-form-item label="课程代码">
  20. <el-input v-model="formSearch.code" placeholder="请输入课程代码" />
  21. </el-form-item>
  22. <el-form-item label="课程状态">
  23. <el-select v-model="formSearch.enable" placeholder="请选择" clearable>
  24. <el-option
  25. v-for="item in statusList"
  26. :key="item.value"
  27. :label="item.label"
  28. :value="item.value"
  29. />
  30. </el-select>
  31. </el-form-item>
  32. <el-form-item label="层次">
  33. <el-select v-model="formSearch.level" placeholder="请选择" clearable>
  34. <el-option
  35. v-for="item in levelList"
  36. :key="item.value"
  37. :label="item.label"
  38. :value="item.value"
  39. />
  40. </el-select>
  41. </el-form-item>
  42. <el-form-item label="专业" prop="specialtyId">
  43. <el-select
  44. v-model="formSearch.specialtyId"
  45. remote
  46. :remote-method="getSpecialtyList4Search"
  47. :loading="specialtyLoading4Search"
  48. filterable
  49. clearable
  50. placeholder="请选择"
  51. @focus="(e) => getSpecialtyList4Search(e.target.value)"
  52. >
  53. <el-option
  54. v-for="item in specialtyList4SearchWrapper"
  55. :key="item.id"
  56. :label="item.name"
  57. :value="item.id"
  58. />
  59. </el-select>
  60. </el-form-item>
  61. <el-form-item>
  62. <el-button type="danger" @click="handleSearchBtn">查询</el-button>
  63. <el-button type="danger" plain @click="resetPrimaryForm">
  64. 重置
  65. </el-button>
  66. </el-form-item>
  67. </el-form>
  68. <div class="part-box-action">
  69. <div>
  70. <el-button
  71. type="success"
  72. plain
  73. :disabled="noBatchSelected"
  74. icon="icon icon-play"
  75. @click="enableByIds"
  76. >启用
  77. </el-button>
  78. <el-button
  79. type="danger"
  80. plain
  81. :disabled="noBatchSelected"
  82. icon="icon icon-delete"
  83. @click="disableByIds"
  84. >禁用</el-button
  85. >
  86. <el-button
  87. type="primary"
  88. plain
  89. icon="icon icon-import"
  90. @click="impCourse"
  91. >导入</el-button
  92. >
  93. <el-button
  94. type="primary"
  95. plain
  96. icon="icon icon-export"
  97. @click="exportCourse"
  98. >导出</el-button
  99. >
  100. </div>
  101. <el-button
  102. type="primary"
  103. icon="icon icon-plus-white"
  104. @click="insertCourse"
  105. >新增</el-button
  106. >
  107. </div>
  108. </div>
  109. <div class="part-box">
  110. <!-- 页面列表 -->
  111. <!-- FIXME: element-ui style bug https://github.com/ElemeFE/element/issues/16167 -->
  112. <el-table :data="tableData" resizable @selection-change="selectChange">
  113. <el-table-column type="selection" width="50" align="center" />
  114. <el-table-column prop="id" label="课程ID" width="80" />
  115. <el-table-column prop="name" label="课程名称" width="180" />
  116. <el-table-column prop="code" label="课程代码" />
  117. <el-table-column label="层次">
  118. <span slot-scope="scope">{{ getLevel(scope.row.level) }}</span>
  119. </el-table-column>
  120. <el-table-column width="50" label="状态">
  121. <span slot-scope="scope">
  122. <span v-if="scope.row.enable">
  123. <el-tooltip
  124. class="item"
  125. effect="dark"
  126. content="启用"
  127. placement="left"
  128. >
  129. <i class="icon icon-right"></i>
  130. </el-tooltip>
  131. </span>
  132. <span v-else>
  133. <el-tooltip
  134. class="item"
  135. effect="dark"
  136. content="禁用"
  137. placement="left"
  138. >
  139. <i class="icon icon-error"></i>
  140. </el-tooltip>
  141. </span>
  142. </span>
  143. </el-table-column>
  144. <el-table-column
  145. sortable
  146. prop="updateTime"
  147. label="更新时间"
  148. width="170"
  149. />
  150. <el-table-column label="操作" width="160">
  151. <div slot-scope="scope">
  152. <!-- <el-button
  153. size="mini"
  154. type="primary"
  155. plain
  156. icon="el-icon-share"
  157. @click="relation(scope.row)"
  158. >
  159. 关联专业
  160. </el-button> -->
  161. <el-button
  162. size="mini"
  163. type="primary"
  164. plain
  165. @click="editCourse(scope.row)"
  166. >
  167. 编辑
  168. </el-button>
  169. <el-button
  170. v-if="!scope.row.enable"
  171. size="mini"
  172. plain
  173. type="primary"
  174. @click="enableById(scope.row)"
  175. >
  176. 启用
  177. </el-button>
  178. <el-button
  179. v-if="scope.row.enable"
  180. size="mini"
  181. plain
  182. type="danger"
  183. @click="disableById(scope.row)"
  184. >
  185. 禁用
  186. </el-button>
  187. </div>
  188. </el-table-column>
  189. </el-table>
  190. <div class="part-page">
  191. <el-pagination
  192. :current-page="currentPage"
  193. :page-size="10"
  194. :page-sizes="[10, 20, 50, 100, 200, 300]"
  195. layout="total, sizes, prev, pager, next, jumper"
  196. :total="total"
  197. @current-change="handleCurrentChange"
  198. @size-change="handleSizeChange"
  199. >
  200. </el-pagination>
  201. </div>
  202. </div>
  203. <!-- 添加或新增课程弹出框 -->
  204. <el-dialog
  205. title="课程"
  206. width="520px"
  207. :visible.sync="courseDialog"
  208. :modal="false"
  209. append-to-body
  210. custom-class="side-dialog"
  211. @close="dialogBeforeClose"
  212. >
  213. <el-form
  214. ref="courseForm"
  215. :inline="true"
  216. inline-message
  217. class="form-tight"
  218. :model="courseForm"
  219. :rules="rules"
  220. label-width="90px"
  221. >
  222. <el-form-item label="课程代码" prop="code">
  223. <el-input
  224. v-model="courseForm.code"
  225. :disabled="null != courseForm.id"
  226. class="dialog-input-width"
  227. auto-complete="off"
  228. placeholder="请输入课程代码"
  229. />
  230. </el-form-item>
  231. <el-form-item label="课程名称" prop="name">
  232. <el-input
  233. v-model="courseForm.name"
  234. class="dialog-input-width"
  235. auto-complete="off"
  236. placeholder="请输入课程名称"
  237. />
  238. </el-form-item>
  239. <el-form-item label="层次" prop="level">
  240. <el-select
  241. v-model="courseForm.level"
  242. class="dialog-input-width"
  243. placeholder="请选择"
  244. >
  245. <el-option
  246. v-for="item in levelList"
  247. :key="item.value"
  248. :label="item.label"
  249. :value="item.value"
  250. />
  251. </el-select>
  252. </el-form-item>
  253. <el-form-item label="课程状态" prop="enable">
  254. <el-radio-group
  255. v-model="courseForm.enable"
  256. class="dialog-input-width"
  257. >
  258. <el-radio label="true">启用</el-radio>
  259. <el-radio label="false">禁用</el-radio>
  260. </el-radio-group>
  261. </el-form-item>
  262. </el-form>
  263. <div slot="footer">
  264. <el-button type="primary" @click="submitForm">保存</el-button>
  265. <el-button type="danger" plain @click="courseDialog = false"
  266. >取消</el-button
  267. >
  268. </div>
  269. </el-dialog>
  270. <!-- 导入弹窗 -->
  271. <el-dialog
  272. title="导入课程"
  273. width="520px"
  274. :visible.sync="impDialog"
  275. :modal="false"
  276. append-to-body
  277. custom-class="side-dialog"
  278. >
  279. <el-form>
  280. <el-form-item style="margin-left: 20px">
  281. <el-upload
  282. ref="upload"
  283. class="form_left"
  284. accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
  285. :action="uploadAction"
  286. :headers="uploadHeaders"
  287. :data="uploadData"
  288. :before-upload="beforeUpload"
  289. :on-progress="uploadProgress"
  290. :on-success="uploadSuccess"
  291. :on-error="uploadError"
  292. :file-list="fileList"
  293. :auto-upload="false"
  294. :multiple="false"
  295. >
  296. <el-button
  297. slot="trigger"
  298. size="small"
  299. type="primary"
  300. icon="icon icon-search-white"
  301. >
  302. 选择文件
  303. </el-button>
  304. <el-button
  305. size="small"
  306. type="primary"
  307. icon="icon icon-save-white"
  308. @click="submitUpload"
  309. >
  310. 确认上传
  311. </el-button>
  312. <el-button
  313. size="small"
  314. type="primary"
  315. icon="icon icon-delete-white"
  316. @click="removeFile"
  317. >
  318. 清空文件
  319. </el-button>
  320. <el-button
  321. size="small"
  322. type="primary"
  323. icon="icon icon-export-white"
  324. @click="exportFile"
  325. >
  326. 下载模板
  327. </el-button>
  328. <div slot="tip" class="el-upload__tip">只能上传xlsx文件</div>
  329. </el-upload>
  330. </el-form-item>
  331. </el-form>
  332. </el-dialog>
  333. <!-- 导入错误信息列表 -->
  334. <el-dialog title="错误提示" :visible.sync="errDialog">
  335. <div
  336. v-for="errMessage in errMessages"
  337. :key="errMessage.lineNum"
  338. class="text-danger"
  339. >
  340. {{ errMessage.lineNum }}行:{{ errMessage.msg }}
  341. </div>
  342. <span slot="footer" class="dialog-footer">
  343. <el-button @click="errDialog = false">确定</el-button>
  344. </span>
  345. </el-dialog>
  346. <!-- 关联专业弹出框 -->
  347. <el-dialog
  348. :title="specialtyDialogTitle"
  349. :visible.sync="specialtyDialog"
  350. width="800px"
  351. :modal="false"
  352. append-to-body
  353. custom-class="side-dialog"
  354. >
  355. <!-- 表单 -->
  356. <el-form :inline="true" :model="specialtySearchForm">
  357. <el-form-item label="专业名称">
  358. <el-input
  359. v-model="specialtySearchForm.name"
  360. placeholder="请输入专业名称"
  361. />
  362. </el-form-item>
  363. <el-form-item label="专业代码">
  364. <el-input
  365. v-model="specialtySearchForm.code"
  366. placeholder="请输入专业代码"
  367. />
  368. </el-form-item>
  369. <el-form-item>
  370. <el-button
  371. size="small"
  372. type="primary"
  373. icon="el-icon-search"
  374. @click="searchSpecialtyPage"
  375. >
  376. 查询
  377. </el-button>
  378. <el-button
  379. size="small"
  380. type="primary"
  381. icon="el-icon-plus"
  382. @click="addRelation"
  383. >
  384. 新增
  385. </el-button>
  386. </el-form-item>
  387. </el-form>
  388. <!-- 专业列表 -->
  389. <el-table :data="specialtyTableData" border>
  390. <el-table-column prop="id" label="ID" width="100" />
  391. <el-table-column prop="name" label="专业名称" width="250" />
  392. <el-table-column prop="code" label="专业代码" />
  393. <el-table-column
  394. sortable
  395. prop="updateTime"
  396. label="更新时间"
  397. width="170"
  398. />
  399. <el-table-column label="操作">
  400. <div slot-scope="scope">
  401. <span>
  402. <el-button
  403. size="mini"
  404. type="primary"
  405. icon="el-icon-edit"
  406. plain
  407. @click="deleteRelation(scope.row)"
  408. >
  409. 取消关联
  410. </el-button>
  411. </span>
  412. </div>
  413. </el-table-column>
  414. </el-table>
  415. <div class="part-page">
  416. <el-pagination
  417. :current-page="currentSpecialtyPage"
  418. :page-size="10"
  419. :total="specialtyTotal"
  420. @current-change="handleSpecialtyCurrentChange"
  421. />
  422. </div>
  423. </el-dialog>
  424. <!-- 添加关联 -->
  425. <el-dialog
  426. title="添加关联专业"
  427. :visible.sync="addRelationDialog"
  428. width="520px"
  429. :modal="false"
  430. append-to-body
  431. custom-class="side-dialog"
  432. @close="() => $refs.addRelationForm.clearValidate()"
  433. >
  434. <el-form
  435. ref="addRelationForm"
  436. :inline="true"
  437. inline-message
  438. class="form-tight"
  439. :model="addRelationForm"
  440. :rules="addRelationRules"
  441. >
  442. <el-form-item label="专业" prop="specialtyId">
  443. <el-select
  444. v-model="addRelationForm.specialtyId"
  445. class="dialog-input-width"
  446. remote
  447. :remote-method="getSpecialtyList4AddRelation"
  448. :loading="specialtyLoading4AddRelation"
  449. filterable
  450. clearable
  451. placeholder="请选择"
  452. @focus="(e) => getSpecialtyList4AddRelation(e.target.value)"
  453. >
  454. <el-option
  455. v-for="item in specialtyList4AddRelationWrapper"
  456. :key="item.id"
  457. :label="item.name"
  458. :value="item.id"
  459. />
  460. </el-select>
  461. </el-form-item>
  462. </el-form>
  463. <div slot="footer">
  464. <el-button type="primary" @click="submitAddRelationForm">
  465. 保存
  466. </el-button>
  467. <el-button @click="addRelationDialog = false">取消</el-button>
  468. </div>
  469. </el-dialog>
  470. </section>
  471. </template>
  472. <script>
  473. import { QUESTION_API } from "@/constants/constants.js";
  474. import { ENABLE_TYPE, LEVEL_TYPE } from "../constants/constants.js";
  475. import { mapState } from "vuex";
  476. export default {
  477. name: "Course",
  478. data() {
  479. return {
  480. specialtyLoading4Search: false,
  481. specialtyList4Search: [],
  482. formSearch: {
  483. name: "",
  484. code: "",
  485. enable: "",
  486. level: "",
  487. specialtyId: "",
  488. },
  489. courseForm: {
  490. id: null,
  491. name: "",
  492. code: "",
  493. level: "ALL",
  494. enable: "true",
  495. },
  496. statusList: ENABLE_TYPE,
  497. levelList: LEVEL_TYPE,
  498. selectedCourseIds: [],
  499. tableData: [],
  500. currentPage: 1,
  501. pageSize: 10,
  502. total: 10,
  503. specialtyAllList: [],
  504. specialtyList: [],
  505. selectedSpecialtyList: [],
  506. specialtys: [],
  507. specialtyAll: [],
  508. impDialog: false,
  509. uploadAction: QUESTION_API + "/course/import",
  510. uploadHeaders: {},
  511. uploadData: {},
  512. errMessages: [],
  513. errDialog: false,
  514. fileLoading: false,
  515. loading: false,
  516. fileList: [],
  517. courseDialog: false,
  518. relationDialog: false,
  519. rules: {
  520. name: [
  521. {
  522. required: true,
  523. message: "请输入课程名称",
  524. trigger: "blur",
  525. },
  526. ],
  527. code: [
  528. {
  529. required: true,
  530. message: "请输入课程代码",
  531. trigger: "blur",
  532. },
  533. ],
  534. level: [
  535. {
  536. required: true,
  537. message: "请选择层次",
  538. trigger: "change",
  539. },
  540. ],
  541. status: [
  542. {
  543. required: true,
  544. message: "请选择状态",
  545. trigger: "change",
  546. },
  547. ],
  548. },
  549. specialtyDialog: false,
  550. specialtyDialogTitle: null,
  551. specialtySearchForm: {
  552. courseId: null,
  553. code: "",
  554. name: "",
  555. },
  556. specialtyTableData: [],
  557. currentSpecialtyPage: 1,
  558. specialtyPageSize: 10,
  559. specialtyTotal: 10,
  560. addRelationDialog: false,
  561. addRelationForm: {
  562. specialtyId: null,
  563. courseId: null,
  564. },
  565. specialtyLoading4AddRelation: false,
  566. specialtyList4AddRelation: [],
  567. addRelationRules: {
  568. specialtyId: [
  569. {
  570. required: true,
  571. type: "number",
  572. message: "请选择专业",
  573. trigger: "change",
  574. },
  575. ],
  576. },
  577. };
  578. },
  579. computed: {
  580. ...mapState({
  581. user: (state) => state.user,
  582. }),
  583. noBatchSelected() {
  584. return this.selectedCourseIds.length === 0;
  585. },
  586. courseIds() {
  587. var courseIds = "";
  588. for (let courseId of this.selectedCourseIds) {
  589. if (!courseIds) {
  590. courseIds += courseId;
  591. } else {
  592. courseIds += "," + courseId;
  593. }
  594. }
  595. return courseIds;
  596. },
  597. specialtyAllListSelect() {
  598. let specialtyList = [];
  599. for (let specialty of this.specialtyAllList) {
  600. let specialtyInfo = specialty.name + "(" + specialty.code + ")";
  601. specialtyList.push({ id: specialty.id, specialtyInfo: specialtyInfo });
  602. }
  603. return specialtyList;
  604. },
  605. getSpecialtyAllSelect4Search() {
  606. let specialtyList4Search = [];
  607. for (let specialty of this.specialtys) {
  608. let specialtyInfo = specialty.name + "(" + specialty.code + ")";
  609. specialtyList4Search.push({
  610. id: specialty.id,
  611. specialtyInfo: specialtyInfo,
  612. });
  613. }
  614. return specialtyList4Search;
  615. },
  616. specialtyList4SearchWrapper() {
  617. var specialtyList = [];
  618. for (let course of this.specialtyList4Search) {
  619. var name = course.name + " - " + course.code;
  620. var id = course.id;
  621. specialtyList.push({ id: id, name: name });
  622. }
  623. return specialtyList;
  624. },
  625. specialtyList4AddRelationWrapper() {
  626. var specialtyList = [];
  627. for (let course of this.specialtyList4AddRelation) {
  628. var name = course.name + " - " + course.code;
  629. var id = course.id;
  630. specialtyList.push({ id: id, name: name });
  631. }
  632. return specialtyList;
  633. },
  634. },
  635. //初始化查询
  636. created() {
  637. this.searchForm();
  638. this.uploadHeaders = {
  639. key: this.user.key,
  640. token: this.user.token,
  641. };
  642. },
  643. methods: {
  644. handleSizeChange(val) {
  645. this.pageSize = val;
  646. this.currentPage = 1;
  647. this.searchForm();
  648. },
  649. dialogBeforeClose() {
  650. this.$refs.courseForm.clearValidate();
  651. },
  652. deleteRelation(row) {
  653. var specialtyId = row.id;
  654. var courseId = this.specialtySearchForm.courseId;
  655. var param = new URLSearchParams({
  656. courseId: courseId,
  657. specialtyId: specialtyId,
  658. });
  659. var url = QUESTION_API + "/courseSpeciatlyRelation/delete?" + param;
  660. this.$httpWithMsg.delete(url).then(() => {
  661. this.$notify({
  662. type: "success",
  663. message: "取消关联成功!",
  664. });
  665. this.searchSpecialtyPage();
  666. });
  667. },
  668. submitAddRelationForm() {
  669. this.$refs.addRelationForm.validate((valid) => {
  670. if (valid) {
  671. var param = new URLSearchParams(this.addRelationForm);
  672. var url = QUESTION_API + "/courseSpeciatlyRelation/add?" + param;
  673. this.$httpWithMsg.post(url, this.speciallyForm).then(() => {
  674. this.$notify({
  675. type: "success",
  676. message: "添加成功!",
  677. });
  678. this.searchSpecialtyPage();
  679. this.addRelationDialog = false;
  680. });
  681. } else {
  682. console.log("error submit!");
  683. return false;
  684. }
  685. });
  686. },
  687. getSpecialtyList4AddRelation(query) {
  688. this.specialtyLoading4AddRelation = true;
  689. this.$httpWithMsg
  690. .get(QUESTION_API + "/specialty/query?name=" + query)
  691. .then((response) => {
  692. this.specialtyList4AddRelation = response.data;
  693. this.specialtyLoading4AddRelation = false;
  694. });
  695. },
  696. addRelation() {
  697. this.addRelationForm.specialtyId = null;
  698. this.addRelationForm.courseId = this.specialtySearchForm.courseId;
  699. this.addRelationDialog = true;
  700. if (this.$refs.addRelationForm) {
  701. this.$refs.addRelationForm.resetFields();
  702. }
  703. },
  704. handleSpecialtyCurrentChange(val) {
  705. this.currentSpecialtyPage = val;
  706. this.searchSpecialtyPage();
  707. },
  708. searchSpecialtyPage() {
  709. var param = new URLSearchParams(this.specialtySearchForm);
  710. var url =
  711. QUESTION_API +
  712. "/specialty/specialtyPage/" +
  713. (this.currentSpecialtyPage - 1) +
  714. "/" +
  715. this.pageSize +
  716. "?" +
  717. param;
  718. this.$httpWithMsg
  719. .get(url)
  720. .then((response) => {
  721. this.specialtyTableData = response.data.content;
  722. this.specialtyTotal = response.data.totalElements;
  723. })
  724. .then(() => {
  725. if (this.specialtyTableData.length === 0 && this.specialtyTotal > 0) {
  726. this.currentSpecialtyPage = this.currentSpecialtyPage - 1;
  727. this.searchSpecialtyPage();
  728. }
  729. });
  730. },
  731. getTag(status) {
  732. if (status == true) {
  733. return "success";
  734. } else if (status == false) {
  735. return "danger";
  736. }
  737. return status;
  738. },
  739. getLevel(level) {
  740. if (level == "ZSB") {
  741. return "专升本";
  742. } else if (level == "GQZ") {
  743. return "高起专";
  744. } else if (level == "GQB") {
  745. return "高起本";
  746. } else {
  747. return "不限";
  748. }
  749. },
  750. getSpecialtyList4Search(query) {
  751. this.specialtyLoading4Search = true;
  752. this.$httpWithMsg
  753. .get(QUESTION_API + "/specialty/query?name=" + query)
  754. .then((response) => {
  755. this.specialtyList4Search = response.data;
  756. this.specialtyLoading4Search = false;
  757. });
  758. },
  759. handleSearchBtn() {
  760. this.currentPage = 1;
  761. this.searchForm();
  762. },
  763. searchForm() {
  764. let searchLock = true;
  765. setTimeout(() => {
  766. if (searchLock) {
  767. this.loading = true;
  768. }
  769. }, 500);
  770. var param = new URLSearchParams(this.formSearch);
  771. var url =
  772. QUESTION_API +
  773. "/course/coursePage/" +
  774. (this.currentPage - 1) +
  775. "/" +
  776. this.pageSize +
  777. "?" +
  778. param;
  779. this.$httpWithMsg
  780. .get(url)
  781. .then((response) => {
  782. this.tableData = response.data.content;
  783. this.total = response.data.totalElements;
  784. })
  785. .finally(() => {
  786. searchLock = false;
  787. this.loading = false;
  788. });
  789. },
  790. handleCurrentChange(val) {
  791. this.currentPage = val;
  792. this.searchForm();
  793. },
  794. selectChange(row) {
  795. this.selectedCourseIds = [];
  796. row.forEach((element) => {
  797. this.selectedCourseIds.push(element.id);
  798. });
  799. console.log(this.selectedCourseIds);
  800. },
  801. //新增
  802. insertCourse() {
  803. this.courseForm.id = null;
  804. this.courseForm.name = null;
  805. this.courseForm.code = null;
  806. this.courseForm.level = "ALL";
  807. this.courseForm.enable = "true";
  808. this.courseDialog = true;
  809. },
  810. //修改
  811. editCourse(row) {
  812. this.courseForm = Object.assign({}, row);
  813. this.courseForm.enable = row.enable ? "true" : "false";
  814. this.courseId = row.id;
  815. this.courseDialog = true;
  816. },
  817. exportCourse() {
  818. var param = new URLSearchParams(this.formSearch);
  819. window.open(
  820. QUESTION_API +
  821. "/course/export?$key=" +
  822. this.user.key +
  823. "&$token=" +
  824. this.user.token +
  825. "&" +
  826. param
  827. );
  828. },
  829. //关联课程
  830. relation(row) {
  831. this.specialtyDialogTitle =
  832. "关联专业列表 【课程名称:" +
  833. row.name +
  834. "】【 课程代码:" +
  835. row.code +
  836. "】";
  837. this.specialtySearchForm.courseId = row.id;
  838. this.specialtySearchForm.name = "";
  839. this.specialtySearchForm.code = "";
  840. this.searchSpecialtyPage();
  841. this.specialtyDialog = true;
  842. },
  843. closeCourse() {
  844. this.courseDialog = false;
  845. },
  846. saveRelation() {},
  847. //保存(新增/修改)
  848. submitForm() {
  849. var url = QUESTION_API + "/course";
  850. if (null != this.courseForm.id) {
  851. //修改
  852. this.$refs.courseForm.validate((valid) => {
  853. if (valid) {
  854. this.$httpWithMsg.put(url, this.courseForm).then(() => {
  855. this.$notify({
  856. type: "success",
  857. message: "修改成功!",
  858. });
  859. this.searchForm();
  860. this.resetForm();
  861. this.courseDialog = false;
  862. });
  863. } else {
  864. console.log("error submit!");
  865. return false;
  866. }
  867. });
  868. } else {
  869. this.$refs.courseForm.validate((valid) => {
  870. if (valid) {
  871. this.$httpWithMsg.post(url, this.courseForm).then(() => {
  872. this.$notify({
  873. type: "success",
  874. message: "添加成功",
  875. });
  876. this.searchForm();
  877. this.resetForm();
  878. this.courseDialog = false;
  879. });
  880. } else {
  881. console.log("error submit!");
  882. return false;
  883. }
  884. });
  885. }
  886. },
  887. //重置
  888. resetForm() {
  889. this.$refs.courseForm.resetFields();
  890. },
  891. resetPrimaryForm() {
  892. this.formSearch = {
  893. name: "",
  894. code: "",
  895. enable: "",
  896. level: "",
  897. specialtyId: "",
  898. };
  899. this.$refs.primaryForm.resetFields();
  900. },
  901. //删除单个数据
  902. deleteById(row) {
  903. this.$confirm("是否删除该课程?", "提示", {
  904. confirmButtonText: "确定",
  905. cancelButtonText: "取消",
  906. type: "warning",
  907. }).then(() => {
  908. var url = QUESTION_API + "/course/" + row.id;
  909. this.$httpWithMsg.delete(url).then(() => {
  910. this.$notify({
  911. type: "success",
  912. message: "删除成功!",
  913. });
  914. this.searchForm();
  915. });
  916. });
  917. },
  918. //删除多条数据
  919. deleteByIds() {
  920. if (this.selectedCourseIds.length === 0) {
  921. this.$notify({
  922. type: "warning",
  923. message: "请选择要删除的课程",
  924. });
  925. } else {
  926. this.$confirm("是否删除这些课程?", "提示", {
  927. confirmButtonText: "确定",
  928. cancelButtonText: "取消",
  929. type: "error",
  930. }).then(() => {
  931. var url = QUESTION_API + "/course/" + this.courseIds;
  932. this.$httpWithMsg.delete(url).then(() => {
  933. this.$notify({
  934. type: "success",
  935. message: "删除成功!",
  936. });
  937. this.searchForm();
  938. });
  939. });
  940. }
  941. },
  942. //启用
  943. enableByIds() {
  944. if (this.selectedCourseIds.length === 0) {
  945. this.$notify({
  946. type: "warning",
  947. message: "请选择要启用的课程",
  948. });
  949. } else {
  950. this.$confirm("是否启用这些课程?", "提示", {
  951. confirmButtonText: "确定",
  952. cancelButtonText: "取消",
  953. type: "warning",
  954. }).then(() => {
  955. var url = QUESTION_API + "/course/enable/" + this.courseIds;
  956. this.$httpWithMsg.put(url, {}).then(() => {
  957. this.$notify({
  958. type: "success",
  959. message: "启用成功!",
  960. });
  961. this.searchForm();
  962. });
  963. });
  964. }
  965. },
  966. enableById(row) {
  967. this.$confirm("是否启用该课程?", "提示", {
  968. confirmButtonText: "确定",
  969. cancelButtonText: "取消",
  970. type: "warning",
  971. }).then(() => {
  972. var url = QUESTION_API + "/course/enable/" + row.id;
  973. this.$httpWithMsg.put(url, {}).then(() => {
  974. this.$notify({
  975. type: "success",
  976. message: "启用成功!",
  977. });
  978. this.searchForm();
  979. });
  980. });
  981. },
  982. //禁用
  983. disableByIds() {
  984. if (this.selectedCourseIds.length === 0) {
  985. this.$notify({
  986. type: "warning",
  987. message: "请选择要禁用的课程",
  988. });
  989. } else {
  990. this.$confirm("是否禁用这些课程?", "提示", {
  991. confirmButtonText: "确定",
  992. cancelButtonText: "取消",
  993. type: "error",
  994. }).then(() => {
  995. var url = QUESTION_API + "/course/disable/" + this.courseIds;
  996. this.$httpWithMsg.put(url, {}).then(() => {
  997. this.$notify({
  998. type: "success",
  999. message: "禁用成功!",
  1000. });
  1001. this.searchForm();
  1002. });
  1003. });
  1004. }
  1005. },
  1006. //禁用
  1007. disableById(row) {
  1008. this.$confirm("是否禁用该课程?", "提示", {
  1009. confirmButtonText: "确定",
  1010. cancelButtonText: "取消",
  1011. type: "error",
  1012. }).then(() => {
  1013. var url = QUESTION_API + "/course/disable/" + row.id;
  1014. return this.$httpWithMsg.put(url, {}).then(() => {
  1015. this.$notify({
  1016. type: "success",
  1017. message: "禁用成功!",
  1018. });
  1019. return this.searchForm();
  1020. });
  1021. });
  1022. },
  1023. //导入
  1024. impCourse() {
  1025. this.impDialog = true;
  1026. this.initUpload();
  1027. },
  1028. initUpload() {
  1029. this.fileList = [];
  1030. },
  1031. beforeUpload(file) {
  1032. console.log(file);
  1033. },
  1034. uploadProgress() {
  1035. console.log("uploadProgress");
  1036. },
  1037. uploadSuccess(response) {
  1038. if (!response.hasError) {
  1039. this.$notify({
  1040. message: "上传成功",
  1041. type: "success",
  1042. });
  1043. this.fileLoading = false;
  1044. this.impDialog = false;
  1045. this.searchForm();
  1046. } else {
  1047. this.fileLoading = false;
  1048. this.impDialog = false;
  1049. this.errMessages = response.failRecords;
  1050. this.errDialog = true;
  1051. }
  1052. },
  1053. uploadError(response) {
  1054. var json = JSON.parse(response.message);
  1055. if (response.status == 500) {
  1056. this.$notify({
  1057. message: json.desc,
  1058. type: "error",
  1059. });
  1060. }
  1061. this.fileLoading = false;
  1062. },
  1063. //确定上传
  1064. submitUpload() {
  1065. if (!this.checkUpload()) {
  1066. return false;
  1067. }
  1068. this.$refs.upload.submit();
  1069. this.fileLoading = true;
  1070. },
  1071. checkUpload() {
  1072. var fileList = this.$refs.upload.uploadFiles;
  1073. if (fileList.length == 0) {
  1074. this.$notify({
  1075. message: "上传文件不能为空",
  1076. type: "error",
  1077. });
  1078. return false;
  1079. }
  1080. if (fileList.length > 1) {
  1081. this.$notify({
  1082. message: "每次只能上传一个文件",
  1083. type: "error",
  1084. });
  1085. return false;
  1086. }
  1087. for (let file of fileList) {
  1088. if (!file.name.endsWith(".xlsx")) {
  1089. this.$notify({
  1090. message: "上传文件必须为xlsx格式",
  1091. type: "error",
  1092. });
  1093. this.initUpload();
  1094. return false;
  1095. }
  1096. }
  1097. return true;
  1098. },
  1099. //清空文件
  1100. removeFile() {
  1101. // this.fileList = [];
  1102. this.$refs.upload.clearFiles();
  1103. },
  1104. //下载模板
  1105. exportFile() {
  1106. window.location.href =
  1107. QUESTION_API +
  1108. "/course/importTemplate?$key=" +
  1109. this.user.key +
  1110. "&$token=" +
  1111. this.user.token;
  1112. },
  1113. },
  1114. };
  1115. </script>