assets.vue 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211
  1. <template>
  2. <view class="m_right">
  3. <view class="m_right_hander">
  4. <button size="mini" class="m_btn_red">添加资产</button>
  5. </view>
  6. <view class="m_right_container">
  7. <table style="width: 100%;border: 1px solid #DDDDDD;border-collapse: collapse">
  8. <thead class="m-table-hander">
  9. <tr>
  10. <th>资产预览图</th>
  11. <th>资产名称</th>
  12. <th>上传人</th>
  13. <th>上传时间</th>
  14. <th>删除</th>
  15. </tr>
  16. </thead>
  17. <tbody>
  18. <tr v-for="(item,index) in tabledata" :key="index">
  19. <th>
  20. <img :src="item.Texture_Url" alt="" style="width: 80rpx;">
  21. <!-- <image class="m_logoimg" src="../../assets/topMenu/introductionToTheExperimentUnchecked.png" mode=""></image> -->
  22. </th>
  23. <th>{{item.Fbx_Url}}</th>
  24. <th></th>
  25. <th></th>
  26. <th style="position: relative;"><button type="default" size="mini" class="m_delete">删除</button></th>
  27. </tr>
  28. </tbody>
  29. </table>
  30. </view>
  31. <view class="m_right_footer">
  32. <!-- <view class="m_paging">
  33. <text class="m_paging_item m_paging_upper">上一页</text>
  34. <text class="m_paging_item" v-for="i in 8" @click="paging(i)" :key="i" :class="i==index?'p_act':''">
  35. {{i}}
  36. </text>
  37. <text class="m_paging_item m_paging_lower">下一页</text>
  38. </view> -->
  39. </view>
  40. </view>
  41. </template>
  42. <script>
  43. export default {
  44. name: "manager_assets",
  45. data() {
  46. return {
  47. queryList: {
  48. BeginNum: 0,
  49. EndNum: 100,
  50. UserID: undefined,
  51. ItemType: ""
  52. },
  53. index: 1,
  54. tabledata:[]
  55. }
  56. },
  57. methods: {
  58. paging(obj) {
  59. this.index = obj;
  60. },
  61. getList() {
  62. this.queryList.UserID = this.$UserId;
  63. uni.request({
  64. url: this.$Api + "/backstage/getalluser",
  65. data: this.queryList,
  66. method: "POST",
  67. dataType: "json",
  68. success: res => {
  69. var {
  70. data
  71. } = res;
  72. if (data.code == 100) {
  73. if (data.AllNumOfList > 0) {
  74. this.tabledata = res.Items
  75. // var tempCount = parseInt(data.AllNumOfList / this.pageSize);
  76. // if (tempCount * this.pageSize == data.AllNumOfList)
  77. // this.pageCount = tempCount;
  78. // else
  79. // this.pageCount = tempCount + 1;
  80. } else {
  81. this.tabledata = [];
  82. }
  83. } else {
  84. this.tabledata = [];
  85. // this.pageCount = 0;
  86. }
  87. }
  88. })
  89. }
  90. }
  91. }
  92. </script>
  93. <style lang="scss">
  94. .m_right {
  95. width: 100%;
  96. margin-top: 5rpx;
  97. padding: 0 150rpx;
  98. background-color: #fff;
  99. box-shadow: 3px 0px 6px 0px rgba(0, 0, 0, 0.1);
  100. .m_right_hander {
  101. text-align: right;
  102. height: 250rpx;
  103. position: relative;
  104. .m_btn_red {
  105. position: absolute;
  106. height: 80rpx;
  107. line-height: 80rpx;
  108. padding: 0 40rpx;
  109. right: 0;
  110. top: 50%;
  111. transform: translateY(-50%);
  112. background: #EA252C;
  113. color: #fff;
  114. }
  115. }
  116. }
  117. tbody tr {
  118. border-top: 2rpx solid #DDDDDD !important;
  119. }
  120. tbody tr th:first-child {
  121. position: relative;
  122. }
  123. tbody tr th {
  124. font-weight: 400 !important;
  125. height: 140rpx;
  126. line-height: 140rpx;
  127. }
  128. tbody tr:hover {
  129. // color: #fff;
  130. background: #FDEBEC;
  131. // opacity: 0.08;
  132. }
  133. .m-table-hander {
  134. background-color: #FFF8F7;
  135. height: 140rpx;
  136. line-height: 140rpx;
  137. font-family: MicrosoftYaHei-Bold, MicrosoftYaHei;
  138. font-weight: bold;
  139. }
  140. .m_edit {
  141. position: absolute;
  142. top: 50%;
  143. left: 50%;
  144. transform: translate(-50%, -50%);
  145. background: rgb(67, 127, 250);
  146. color: rgb(255, 255, 255);
  147. min-width: 130rpx;
  148. }
  149. .m_delete {
  150. position: absolute;
  151. top: 50%;
  152. left: 50%;
  153. min-width: 130rpx;
  154. transform: translate(-50%, -50%);
  155. background: rgb(234, 37, 44);
  156. color: rgb(255, 255, 255);
  157. }
  158. .m_right_footer {
  159. margin-top: 80rpx;
  160. }
  161. .m_logoimg {
  162. width: 80rpx;
  163. height: 80rpx;
  164. position: absolute;
  165. top: 50%;
  166. left: 50%;
  167. transform: translate(-50%, -50%);
  168. }
  169. .m_paging {
  170. text-align: right;
  171. .m_paging_item {
  172. padding: 10rpx 18rpx;
  173. border: 1rpx solid #DDDDDD;
  174. border-radius: 8rpx;
  175. margin-right: 10rpx;
  176. }
  177. .p_act {
  178. background: #EA252C;
  179. color: #fff;
  180. border: inherit;
  181. }
  182. }
  183. .m_paging_item:hover {
  184. background: #EA252C;
  185. color: #fff;
  186. border: inherit;
  187. }
  188. .m_act1 {
  189. color: #FF0019;
  190. }
  191. </style>