userCourseNoteDetails.vue 3.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. <template>
  2. <div style="background-color: #f0f2f5; padding-bottom: 20px; min-height: 100%; " >
  3. <div style="padding: 20px; background-color: #fff;">
  4. 课堂笔记详情
  5. </div>
  6. <div class="contentx" v-if="item!=null">
  7. <div class="desct"> 课堂笔记信息</div>
  8. <el-descriptions title="" :column="3" border>
  9. <el-descriptions-item label="订单号"><span v-if="item!=null">{{item.orderCode}}</span></el-descriptions-item>
  10. <el-descriptions-item label="课程名称"><span v-if="item!=null">{{item.courseName}}</span></el-descriptions-item>
  11. <el-descriptions-item label="用户id"><span v-if="item!=null">{{item.userId}}</span></el-descriptions-item>
  12. <el-descriptions-item label="用户电话"><span v-if="item!=null">{{item.integral}}</span></el-descriptions-item>
  13. <el-descriptions-item label="笔记分类"><span v-if="item!=null">{{item.noteCateId}}</span></el-descriptions-item>
  14. <el-descriptions-item label="点赞数"><span v-if="item!=null">{{item.likes}}</span></el-descriptions-item>
  15. <el-descriptions-item label="状态"><span v-if="item!=null"> <dict-tag :options="statusOptions" :value="item.status"/></span></el-descriptions-item>
  16. <el-descriptions-item label="是否热门"><span v-if="item!=null"><dict-tag :options="isHotOptions" :value="item.isHot"/></span></el-descriptions-item>
  17. <el-descriptions-item label="是否展示"><span v-if="item!=null"><dict-tag :options="isShowOptions" :value="item.isShow"/></span></el-descriptions-item>
  18. <el-descriptions-item label="内容"><span v-if="item!=null">{{item.content}}</span></el-descriptions-item>
  19. </el-descriptions>
  20. </div>
  21. </div>
  22. </template>
  23. <script>
  24. import { listUserCourseNote, getUserCourseNote, delUserCourseNote, addUserCourseNote, updateUserCourseNote, exportUserCourseNote } from "@/api/course/userCourseNote";
  25. export default {
  26. name: "userCourseNoteDetails",
  27. data() {
  28. return {
  29. item:null,
  30. isShowOptions:[],
  31. statusOptions:[],
  32. isHotOptions:[],
  33. }
  34. },
  35. created() {
  36. this.getDicts("sys_company_or").then(response => {
  37. this.isHotOptions = response.data;
  38. this.isShowOptions = response.data;
  39. });
  40. this.getDicts("sys_note_status").then(response => {
  41. this.statusOptions = response.data;
  42. });
  43. },
  44. methods: {
  45. getDetails(orderId) {
  46. this.item=null;
  47. getUserCourseNote(orderId).then(response => {
  48. this.item = response.data;
  49. });
  50. },
  51. }
  52. }
  53. </script>
  54. <style>
  55. .contentx{
  56. height: 100%;
  57. background-color: #fff;
  58. padding: 0px 20px 20px;
  59. margin: 20px;
  60. }
  61. .el-descriptions-item__label.is-bordered-label{
  62. font-weight: normal;
  63. }
  64. .el-descriptions-item__content {
  65. max-width: 150px;
  66. min-width: 100px;
  67. }
  68. .desct{
  69. padding-top: 20px;
  70. padding-bottom: 20px;
  71. color: #524b4a;
  72. font-weight: bold;
  73. }
  74. </style>