change_list-detail.vue 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179
  1. <template>
  2. <div>
  3. <div class="sty">
  4. <el-page-header @back="goBack" content="详情"> </el-page-header>
  5. </div>
  6. <br />
  7. <br />
  8. <span>返利互转单</span>
  9. <el-divider></el-divider>
  10. <!-- 筛选条件 -->
  11. <div>
  12. <el-form label-width="100px" size="small" label-position="left">
  13. <el-row :gutter="20">
  14. <el-col :xs="24" :sm="12" :lg="6">
  15. <el-form-item label="返利互转单号" prop="">
  16. <el-input
  17. disabled
  18. v-model="detailList.id"
  19. placeholder="请输入"
  20. ></el-input>
  21. </el-form-item>
  22. </el-col>
  23. <el-col :xs="24" :sm="12" :lg="6">
  24. <el-form-item label="单据日期" prop="">
  25. <el-input
  26. disabled
  27. v-model="detailList.theTime"
  28. placeholder="请输入"
  29. ></el-input>
  30. </el-form-item>
  31. </el-col>
  32. <el-col :xs="24" :sm="12" :lg="6">
  33. <el-form-item label="制单人" prop="">
  34. <el-input disabled placeholder="请输入"></el-input>
  35. </el-form-item>
  36. </el-col>
  37. <el-col :xs="24" :sm="12" :lg="6">
  38. <el-form-item label="经销商编号" prop="">
  39. <el-input
  40. disabled
  41. v-model="detailList.customerNumber"
  42. placeholder="请输入"
  43. ></el-input>
  44. </el-form-item>
  45. </el-col>
  46. <el-col :xs="24" :sm="12" :lg="6">
  47. <el-form-item label="经销商名称" prop="">
  48. <el-input
  49. disabled
  50. v-model="detailList.customerName"
  51. placeholder="请输入"
  52. ></el-input>
  53. </el-form-item>
  54. </el-col>
  55. <el-col :xs="24" :sm="12" :lg="6">
  56. <el-form-item label="备注信息" prop="">
  57. <el-input
  58. disabled
  59. v-model="detailList.remark"
  60. placeholder="请输入"
  61. ></el-input>
  62. </el-form-item>
  63. </el-col>
  64. <el-col :xs="24" :sm="12" :lg="6">
  65. <el-form-item label="审核人" prop="">
  66. <el-input
  67. disabled
  68. v-model="detailList.examineBy"
  69. placeholder="请输入"
  70. ></el-input>
  71. </el-form-item>
  72. </el-col>
  73. <el-col :xs="24" :sm="12" :lg="6">
  74. <el-form-item label="审核日期" prop="">
  75. <el-input
  76. disabled
  77. v-model="detailList.examineTime"
  78. placeholder="请输入"
  79. ></el-input>
  80. </el-form-item>
  81. </el-col>
  82. <el-col :xs="24" :sm="12" :lg="6">
  83. <el-form-item label="关闭人" prop="">
  84. <el-input disabled placeholder="请输入"></el-input>
  85. </el-form-item>
  86. </el-col>
  87. <el-col :xs="24" :sm="12" :lg="6">
  88. <el-form-item label="关闭日期" prop="">
  89. <el-input disabled placeholder="请输入"></el-input>
  90. </el-form-item>
  91. </el-col>
  92. </el-row>
  93. </el-form>
  94. </div>
  95. <!-- 列表 -->
  96. <div class="mymain-container">
  97. <div class="table">
  98. <el-table
  99. v-loading="listLoading"
  100. :data="dataList"
  101. element-loading-text="Loading"
  102. border
  103. fit
  104. highlight-current-row
  105. stripe
  106. >
  107. <el-table-column
  108. label="序号"
  109. align="center"
  110. width="100"
  111. type="index"
  112. show-overflow-tooltip
  113. ></el-table-column>
  114. <el-table-column
  115. align="center"
  116. label="返利类型"
  117. prop="customerWalletName"
  118. min-width="160"
  119. show-overflow-tooltip
  120. ></el-table-column>
  121. <el-table-column
  122. align="center"
  123. label="返利金额"
  124. prop="amount"
  125. min-width="160"
  126. show-overflow-tooltip
  127. ></el-table-column>
  128. <el-table-column
  129. align="center"
  130. label="备注"
  131. prop="remark"
  132. min-width="160"
  133. show-overflow-tooltip
  134. ></el-table-column>
  135. </el-table>
  136. </div>
  137. </div>
  138. </div>
  139. </template>
  140. <script>
  141. export default {
  142. props: {
  143. detailList: {
  144. type: Object,
  145. required: true,
  146. },
  147. },
  148. data() {
  149. return {
  150. dataList: [], // 列表数据
  151. searchForm: {}, //搜索表单
  152. listLoading: false, // 列表加载loading
  153. };
  154. },
  155. created() {
  156. this.dataList = [
  157. {
  158. customerWalletName: this.detailList.initiatorCustomerWalletName,
  159. remark: this.detailList.initiatorRemark,
  160. amount: -this.detailList.amount,
  161. },
  162. {
  163. customerWalletName: this.detailList.receiverCustomerWalletName,
  164. remark: this.detailList.receiverRemark,
  165. amount: this.detailList.amount,
  166. },
  167. ];
  168. },
  169. methods: {
  170. goBack() {
  171. this.$parent.showPage = 1;
  172. },
  173. },
  174. };
  175. </script>
  176. <style>
  177. </style>