public.vue 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914
  1. <template>
  2. <div class="app-container">
  3. <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="100px">
  4. <el-form-item label="课堂分类" prop="cateId">
  5. <el-select v-model="queryParams.cateId" placeholder="请选择" clearable size="small"
  6. @change="getQuerySubCateList(queryParams.cateId)">
  7. <el-option
  8. v-for="dict in categoryOptions"
  9. :key="dict.dictValue"
  10. :label="dict.dictLabel"
  11. :value="dict.dictValue"
  12. />
  13. </el-select>
  14. </el-form-item>
  15. <el-form-item label="课堂子分类" prop="subCateId">
  16. <el-select v-model="queryParams.subCateId" placeholder="请选择" clearable size="small">
  17. <el-option
  18. v-for="dict in querySubCateOptions"
  19. :key="dict.dictValue"
  20. :label="dict.dictLabel"
  21. :value="dict.dictValue"
  22. />
  23. </el-select>
  24. </el-form-item>
  25. <el-form-item label="课堂名称" prop="courseName">
  26. <el-input
  27. v-model="queryParams.courseName"
  28. placeholder="请输入课堂名称"
  29. clearable
  30. size="small"
  31. @keyup.enter.native="handleQuery"
  32. />
  33. </el-form-item>
  34. <el-form-item label="课堂类型" prop="isPrivate" style="display: none">
  35. <el-select v-model="queryParams.isPrivate" placeholder="请选择" clearable size="small">
  36. <el-option
  37. v-for="dict in courseTypeOptions"
  38. :key="dict.dictValue"
  39. :label="dict.dictLabel"
  40. :value="dict.dictValue"
  41. />
  42. </el-select>
  43. </el-form-item>
  44. <el-form-item>
  45. <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
  46. <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
  47. </el-form-item>
  48. </el-form>
  49. <el-row :gutter="10" class="mb8">
  50. <el-col :span="1.5">
  51. <el-button
  52. type="primary"
  53. plain
  54. icon="el-icon-plus"
  55. size="mini"
  56. @click="handleAdd"
  57. v-hasPermi="['course:userCourse:publicAdd']"
  58. >新增
  59. </el-button>
  60. </el-col>
  61. <el-col :span="1.5">
  62. <el-button
  63. type="success"
  64. plain
  65. icon="el-icon-edit"
  66. size="mini"
  67. :disabled="single"
  68. @click="handleUpdate"
  69. v-hasPermi="['course:userCourse:publicEdit']"
  70. >修改
  71. </el-button>
  72. </el-col>
  73. <el-col :span="1.5">
  74. <el-button
  75. type="danger"
  76. plain
  77. icon="el-icon-delete"
  78. size="mini"
  79. :disabled="multiple"
  80. @click="handleDelete"
  81. v-hasPermi="['course:userCourse:publicRemove']"
  82. >删除
  83. </el-button>
  84. </el-col>
  85. <el-col :span="1.5">
  86. <el-button
  87. type="warning"
  88. plain
  89. icon="el-icon-download"
  90. size="mini"
  91. :loading="exportLoading"
  92. @click="handleExport"
  93. v-hasPermi="['course:userCourse:publicExport']"
  94. >导出
  95. </el-button>
  96. </el-col>
  97. <el-col :span="1.5">
  98. <el-button
  99. v-if="queryParams.isShow==0"
  100. type="success"
  101. plain
  102. icon="el-icon-edit"
  103. size="mini"
  104. :disabled="multiple"
  105. @click="putOn"
  106. v-hasPermi="['course:userCourse:publicPutOn']"
  107. >上架
  108. </el-button>
  109. </el-col>
  110. <el-col :span="1.5">
  111. <el-button
  112. v-if="queryParams.isShow==1"
  113. type="success"
  114. plain
  115. icon="el-icon-edit"
  116. size="mini"
  117. :disabled="multiple"
  118. @click="pullOff"
  119. v-hasPermi="['course:userCourse:publicPutOff']"
  120. >下架
  121. </el-button>
  122. </el-col>
  123. <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
  124. </el-row>
  125. <el-tabs type="card" v-model="queryParams.isShow" @tab-click="handleClick">
  126. <el-tab-pane label="已上架" name="1"></el-tab-pane>
  127. <el-tab-pane label="待上架" name="0"></el-tab-pane>
  128. </el-tabs>
  129. <el-table height="600" border v-loading="loading" :data="userCourseList" @selection-change="handleSelectionChange">
  130. <el-table-column type="selection" width="55" align="center"/>
  131. <el-table-column label="课程ID" align="center" prop="courseId" width="60"/>
  132. <el-table-column label="所属项目" align="center" prop="projectName" width="120"/>
  133. <el-table-column label="封面图片" align="center" prop="imgUrl" width="170">
  134. <template slot-scope="scope">
  135. <el-popover
  136. placement="right"
  137. title=""
  138. trigger="hover"
  139. >
  140. <img slot="reference" :src="scope.row.imgUrl" width="100">
  141. <img :src="scope.row.imgUrl" style="max-width: 300px;">
  142. </el-popover>
  143. </template>
  144. </el-table-column>
  145. <el-table-column label="小封面" align="center" prop="secondImg" width="100">
  146. <template slot-scope="scope">
  147. <el-popover
  148. placement="right"
  149. title=""
  150. trigger="hover"
  151. >
  152. <img slot="reference" :src="scope.row.secondImg" width="50">
  153. <img :src="scope.row.secondImg" style="max-width: 100px;">
  154. </el-popover>
  155. </template>
  156. </el-table-column>
  157. <el-table-column label="课堂名称" align="center" show-overflow-tooltip prop="courseName" min-width="90"/>
  158. <el-table-column label="排序" align="center" prop="sort" width="70"/>
  159. <el-table-column label="分类名称" align="center" prop="cateName" width="115"/>
  160. <el-table-column label="子分类名称" align="center" prop="subCateName" width="115"/>
  161. <el-table-column label="原价" align="center" prop="price" width="115"/>
  162. <el-table-column label="售价" align="center" prop="sellPrice" width="115"/>
  163. <el-table-column label="单节积分" align="center" prop="integral" width="115"/>
  164. <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
  165. <template slot-scope="scope">
  166. <el-button
  167. size="mini"
  168. type="text"
  169. @click="handleCatalog(scope.row)"
  170. v-hasPermi="['course:userCourse:publicCateManage']"
  171. >目录管理
  172. </el-button>
  173. <el-button
  174. size="mini"
  175. type="text"
  176. :icon="scope.row.isShow === 1 ? 'el-icon-close' : 'el-icon-open'"
  177. @click="handleShow(scope.row)"
  178. v-hasPermi="['course:userCourse:publicUpdateIsShow']"
  179. >
  180. {{ scope.row.isShow === 1 ? '下架' : '上架' }}
  181. </el-button>
  182. <el-button
  183. size="mini"
  184. type="text"
  185. icon="el-icon-edit"
  186. @click="handleUpdate(scope.row)"
  187. v-hasPermi="['course:userCourse:publicEdit']"
  188. >修改
  189. </el-button>
  190. <el-button
  191. size="mini"
  192. type="text"
  193. icon="el-icon-delete"
  194. @click="handleDelete(scope.row)"
  195. v-hasPermi="['course:userCourse:publicRemove']"
  196. >删除
  197. </el-button>
  198. </template>
  199. </el-table-column>
  200. </el-table>
  201. <pagination
  202. v-show="total>0"
  203. :total="total"
  204. :page.sync="queryParams.pageNum"
  205. :limit.sync="queryParams.pageSize"
  206. @pagination="getList"
  207. />
  208. <!-- 添加或修改课程对话框 -->
  209. <el-dialog :title="title" :visible.sync="open" width="1200px" append-to-body>
  210. <el-form ref="form" :model="form" :rules="rules" label-width="110px">
  211. <el-row>
  212. <el-form-item label="所属项目" prop="project">
  213. <el-select v-model="form.project" placeholder="请选择项目" filterable clearable size="small">
  214. <el-option
  215. v-for="dict in projectOptions"
  216. :key="dict.dictValue"
  217. :label="dict.dictLabel"
  218. :value="dict.dictValue"
  219. />
  220. </el-select>
  221. </el-form-item>
  222. </el-row>
  223. <el-row>
  224. <el-col :span="8">
  225. <el-form-item label="课堂名称" prop="courseName">
  226. <el-input v-model="form.courseName" placeholder="请输入课堂名称"/>
  227. </el-form-item>
  228. </el-col>
  229. <el-col :span="8">
  230. <el-form-item label="课堂分类" prop="cateId">
  231. <el-select v-model="form.cateId" placeholder="请选择" clearable size="small"
  232. @change="getSubCateList(form.cateId)">
  233. <el-option
  234. v-for="dict in categoryOptions"
  235. :key="dict.dictValue"
  236. :label="dict.dictLabel"
  237. :value="dict.dictValue"
  238. />
  239. </el-select>
  240. </el-form-item>
  241. </el-col>
  242. <el-col :span="8">
  243. <el-form-item label="课堂子分类" prop="subCateId">
  244. <el-select v-model="form.subCateId" placeholder="请选择" clearable size="small">
  245. <el-option
  246. v-for="dict in subCategoryOptions"
  247. :key="dict.dictValue"
  248. :label="dict.dictLabel"
  249. :value="dict.dictValue"
  250. />
  251. </el-select>
  252. </el-form-item>
  253. </el-col>
  254. </el-row>
  255. <el-row>
  256. <!-- <el-col :span="8">
  257. <el-form-item label="课堂类型" prop="courseType">
  258. <el-select v-model="form.courseType" placeholder="请选择" clearable size="small">
  259. <el-option
  260. v-for="dict in courseTypeOptions"
  261. :key="dict.dictValue"
  262. :label="dict.dictLabel"
  263. :value="dict.dictValue"
  264. />
  265. </el-select>
  266. </el-form-item>
  267. </el-col> -->
  268. <el-col :span="8">
  269. <el-form-item label="关联达人">
  270. <el-select v-model="form.talentId" remote filterable clearable reserve-keyword
  271. placeholder="输入手机号搜索" :remote-method="talentMethod">
  272. <el-option
  273. v-for="item in talentList"
  274. :key="item.talentId"
  275. :label="item.nickName +'#'+item.phone"
  276. :value="item.talentId">
  277. <span style="float: left">{{ item.talentId }}</span>
  278. <span style="margin-left: 30px ;">{{ item.nickName }}</span>
  279. <span style="margin-left: 30px">{{ item.phone }}</span>
  280. </el-option>
  281. </el-select>
  282. </el-form-item>
  283. </el-col>
  284. </el-row>
  285. <el-row>
  286. <el-col :span="24">
  287. <el-form-item label="课堂简介" prop="description">
  288. <el-input v-model="form.description" type="textarea" :rows="2" placeholder="请输入课堂简介"/>
  289. </el-form-item>
  290. </el-col>
  291. </el-row>
  292. <el-form-item label="课程封面" prop="imgUrl">
  293. <ImageUpload v-model="form.imgUrl" type="image" :num="10" :width="150" :height="150"/>
  294. </el-form-item>
  295. <el-form-item label="小封面" prop="imgUrl">
  296. <ImageUpload v-model="form.secondImg" type="image" :num="10" :width="150" :height="150"/>
  297. </el-form-item>
  298. <el-row>
  299. <el-col :span="12">
  300. <el-form-item label="标签" prop="tags">
  301. <el-select v-model="tags" multiple placeholder="请选择标签" filterable clearable size="small">
  302. <el-option
  303. v-for="dict in tagsOptions"
  304. :key="dict.dictValue"
  305. :label="dict.dictLabel"
  306. :value="dict.dictValue"
  307. />
  308. </el-select>
  309. </el-form-item>
  310. </el-col>
  311. </el-row>
  312. <el-row>
  313. <el-col :span="8">
  314. <el-form-item label="排序" prop="sort">
  315. <el-input-number v-model="form.sort" :min="0" label="排序"></el-input-number>
  316. </el-form-item>
  317. </el-col>
  318. <el-col :span="8">
  319. <el-form-item label="播放量" prop="views">
  320. <el-input-number v-model="form.views" :min="0" label="浏览量"></el-input-number>
  321. </el-form-item>
  322. </el-col>
  323. <el-col :span="8">
  324. <el-form-item label="点赞量" prop="likes">
  325. <el-input-number v-model="form.likes" :min="0" label="点赞量"></el-input-number>
  326. </el-form-item>
  327. </el-col>
  328. </el-row>
  329. <el-row>
  330. <el-col :span="8">
  331. <el-form-item label="收藏数" prop="favoriteNum">
  332. <el-input-number v-model="form.favoriteNum" :min="0" label="收藏数"></el-input-number>
  333. </el-form-item>
  334. </el-col>
  335. <el-col :span="8">
  336. <el-form-item label="分享数" prop="shares">
  337. <el-input-number v-model="form.shares" :min="0" label="分享数"></el-input-number>
  338. </el-form-item>
  339. </el-col>
  340. <el-col :span="8">
  341. <el-form-item label="热度值" prop="hotNum">
  342. <el-input-number v-model="form.hotNum" :min="0" label="热度值"></el-input-number>
  343. </el-form-item>
  344. </el-col>
  345. </el-row>
  346. <el-row>
  347. <el-col :span="8">
  348. <el-form-item label="状态" prop="isShow">
  349. <el-radio-group v-model="form.isShow">
  350. <el-radio :label="item.dictValue" v-for="item in specShowOptions">{{ item.dictLabel }}</el-radio>
  351. </el-radio-group>
  352. </el-form-item>
  353. </el-col>
  354. <el-col :span="8">
  355. <el-form-item label="是否推荐" prop="isTui">
  356. <el-radio-group v-model="form.isTui">
  357. <el-radio :label="item.dictValue" v-for="item in orOptions">{{ item.dictLabel }}</el-radio>
  358. </el-radio-group>
  359. </el-form-item>
  360. </el-col>
  361. <el-col :span="8">
  362. <el-form-item label="是否精选" prop="isBest">
  363. <el-radio-group v-model="form.isBest">
  364. <el-radio :label="item.dictValue" v-for="item in orOptions">{{ item.dictLabel }}</el-radio>
  365. </el-radio-group>
  366. </el-form-item>
  367. </el-col>
  368. </el-row>
  369. <el-row>
  370. <el-col :span="8">
  371. <el-form-item label="是否自动播放" prop="isAutoPlay">
  372. <el-radio-group v-model="form.isAutoPlay">
  373. <el-radio :label="item.dictValue" v-for="item in orOptions">{{ item.dictLabel }}</el-radio>
  374. </el-radio-group>
  375. </el-form-item>
  376. </el-col>
  377. <el-col :span="8">
  378. <el-form-item label="是否允许快进" prop="isFast">
  379. <el-radio-group v-model="form.isFast">
  380. <el-radio :label="item.dictValue" v-for="item in orOptions">{{ item.dictLabel }}</el-radio>
  381. </el-radio-group>
  382. </el-form-item>
  383. </el-col>
  384. <el-col :span="8">
  385. <el-form-item label="是否积分兑换" prop="isIntegral">
  386. <el-radio-group v-model="form.isIntegral">
  387. <el-radio :label="item.dictValue" v-for="item in orOptions">{{ item.dictLabel }}</el-radio>
  388. </el-radio-group>
  389. </el-form-item>
  390. </el-col>
  391. </el-row>
  392. <el-row>
  393. <el-col :span="8">
  394. <el-form-item label="是否逐级播放" prop="isNext">
  395. <el-radio-group v-model="form.isNext">
  396. <el-radio :label="item.dictValue" v-for="item in orOptions">{{ item.dictLabel }}</el-radio>
  397. </el-radio-group>
  398. </el-form-item>
  399. </el-col>
  400. <el-col :span="8" style="display: none">
  401. <el-form-item label="是否私域" prop="isPrivate">
  402. <el-radio-group v-model="form.isPrivate">
  403. <el-radio :label="item.dictValue" v-for="item in orOptions">{{ item.dictLabel }}</el-radio>
  404. </el-radio-group>
  405. </el-form-item>
  406. </el-col>
  407. </el-row>
  408. <el-row>
  409. <el-col :span="8">
  410. <el-form-item label="课程原价" prop="price">
  411. <el-input v-model="form.price" placeholder="请输入课程原价"/>
  412. </el-form-item>
  413. </el-col>
  414. <el-col :span="8">
  415. <el-form-item label="课程售价" prop="sellPrice">
  416. <el-input v-model="form.sellPrice" placeholder="请输入课程售价"/>
  417. </el-form-item>
  418. </el-col>
  419. <el-col :span="8">
  420. <el-form-item label="单节所需积分" prop="integral" v-if="form.isIntegral==1">
  421. <el-input v-model="form.integral" placeholder="请输入单节所需积分"/>
  422. </el-form-item>
  423. </el-col>
  424. </el-row>
  425. </el-form>
  426. <div slot="footer" class="dialog-footer">
  427. <el-button type="primary" @click="submitForm">确 定</el-button>
  428. <el-button @click="cancel">取 消</el-button>
  429. </div>
  430. </el-dialog>
  431. <el-drawer
  432. :with-header="false"
  433. size="75%"
  434. :title="show.title" :visible.sync="show.open" append-to-body>
  435. <userCourseCatalogDetails ref="userCourseCatalogDetails"/>
  436. </el-drawer>
  437. </div>
  438. </template>
  439. <script>
  440. import {
  441. listUserCourse,
  442. getUserCourse,
  443. delUserCourse,
  444. addUserCourse,
  445. updateUserCourse,
  446. exportUserCourse,
  447. updateIsShow,
  448. putOn,
  449. pullOff
  450. } from "@/api/course/userCoursePublic";
  451. import {getSelectableRange} from "@/api/qw/sopTemp";
  452. import Treeselect from "@riophae/vue-treeselect";
  453. import "@riophae/vue-treeselect/dist/vue-treeselect.css";
  454. import Editor from '@/components/Editor/wang';
  455. import ImageUpload from '@/components/ImageUpload/index';
  456. import {listBySearch} from "@/api/course/userTalent";
  457. import userCourseCatalogDetails from '../../components/course/userCourseCatalogDetails.vue';
  458. import {getAllCourseCategoryList, getCatePidList, getCateListByPid} from "@/api/course/userCourseCategory";
  459. import {allList} from "@/api/company/company";
  460. export default {
  461. name: "UserCoursePublic",
  462. components: {
  463. Treeselect,
  464. Editor, ImageUpload, userCourseCatalogDetails
  465. },
  466. data() {
  467. return {
  468. isRequireTalentId:process.env.VUE_APP_TITLE_INDEX !== '存在文化互联网医院',
  469. talentParam: {
  470. phone: null,
  471. talentId: null
  472. },
  473. talentList: [],
  474. startTimeRange: [],
  475. show: {
  476. title: "目录管理",
  477. open: false
  478. },
  479. activeName: "1",
  480. projectOptions: [],
  481. tagsOptions: [],
  482. tags: [],
  483. companyIds: [],
  484. courseTypeOptions: [],
  485. orOptions: [],
  486. specShowOptions: [],
  487. specTypeOptions: [],
  488. categoryOptions: [],
  489. subCategoryOptions: [],
  490. querySubCateOptions: [],
  491. // 遮罩层
  492. loading: true,
  493. // 导出遮罩层
  494. exportLoading: false,
  495. // 选中数组
  496. ids: [],
  497. // 非单个禁用
  498. single: true,
  499. // 非多个禁用
  500. multiple: true,
  501. // 显示搜索条件
  502. showSearch: true,
  503. // 总条数
  504. total: 0,
  505. // 课程表格数据
  506. userCourseList: [],
  507. companyOptions: [],
  508. // 弹出层标题
  509. title: "",
  510. // 是否显示弹出层
  511. open: false,
  512. // 查询参数
  513. queryParams: {
  514. pageNum: 1,
  515. pageSize: 10,
  516. cateId: null,
  517. subCateId: null,
  518. title: null,
  519. imgUrl: null,
  520. userId: null,
  521. sort: null,
  522. status: null,
  523. isVip: null,
  524. isHot: null,
  525. isShow: "1",
  526. views: null,
  527. duration: null,
  528. description: null,
  529. hotRanking: null,
  530. integral: null,
  531. price: null,
  532. isPrivate: 0
  533. },
  534. // 表单参数
  535. form: {},
  536. // 表单校验
  537. rules: {
  538. courseName: [
  539. {required: true, message: "课堂名称不能为空", trigger: "blur"}
  540. ],
  541. imgUrl: [
  542. {required: true, message: "封面图片不能为空", trigger: "blur"}
  543. ],
  544. /* talentId: [
  545. {required: this.isRequireTalentId, message: "关联达人不能为空", trigger: "blur"}
  546. ], */
  547. isTui: [
  548. {required: true, message: "是否推荐不能为空", trigger: "blur"}
  549. ],
  550. isBest: [
  551. {required: true, message: "是否精选不能为空", trigger: "blur"}
  552. ],
  553. isFast: [
  554. {required: true, message: "是否允许快进不能为空", trigger: "blur"}
  555. ],
  556. isAutoPlay: [
  557. {required: true, message: "是否自动播放不能为空", trigger: "blur"}
  558. ],
  559. sort: [
  560. {required: true, message: "排序不能为空", trigger: "blur"}
  561. ],
  562. views: [
  563. {required: true, message: "播放量不能为空", trigger: "blur"}
  564. ],
  565. likes: [
  566. {required: true, message: "点赞数不能为空", trigger: "blur"}
  567. ],
  568. favoriteNum: [
  569. {required: true, message: "收藏数不能为空", trigger: "blur"}
  570. ],
  571. shares: [
  572. {required: true, message: "分享数不能为空", trigger: "blur"}
  573. ],
  574. isIntegral: [
  575. {required: true, message: "是否允许积分兑换不能为空", trigger: "blur"}
  576. ],
  577. isShow: [
  578. {required: true, message: "上架状态不能为空", trigger: "blur"}
  579. ],
  580. isPrivate: [
  581. {required: true, message: "公私域不能为空", trigger: "blur"}
  582. ],
  583. integral: [
  584. {required: true, message: "小节兑换积分不能为空", trigger: "blur"}
  585. ],
  586. }
  587. };
  588. },
  589. created() {
  590. this.getList();
  591. getCatePidList().then(response => {
  592. this.categoryOptions = response.data;
  593. });
  594. getSelectableRange().then(e => {
  595. this.startTimeRange = e.data;
  596. })
  597. // this.getTreeselect();
  598. this.getDicts("sys_spec_show").then(response => {
  599. this.specShowOptions = response.data;
  600. });
  601. this.getDicts("sys_spec_type").then(response => {
  602. this.specTypeOptions = response.data;
  603. });
  604. this.getDicts("sys_course_type").then(response => {
  605. this.courseTypeOptions = response.data;
  606. });
  607. this.getDicts("sys_course_project").then(response => {
  608. this.projectOptions = response.data;
  609. });
  610. this.getDicts("sys_course_tags").then(response => {
  611. this.tagsOptions = response.data;
  612. });
  613. this.getDicts("sys_company_or").then(response => {
  614. this.orOptions = response.data;
  615. });
  616. allList().then(response => {
  617. this.companyOptions = response.rows;
  618. });
  619. },
  620. methods: {
  621. selectTalent() {
  622. },
  623. talentMethod(query) {
  624. if (query !== '') {
  625. this.talentParam.phone = query;
  626. listBySearch(this.talentParam).then(response => {
  627. this.talentList = response.data;
  628. });
  629. }
  630. },
  631. getSubCateList(pid) {
  632. this.form.subCateId = null;
  633. if (pid == '') {
  634. this.subCategoryOptions = [];
  635. return
  636. }
  637. getCateListByPid(pid).then(response => {
  638. this.subCategoryOptions = response.data;
  639. });
  640. },
  641. getQuerySubCateList(pid) {
  642. this.queryParams.subCateId = null;
  643. if (pid == '') {
  644. this.querySubCateOptions = [];
  645. return
  646. }
  647. this.queryParams.subCateId = null;
  648. getCateListByPid(pid).then(response => {
  649. this.querySubCateOptions = response.data;
  650. });
  651. },
  652. handleShow(row) {
  653. var isShowValue = row.isShow === 0 ? 1 : 0;
  654. var course = {courseId: row.courseId, isShow: isShowValue, isPrivate: row.isPrivate};
  655. updateIsShow(course).then(response => {
  656. var isShowText = isShowValue === 1 ? "上架成功" : "下架成功";
  657. this.msgSuccess(isShowText);
  658. this.getList();
  659. });
  660. },
  661. handleCatalog(row) {
  662. const courseId = row.courseId;
  663. this.show.open = true;
  664. setTimeout(() => {
  665. this.$refs.userCourseCatalogDetails.getDetails(courseId, row.courseName, row.isPrivate);
  666. }, 200);
  667. },
  668. handleClick(tab, event) {
  669. this.queryParams.isShow = tab.name;
  670. this.getList();
  671. },
  672. /** 转换课堂分类数据结构 */
  673. normalizer(node) {
  674. if (node.children && !node.children.length) {
  675. delete node.children;
  676. }
  677. return {
  678. id: node.cateId,
  679. label: node.cateName,
  680. children: node.children
  681. };
  682. },
  683. getTreeselect() {
  684. getAllCourseCategoryList().then(response => {
  685. this.categoryOptions = [];
  686. const data = this.handleTree(response.data, "cateId", "pid");
  687. this.categoryOptions = data;
  688. });
  689. },
  690. /** 查询课程列表 */
  691. getList() {
  692. this.loading = true;
  693. listUserCourse(this.queryParams).then(response => {
  694. this.userCourseList = response.rows;
  695. this.total = response.total;
  696. this.loading = false;
  697. });
  698. },
  699. // 取消按钮
  700. cancel() {
  701. this.open = false;
  702. this.reset();
  703. },
  704. // 表单重置
  705. reset() {
  706. this.form = {
  707. courseId: null,
  708. cateId: null,
  709. subCateId: null,
  710. title: null,
  711. imgUrl: null,
  712. secondImg: null,
  713. userId: null,
  714. sort: null,
  715. createTime: null,
  716. updateTime: null,
  717. status: 0,
  718. isVip: null,
  719. isAutoPlay: "1",
  720. isIntegral: "0",
  721. isShow: "1",
  722. isFast: "1",
  723. isTui: "1",
  724. isBest: "1",
  725. isNext: "1",
  726. isPrivate: "0",
  727. views: 100000,
  728. duration: null,
  729. description: null,
  730. hotRanking: null,
  731. integral: null,
  732. price: null,
  733. likes: 100000,
  734. shares: 100000,
  735. favoriteNum: 100000,
  736. hotNum: 100000,
  737. };
  738. this.tags = [];
  739. this.subCategoryOptions = []
  740. this.resetForm("form");
  741. },
  742. /** 搜索按钮操作 */
  743. handleQuery() {
  744. this.queryParams.pageNum = 1;
  745. this.getList();
  746. },
  747. /** 重置按钮操作 */
  748. resetQuery() {
  749. this.resetForm("queryForm");
  750. this.queryParams.isShow = this.activeName
  751. this.handleQuery();
  752. },
  753. // 多选框选中数据
  754. handleSelectionChange(selection) {
  755. this.ids = selection.map(item => item.courseId)
  756. this.single = selection.length !== 1
  757. this.multiple = !selection.length
  758. },
  759. /** 新增按钮操作 */
  760. handleAdd() {
  761. this.reset();
  762. this.talentList = [];
  763. this.open = true;
  764. this.title = "添加课程";
  765. },
  766. /** 修改按钮操作 */
  767. handleUpdate(row) {
  768. this.reset();
  769. this.talentList = [];
  770. const courseId = row.courseId || this.ids
  771. getUserCourse(courseId).then(response => {
  772. this.form = response.data;
  773. // this.form.cateId = response.data.cateId.toString();
  774. getCateListByPid(this.form.cateId).then(response => {
  775. this.subCategoryOptions = response.data;
  776. });
  777. // this.form.courseType = response.data.courseType.toString();
  778. if (response.data.project != null) {
  779. this.form.project = response.data.project.toString();
  780. }
  781. if (response.data.tags != null) {
  782. this.tags = response.data.tags.split(",")
  783. }
  784. this.form.isAutoPlay = response.data.isAutoPlay.toString();
  785. this.form.isShow = response.data.isShow.toString();
  786. this.form.isBest = response.data.isBest.toString();
  787. this.form.isFast = response.data.isFast.toString();
  788. this.form.isIntegral = response.data.isIntegral.toString();
  789. this.form.isTui = response.data.isTui.toString();
  790. this.form.isNext = response.data.isNext.toString();
  791. this.form.isPrivate = response.data.isPrivate.toString();
  792. this.talentParam.talentId = response.data.talentId;
  793. if (this.form.companyIds != null) {
  794. this.companyIds = ((this.form.companyIds).split(",").map(Number))
  795. } else {
  796. this.companyIds = []
  797. }
  798. listBySearch(this.talentParam).then(response => {
  799. this.talentList = response.data;
  800. });
  801. this.open = true;
  802. this.title = "修改课程";
  803. });
  804. },
  805. /** 提交按钮 */
  806. submitForm() {
  807. this.$refs["form"].validate(valid => {
  808. /* if(this.isRequireTalentId && !this.talentParam.talentId){
  809. this.msgError("请关联达人");
  810. return;
  811. } */
  812. if (valid) {
  813. if (this.tags.length > 0) {
  814. this.form.tags = this.tags.toString();
  815. } else {
  816. this.form.tags = null
  817. }
  818. this.form.isPrivate = 0
  819. if (this.form.courseId != null) {
  820. updateUserCourse(this.form).then(response => {
  821. this.msgSuccess("修改成功");
  822. this.open = false;
  823. this.getList();
  824. });
  825. } else {
  826. addUserCourse(this.form).then(response => {
  827. this.msgSuccess("新增成功");
  828. this.open = false;
  829. this.getList();
  830. });
  831. }
  832. }
  833. });
  834. },
  835. /** 删除按钮操作 */
  836. handleDelete(row) {
  837. const courseIds = row.courseId || this.ids;
  838. this.$confirm('是否确认删除课程编号为"' + courseIds + '"的数据项?', "警告", {
  839. confirmButtonText: "确定",
  840. cancelButtonText: "取消",
  841. type: "warning"
  842. }).then(function () {
  843. return delUserCourse(courseIds);
  844. }).then(() => {
  845. this.getList();
  846. this.msgSuccess("删除成功");
  847. }).catch(() => {
  848. });
  849. },
  850. /** 导出按钮操作 */
  851. handleExport() {
  852. const queryParams = this.queryParams;
  853. this.$confirm('是否确认导出所有课程数据项?', "警告", {
  854. confirmButtonText: "确定",
  855. cancelButtonText: "取消",
  856. type: "warning"
  857. }).then(() => {
  858. this.exportLoading = true;
  859. return exportUserCourse(queryParams);
  860. }).then(response => {
  861. this.download(response.msg);
  862. this.exportLoading = false;
  863. }).catch(() => {
  864. });
  865. },
  866. putOn() {
  867. const courseIds = this.ids;
  868. if (courseIds == null || courseIds == "") {
  869. return this.$message("未选择课程");
  870. }
  871. this.$confirm('是否确认批量上架课程?', "警告", {
  872. confirmButtonText: "确定",
  873. cancelButtonText: "取消",
  874. type: "warning"
  875. }).then(function () {
  876. return putOn(courseIds);
  877. }).then(() => {
  878. this.getList();
  879. this.msgSuccess("上架成功");
  880. }).catch(function () {
  881. });
  882. },
  883. pullOff() {
  884. const courseIds = this.ids;
  885. if (courseIds == null || courseIds == "") {
  886. return this.$message("未选择课程");
  887. }
  888. this.$confirm('是否确认批量下架课程?', "警告", {
  889. confirmButtonText: "确定",
  890. cancelButtonText: "取消",
  891. type: "warning"
  892. }).then(function () {
  893. return pullOff(courseIds);
  894. }).then(() => {
  895. this.getList();
  896. this.msgSuccess("下架成功");
  897. }).catch(function () {
  898. });
  899. }
  900. }
  901. };
  902. </script>