CourseStatistic.vue 9.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364
  1. <template>
  2. <section class="content" style="margin-top: -18px;">
  3. <div class="box box-info">
  4. <!-- 头信息 -->
  5. <div
  6. class="box-header with-border"
  7. style="background-color:#d3dce6;margin-bottom:20px;"
  8. >
  9. <h3 class="box-title">课程统计</h3>
  10. <div class="box-tools pull-right">
  11. <button type="button" class="btn btn-box-tool" data-widget="collapse">
  12. <i class="fa fa-minus"></i>
  13. </button>
  14. </div>
  15. </div>
  16. <!-- 正文信息 -->
  17. <div class="box-body">
  18. <el-form
  19. :model="formSearch"
  20. :inline="true"
  21. label-position="right"
  22. label-width="100px"
  23. >
  24. <el-form-item label="学校">
  25. <el-select
  26. v-model="formSearch.orgId"
  27. placeholder="请选择"
  28. filterable
  29. clearable
  30. @change="searchExamList(formSearch.orgId);"
  31. >
  32. <el-option
  33. v-for="item in orgList"
  34. :label="item.orgName"
  35. :value="item.orgId"
  36. :key="item.orgId"
  37. ></el-option>
  38. </el-select>
  39. </el-form-item>
  40. <el-form-item label="考试">
  41. <el-select v-model="formSearch.examId" placeholder="请选择">
  42. <el-option
  43. v-for="item in examList"
  44. :label="item.examName"
  45. :value="item.examId"
  46. :key="item.examId"
  47. ></el-option>
  48. </el-select>
  49. </el-form-item>
  50. <el-form-item label="试卷状态">
  51. <el-select
  52. v-model="formSearch.paperStatus"
  53. clearable
  54. placeholder="请选择"
  55. >
  56. <el-option label="请选择" value=""></el-option>
  57. <el-option
  58. v-for="item in coursePaperStatusList"
  59. :label="item.label"
  60. :value="item.value"
  61. :key="item.value"
  62. ></el-option>
  63. </el-select>
  64. </el-form-item>
  65. <el-form-item label="课程名称">
  66. <el-select
  67. v-model="formSearch.courseId"
  68. placeholder="请选择"
  69. filterable
  70. clearable
  71. remote
  72. :remote-method="searchCourseList"
  73. >
  74. <el-option label="请选择" value=""></el-option>
  75. <el-option
  76. v-for="item in courseList"
  77. :label="item.name"
  78. :value="item.id"
  79. :key="item.id"
  80. ></el-option>
  81. </el-select>
  82. </el-form-item>
  83. <el-form-item label="试卷名称">
  84. <el-input v-model="formSearch.paperName"></el-input>
  85. </el-form-item>
  86. <el-form-item class="pull-right">
  87. <el-button
  88. size="small"
  89. type="primary"
  90. icon="el-icon-search"
  91. @click="searchRecords"
  92. >查询
  93. </el-button>
  94. <el-button
  95. size="small"
  96. type="primary"
  97. icon="el-icon-menu"
  98. @click="openAllotPaperModel"
  99. >分配待指定试卷
  100. </el-button>
  101. <el-button
  102. size="small"
  103. type="primary"
  104. icon="el-icon-download"
  105. @click="openExportAllModel"
  106. >整体导出
  107. </el-button>
  108. <el-button
  109. size="small"
  110. type="primary"
  111. icon="el-icon-download"
  112. @click="openExportBatchModel"
  113. >批量导出
  114. </el-button>
  115. <el-button
  116. size="small"
  117. type="primary"
  118. icon="el-icon-refresh"
  119. @click="refreshStatistic"
  120. >刷新
  121. </el-button>
  122. </el-form-item>
  123. </el-form>
  124. <!-- 数据列表 -->
  125. <el-table
  126. v-loading="loading"
  127. :data="tableData"
  128. element-loading-text="数据加载中"
  129. style="width:100%;"
  130. border
  131. >
  132. <el-table-column type="selection" width="55"> </el-table-column>
  133. <el-table-column label="课程名称" prop="courseName" />
  134. <el-table-column width="150" label="课程代码" prop="courseCode" />
  135. <el-table-column width="80" label="试卷类型" prop="paperType" />
  136. <el-table-column width="80" label="试卷状态">
  137. <template slot-scope="scope">
  138. {{ scope.row.paperStatusName }}
  139. </template>
  140. </el-table-column>
  141. <el-table-column width="200" label="试卷名称" prop="paperName" />
  142. <el-table-column width="80" label="试卷P数" prop="paperP" />
  143. <el-table-column width="100" label="考生人数" prop="totalStudent" />
  144. <el-table-column width="180" label="操作" :context="_self">
  145. <template slot-scope="scope">
  146. <el-button
  147. size="mini"
  148. type="primary"
  149. icon="el-icon-view"
  150. v-show="scope.row.paperStatus == '2'"
  151. @click="preview(scope.row);"
  152. >预览
  153. </el-button>
  154. <el-button
  155. size="mini"
  156. type="primary"
  157. icon="el-icon-download"
  158. v-show="scope.row.paperStatus == '2'"
  159. @click="download(scope.row);"
  160. >下载
  161. </el-button>
  162. </template>
  163. </el-table-column>
  164. </el-table>
  165. <!-- 分页 -->
  166. <div class="page pull-right">
  167. <el-pagination
  168. @current-change="handlePager"
  169. :current-page="formSearch.pageNo"
  170. :page-size="formSearch.pageSize"
  171. :total="totalElements"
  172. layout="total, prev, pager, next, jumper"
  173. ></el-pagination>
  174. </div>
  175. </div>
  176. </div>
  177. </section>
  178. </template>
  179. <script>
  180. import {
  181. print_api,
  182. core_api,
  183. userRole,
  184. coursePaperStatusList
  185. } from "../constants/constants.js";
  186. import { mapState } from "vuex";
  187. export default {
  188. data() {
  189. return {
  190. formSearch: {
  191. orgId: "",
  192. examId: "",
  193. courseId: "",
  194. paperStatus: "",
  195. paperName: "",
  196. pageNo: 1,
  197. pageSize: 10
  198. },
  199. curUserRole: userRole,
  200. hasPermit: false,
  201. totalElements: 0,
  202. loading: false,
  203. tableData: [],
  204. orgList: [],
  205. examList: [],
  206. courseList: [],
  207. coursePaperStatusList: coursePaperStatusList,
  208. rules: {}
  209. };
  210. },
  211. methods: {
  212. handlePager(current) {
  213. /* 处理分页 */
  214. this.formSearch.pageNo = current;
  215. this.searchRecords();
  216. },
  217. searchRecords() {
  218. /* 查询记录列表 */
  219. let orgId = this.formSearch.orgId;
  220. if (this.isEmptyNumber(orgId)) {
  221. this.$notify({
  222. message: "请选择学校!",
  223. type: "warning"
  224. });
  225. return;
  226. }
  227. let examId = this.formSearch.examId;
  228. if (this.isEmptyNumber(examId)) {
  229. this.$notify({
  230. message: "请选择考试!",
  231. type: "warning"
  232. });
  233. return;
  234. }
  235. this.loading = true;
  236. let url = print_api + "/course/statistic/list";
  237. this.$http.post(url, this.formSearch).then(
  238. response => {
  239. this.tableData = response.data.content;
  240. this.totalElements = response.data.totalElements;
  241. this.loading = false;
  242. },
  243. error => {
  244. console.log(error);
  245. this.loading = false;
  246. }
  247. );
  248. },
  249. searchExamList(orgId) {
  250. /* 查询考试列表 */
  251. this.formSearch.examId = "";
  252. this.examList = [];
  253. if (!this.isEmptyNumber(orgId)) {
  254. let url = print_api + "/printing/project/exam/list?orgId=" + orgId;
  255. this.$http.post(url).then(response => {
  256. this.examList = response.data;
  257. });
  258. }
  259. },
  260. searchCourseList(query) {
  261. /* 查询课程列表 */
  262. this.courseList = [];
  263. let url = core_api + "/course/query?enable=true";
  264. if (!this.isEmptyStr(query)) {
  265. url += "&name=" + query;
  266. }
  267. this.$http.get(url).then(response => {
  268. this.courseList = response.data;
  269. });
  270. },
  271. refreshStatistic() {
  272. /* 刷新当前统计信息 */
  273. this.$notify({
  274. message: "Todo...",
  275. type: "warning"
  276. });
  277. },
  278. openAllotPaperModel() {
  279. /* 分配待指定试卷 */
  280. this.$notify({
  281. message: "Todo...",
  282. type: "warning"
  283. });
  284. },
  285. openExportBatchModel() {
  286. /* 批量导出 */
  287. this.$notify({
  288. message: "Todo...",
  289. type: "warning"
  290. });
  291. },
  292. openExportAllModel() {
  293. /* 整体导出 */
  294. this.$notify({
  295. message: "Todo...",
  296. type: "warning"
  297. });
  298. },
  299. preview(row) {
  300. /* 预览试卷PDF */
  301. console.log(row);
  302. this.$notify({
  303. message: "Todo...",
  304. type: "warning"
  305. });
  306. },
  307. download(row) {
  308. /* 下载试卷结构 */
  309. console.log(row);
  310. this.$notify({
  311. message: "Todo...",
  312. type: "warning"
  313. });
  314. }
  315. },
  316. computed: {
  317. ...mapState({ user: state => state.user })
  318. },
  319. created() {
  320. this.loadOrgList();
  321. this.loadUserRole(this.user);
  322. if (this.curUserRole.isSuperLeader || this.curUserRole.isPM) {
  323. this.hasPermit = true;
  324. } else {
  325. this.hasPermit = false;
  326. }
  327. }
  328. };
  329. </script>
  330. <style scoped>
  331. .page {
  332. margin-top: 10px;
  333. }
  334. .pull-right {
  335. float: right;
  336. }
  337. .pull-left {
  338. float: left;
  339. }
  340. </style>