public.vue 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928
  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" :headers="uploadHeaders" 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" :headers="uploadHeaders" 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. import { getToken, getTenantCode } from '@/utils/auth'
  461. export default {
  462. name: "UserCoursePublic",
  463. components: {
  464. Treeselect,
  465. Editor, ImageUpload, userCourseCatalogDetails
  466. },
  467. data() {
  468. return {
  469. isRequireTalentId:process.env.VUE_APP_TITLE_INDEX !== '存在文化互联网医院',
  470. talentParam: {
  471. phone: null,
  472. talentId: null
  473. },
  474. talentList: [],
  475. startTimeRange: [],
  476. show: {
  477. title: "目录管理",
  478. open: false
  479. },
  480. activeName: "1",
  481. projectOptions: [],
  482. tagsOptions: [],
  483. tags: [],
  484. companyIds: [],
  485. courseTypeOptions: [],
  486. orOptions: [],
  487. specShowOptions: [],
  488. specTypeOptions: [],
  489. categoryOptions: [],
  490. subCategoryOptions: [],
  491. querySubCateOptions: [],
  492. // 遮罩层
  493. loading: true,
  494. // 导出遮罩层
  495. exportLoading: false,
  496. // 选中数组
  497. ids: [],
  498. // 非单个禁用
  499. single: true,
  500. // 非多个禁用
  501. multiple: true,
  502. // 显示搜索条件
  503. showSearch: true,
  504. // 总条数
  505. total: 0,
  506. // 课程表格数据
  507. userCourseList: [],
  508. companyOptions: [],
  509. // 弹出层标题
  510. title: "",
  511. // 是否显示弹出层
  512. open: false,
  513. // 查询参数
  514. queryParams: {
  515. pageNum: 1,
  516. pageSize: 10,
  517. cateId: null,
  518. subCateId: null,
  519. title: null,
  520. imgUrl: null,
  521. userId: null,
  522. sort: null,
  523. status: null,
  524. isVip: null,
  525. isHot: null,
  526. isShow: "1",
  527. views: null,
  528. duration: null,
  529. description: null,
  530. hotRanking: null,
  531. integral: null,
  532. price: null,
  533. isPrivate: 0
  534. },
  535. // 表单参数
  536. form: {},
  537. // 表单校验
  538. rules: {
  539. courseName: [
  540. {required: true, message: "课堂名称不能为空", trigger: "blur"}
  541. ],
  542. imgUrl: [
  543. {required: true, message: "封面图片不能为空", trigger: "blur"}
  544. ],
  545. /* talentId: [
  546. {required: this.isRequireTalentId, message: "关联达人不能为空", trigger: "blur"}
  547. ], */
  548. isTui: [
  549. {required: true, message: "是否推荐不能为空", trigger: "blur"}
  550. ],
  551. isBest: [
  552. {required: true, message: "是否精选不能为空", trigger: "blur"}
  553. ],
  554. isFast: [
  555. {required: true, message: "是否允许快进不能为空", trigger: "blur"}
  556. ],
  557. isAutoPlay: [
  558. {required: true, message: "是否自动播放不能为空", trigger: "blur"}
  559. ],
  560. sort: [
  561. {required: true, message: "排序不能为空", trigger: "blur"}
  562. ],
  563. views: [
  564. {required: true, message: "播放量不能为空", trigger: "blur"}
  565. ],
  566. likes: [
  567. {required: true, message: "点赞数不能为空", trigger: "blur"}
  568. ],
  569. favoriteNum: [
  570. {required: true, message: "收藏数不能为空", trigger: "blur"}
  571. ],
  572. shares: [
  573. {required: true, message: "分享数不能为空", trigger: "blur"}
  574. ],
  575. isIntegral: [
  576. {required: true, message: "是否允许积分兑换不能为空", trigger: "blur"}
  577. ],
  578. isShow: [
  579. {required: true, message: "上架状态不能为空", trigger: "blur"}
  580. ],
  581. isPrivate: [
  582. {required: true, message: "公私域不能为空", trigger: "blur"}
  583. ],
  584. integral: [
  585. {required: true, message: "小节兑换积分不能为空", trigger: "blur"}
  586. ],
  587. }
  588. };
  589. },
  590. computed: {
  591. uploadHeaders() {
  592. const token = getToken()
  593. const headers = {
  594. 'X-Frontend-Type': 'admin',
  595. 'tenant-code': getTenantCode()
  596. }
  597. if (token) {
  598. headers.Authorization = 'Bearer ' + token
  599. }
  600. return headers
  601. }
  602. },
  603. created() {
  604. this.getList();
  605. getCatePidList().then(response => {
  606. this.categoryOptions = response.data;
  607. });
  608. // getSelectableRange().then(e => {
  609. // this.startTimeRange = e.data;
  610. // })
  611. // this.getTreeselect();
  612. this.getDicts("sys_spec_show").then(response => {
  613. this.specShowOptions = response.data;
  614. });
  615. this.getDicts("sys_spec_type").then(response => {
  616. this.specTypeOptions = response.data;
  617. });
  618. this.getDicts("sys_course_type").then(response => {
  619. this.courseTypeOptions = response.data;
  620. });
  621. this.getDicts("sys_course_project").then(response => {
  622. this.projectOptions = response.data;
  623. });
  624. this.getDicts("sys_course_tags").then(response => {
  625. this.tagsOptions = response.data;
  626. });
  627. this.getDicts("sys_company_or").then(response => {
  628. this.orOptions = response.data;
  629. });
  630. allList().then(response => {
  631. this.companyOptions = response.rows;
  632. });
  633. },
  634. methods: {
  635. selectTalent() {
  636. },
  637. talentMethod(query) {
  638. if (query !== '') {
  639. this.talentParam.phone = query;
  640. listBySearch(this.talentParam).then(response => {
  641. this.talentList = response.data;
  642. });
  643. }
  644. },
  645. getSubCateList(pid) {
  646. this.form.subCateId = null;
  647. if (pid == '') {
  648. this.subCategoryOptions = [];
  649. return
  650. }
  651. getCateListByPid(pid).then(response => {
  652. this.subCategoryOptions = response.data;
  653. });
  654. },
  655. getQuerySubCateList(pid) {
  656. this.queryParams.subCateId = null;
  657. if (pid == '') {
  658. this.querySubCateOptions = [];
  659. return
  660. }
  661. this.queryParams.subCateId = null;
  662. getCateListByPid(pid).then(response => {
  663. this.querySubCateOptions = response.data;
  664. });
  665. },
  666. handleShow(row) {
  667. var isShowValue = row.isShow === 0 ? 1 : 0;
  668. var course = {courseId: row.courseId, isShow: isShowValue, isPrivate: row.isPrivate};
  669. updateIsShow(course).then(response => {
  670. var isShowText = isShowValue === 1 ? "上架成功" : "下架成功";
  671. this.msgSuccess(isShowText);
  672. this.getList();
  673. });
  674. },
  675. handleCatalog(row) {
  676. const courseId = row.courseId;
  677. this.show.open = true;
  678. setTimeout(() => {
  679. this.$refs.userCourseCatalogDetails.getDetails(courseId, row.courseName, row.isPrivate);
  680. }, 200);
  681. },
  682. handleClick(tab, event) {
  683. this.queryParams.isShow = tab.name;
  684. this.getList();
  685. },
  686. /** 转换课堂分类数据结构 */
  687. normalizer(node) {
  688. if (node.children && !node.children.length) {
  689. delete node.children;
  690. }
  691. return {
  692. id: node.cateId,
  693. label: node.cateName,
  694. children: node.children
  695. };
  696. },
  697. getTreeselect() {
  698. getAllCourseCategoryList().then(response => {
  699. this.categoryOptions = [];
  700. const data = this.handleTree(response.data, "cateId", "pid");
  701. this.categoryOptions = data;
  702. });
  703. },
  704. /** 查询课程列表 */
  705. getList() {
  706. this.loading = true;
  707. listUserCourse(this.queryParams).then(response => {
  708. this.userCourseList = response.rows;
  709. this.total = response.total;
  710. this.loading = false;
  711. });
  712. },
  713. // 取消按钮
  714. cancel() {
  715. this.open = false;
  716. this.reset();
  717. },
  718. // 表单重置
  719. reset() {
  720. this.form = {
  721. courseId: null,
  722. cateId: null,
  723. subCateId: null,
  724. title: null,
  725. imgUrl: null,
  726. secondImg: null,
  727. userId: null,
  728. sort: null,
  729. createTime: null,
  730. updateTime: null,
  731. status: 0,
  732. isVip: null,
  733. isAutoPlay: "1",
  734. isIntegral: "0",
  735. isShow: "1",
  736. isFast: "1",
  737. isTui: "1",
  738. isBest: "1",
  739. isNext: "1",
  740. isPrivate: "0",
  741. views: 100000,
  742. duration: null,
  743. description: null,
  744. hotRanking: null,
  745. integral: null,
  746. price: null,
  747. likes: 100000,
  748. shares: 100000,
  749. favoriteNum: 100000,
  750. hotNum: 100000,
  751. };
  752. this.tags = [];
  753. this.subCategoryOptions = []
  754. this.resetForm("form");
  755. },
  756. /** 搜索按钮操作 */
  757. handleQuery() {
  758. this.queryParams.pageNum = 1;
  759. this.getList();
  760. },
  761. /** 重置按钮操作 */
  762. resetQuery() {
  763. this.resetForm("queryForm");
  764. this.queryParams.isShow = this.activeName
  765. this.handleQuery();
  766. },
  767. // 多选框选中数据
  768. handleSelectionChange(selection) {
  769. this.ids = selection.map(item => item.courseId)
  770. this.single = selection.length !== 1
  771. this.multiple = !selection.length
  772. },
  773. /** 新增按钮操作 */
  774. handleAdd() {
  775. this.reset();
  776. this.talentList = [];
  777. this.open = true;
  778. this.title = "添加课程";
  779. },
  780. /** 修改按钮操作 */
  781. handleUpdate(row) {
  782. this.reset();
  783. this.talentList = [];
  784. const courseId = row.courseId || this.ids
  785. getUserCourse(courseId).then(response => {
  786. this.form = response.data;
  787. // this.form.cateId = response.data.cateId.toString();
  788. getCateListByPid(this.form.cateId).then(response => {
  789. this.subCategoryOptions = response.data;
  790. });
  791. // this.form.courseType = response.data.courseType.toString();
  792. if (response.data.project != null) {
  793. this.form.project = response.data.project.toString();
  794. }
  795. if (response.data.tags != null) {
  796. this.tags = response.data.tags.split(",")
  797. }
  798. this.form.isAutoPlay = response.data.isAutoPlay.toString();
  799. this.form.isShow = response.data.isShow.toString();
  800. this.form.isBest = response.data.isBest.toString();
  801. this.form.isFast = response.data.isFast.toString();
  802. this.form.isIntegral = response.data.isIntegral.toString();
  803. this.form.isTui = response.data.isTui.toString();
  804. this.form.isNext = response.data.isNext.toString();
  805. this.form.isPrivate = response.data.isPrivate.toString();
  806. this.talentParam.talentId = response.data.talentId;
  807. if (this.form.companyIds != null) {
  808. this.companyIds = ((this.form.companyIds).split(",").map(Number))
  809. } else {
  810. this.companyIds = []
  811. }
  812. listBySearch(this.talentParam).then(response => {
  813. this.talentList = response.data;
  814. });
  815. this.open = true;
  816. this.title = "修改课程";
  817. });
  818. },
  819. /** 提交按钮 */
  820. submitForm() {
  821. this.$refs["form"].validate(valid => {
  822. /* if(this.isRequireTalentId && !this.talentParam.talentId){
  823. this.msgError("请关联达人");
  824. return;
  825. } */
  826. if (valid) {
  827. if (this.tags.length > 0) {
  828. this.form.tags = this.tags.toString();
  829. } else {
  830. this.form.tags = null
  831. }
  832. this.form.isPrivate = 0
  833. if (this.form.courseId != null) {
  834. updateUserCourse(this.form).then(response => {
  835. this.msgSuccess("修改成功");
  836. this.open = false;
  837. this.getList();
  838. });
  839. } else {
  840. addUserCourse(this.form).then(response => {
  841. this.msgSuccess("新增成功");
  842. this.open = false;
  843. this.getList();
  844. });
  845. }
  846. }
  847. });
  848. },
  849. /** 删除按钮操作 */
  850. handleDelete(row) {
  851. const courseIds = row.courseId || this.ids;
  852. this.$confirm('是否确认删除课程编号为"' + courseIds + '"的数据项?', "警告", {
  853. confirmButtonText: "确定",
  854. cancelButtonText: "取消",
  855. type: "warning"
  856. }).then(function () {
  857. return delUserCourse(courseIds);
  858. }).then(() => {
  859. this.getList();
  860. this.msgSuccess("删除成功");
  861. }).catch(() => {
  862. });
  863. },
  864. /** 导出按钮操作 */
  865. handleExport() {
  866. const queryParams = this.queryParams;
  867. this.$confirm('是否确认导出所有课程数据项?', "警告", {
  868. confirmButtonText: "确定",
  869. cancelButtonText: "取消",
  870. type: "warning"
  871. }).then(() => {
  872. this.exportLoading = true;
  873. return exportUserCourse(queryParams);
  874. }).then(response => {
  875. this.download(response.msg);
  876. this.exportLoading = false;
  877. }).catch(() => {
  878. });
  879. },
  880. putOn() {
  881. const courseIds = this.ids;
  882. if (courseIds == null || courseIds == "") {
  883. return this.$message("未选择课程");
  884. }
  885. this.$confirm('是否确认批量上架课程?', "警告", {
  886. confirmButtonText: "确定",
  887. cancelButtonText: "取消",
  888. type: "warning"
  889. }).then(function () {
  890. return putOn(courseIds);
  891. }).then(() => {
  892. this.getList();
  893. this.msgSuccess("上架成功");
  894. }).catch(function () {
  895. });
  896. },
  897. pullOff() {
  898. const courseIds = this.ids;
  899. if (courseIds == null || courseIds == "") {
  900. return this.$message("未选择课程");
  901. }
  902. this.$confirm('是否确认批量下架课程?', "警告", {
  903. confirmButtonText: "确定",
  904. cancelButtonText: "取消",
  905. type: "warning"
  906. }).then(function () {
  907. return pullOff(courseIds);
  908. }).then(() => {
  909. this.getList();
  910. this.msgSuccess("下架成功");
  911. }).catch(function () {
  912. });
  913. }
  914. }
  915. };
  916. </script>