chuanChenRen.vue 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104
  1. <template>
  2. <view class="box">
  3. <view class="top_bg">
  4. <topBox></topBox>
  5. <view @click="backBtn" class="back">⬅返回上一级</view>
  6. </view>
  7. <view class="zj_box">
  8. <commonItems :projectList="projectList" class="box_item"></commonItems>
  9. </view>
  10. <view class="qiehuan">
  11. <view class="qh_btn">
  12. <image class="img" src="/static/img/left.png"></image>
  13. </view>
  14. <view class="qh_btn">
  15. <image class="img" src="/static/img/right.png"></image>
  16. </view>
  17. </view>
  18. </view>
  19. </template>
  20. <script>
  21. let that;
  22. export default {
  23. data() {
  24. return { projectList: [] };
  25. },
  26. onLoad(o) {
  27. that = this;
  28. this.getMainBodyColumnContentList();
  29. },
  30. methods: {
  31. getMainBodyColumnContentList() {
  32. this.$api.getMainBodyColumnContentList(
  33. {
  34. model_id: 7 /* 模型id */,
  35. main_body_id: 5
  36. },
  37. function (res) {
  38. that.projectList = res.data[0].content_list;
  39. console.log(that.projectList, '传承人');
  40. }
  41. );
  42. },
  43. backBtn() {
  44. console.log(11111);
  45. uni.navigateBack({
  46. delta: 1
  47. });
  48. }
  49. }
  50. };
  51. </script>
  52. <style>
  53. .box {
  54. width: 100%;
  55. height: 100vh;
  56. background: linear-gradient(180deg, rgba(240, 235, 222, 0.2) 0%, #f0ebde 5%, #f0ebde 100%);
  57. }
  58. .top_bg {
  59. width: 100%;
  60. position: absolute;
  61. color: #ffffff;
  62. z-index: 1;
  63. /* background: linear-gradient(10deg, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.2) 100%); */
  64. }
  65. .zj_box {
  66. width: 100%;
  67. height: 62%;
  68. position: fixed;
  69. }
  70. .back {
  71. width: 12%;
  72. height: 15%;
  73. margin-left: 5%;
  74. margin-top: -2%;
  75. cursor: pointer;
  76. font-size: 12px;
  77. color: #8e6c4f;
  78. letter-spacing: 0.3em;
  79. }
  80. .qiehuan {
  81. position: absolute;
  82. top: 42%;
  83. left: 8%;
  84. z-index: 33;
  85. display: flex;
  86. justify-content: space-between;
  87. width: 87%;
  88. height: 8%;
  89. }
  90. .qh_btn {
  91. width: 3%;
  92. height: 65%;
  93. }
  94. .img {
  95. width: 100%;
  96. height: 100%;
  97. }
  98. </style>