index.vue 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176
  1. <template>
  2. <el-card>
  3. <el-row :gutter="20">
  4. <el-form
  5. :model="queryForm"
  6. ref="queryForm"
  7. label-width="100px"
  8. :inline="false"
  9. size="samll"
  10. >
  11. <el-col :span="6">
  12. <el-form-item label="超级查询">
  13. <el-input
  14. v-model="queryForm.queryParam"
  15. placeholder="请输入"
  16. @keyup.enter.native="getList"
  17. clearable
  18. ></el-input>
  19. </el-form-item>
  20. </el-col>
  21. <el-form-item>
  22. <el-button size="mini" type="primary" @click="getList"
  23. >搜索</el-button
  24. >
  25. <el-button icon="el-icon-refresh" size="mini" @click="resetQueryForm"
  26. >重置</el-button
  27. >
  28. </el-form-item>
  29. </el-form>
  30. </el-row>
  31. <div class="btnRow mb10">
  32. <div class="btnList">
  33. <el-button
  34. type="primary"
  35. plain
  36. icon="el-icon-plus"
  37. size="mini"
  38. @click="addHandler"
  39. >新增
  40. </el-button>
  41. <el-button
  42. type="danger"
  43. plain
  44. icon="el-icon-delete"
  45. size="mini"
  46. :disabled="multiple"
  47. @click="myDeleteHandler"
  48. >删除
  49. </el-button>
  50. <el-button
  51. plain
  52. icon="el-icon-upload2"
  53. size="mini"
  54. @click="upload.open = true"
  55. >导入
  56. </el-button>
  57. <el-button
  58. type="warning"
  59. plain
  60. icon="el-icon-download"
  61. size="mini"
  62. @click="handleExport"
  63. >导出
  64. </el-button>
  65. </div>
  66. </div>
  67. <!-- 列表 -->
  68. <el-table
  69. :data="tableList"
  70. border
  71. stripe
  72. @selection-change="handleSelectionChange"
  73. >
  74. <el-table-column type="selection" width="55" />
  75. <el-table-column prop="saleDate" label="日期" />
  76. <el-table-column prop="customName" label="客户名称" />
  77. <el-table-column prop="deliveryDate" label="交货日期" />
  78. <el-table-column prop="saleLeadTime" label="交货天数" />
  79. <el-table-column prop="saleAmountInWords" label="合计金额" />
  80. <el-table-column prop="salesman" label="销售员" />
  81. <el-table-column prop="remark" label="备注" />
  82. <el-table-column label="操作">
  83. <template slot-scope="scope">
  84. <el-dropdown>
  85. <el-button type="warning" plain size="small">
  86. 操作<i class="el-icon-arrow-down el-icon--right"></i>
  87. </el-button>
  88. <el-dropdown-menu slot="dropdown">
  89. <el-dropdown-item>
  90. <el-button
  91. size="mini"
  92. type="text"
  93. icon="el-icon-edit"
  94. @click="handleUpdate(scope.row)"
  95. v-hasPermi="['system:productCodeList:edit']"
  96. >修改
  97. </el-button>
  98. </el-dropdown-item>
  99. <el-dropdown-item>
  100. <el-button
  101. size="mini"
  102. type="text"
  103. icon="el-icon-delete"
  104. @click="handleDelete(scope.row)"
  105. v-hasPermi="['system:productCodeList:remove']"
  106. >删除
  107. </el-button>
  108. </el-dropdown-item>
  109. </el-dropdown-menu>
  110. </el-dropdown>
  111. </template>
  112. </el-table-column>
  113. </el-table>
  114. <pagination
  115. v-show="total > 0"
  116. :total="total"
  117. :page.sync="queryForm.pageNum"
  118. :limit.sync="queryForm.pageSize"
  119. @pagination="getList"
  120. />
  121. </el-card>
  122. <!-- 添加或修改订单信息对话框 -->
  123. </template>
  124. <script>
  125. import { saleOrderList } from "@/api/system/retailMange.js";
  126. export default {
  127. name: "retailMange",
  128. props: [],
  129. components: {},
  130. data() {
  131. return {
  132. // 查询参数
  133. queryForm: {
  134. pageNum: 1, // 第几页
  135. pageSize: 10, // 每页大小
  136. queryParam: "",
  137. },
  138. // 表格数据
  139. tableList: [],
  140. // 新增或修改弹窗参数
  141. // start
  142. // end
  143. };
  144. },
  145. computed: {},
  146. mounted() {
  147. this.getList();
  148. },
  149. methods: {
  150. // 表格数据查询
  151. async getList() {
  152. try {
  153. let res = await saleOrderList(this.queryForm);
  154. console.log(res);
  155. if (res.code == 200) {
  156. this.tableList = res.rows;
  157. this.total = res.total;
  158. } else {
  159. this.$message.error(res.msg);
  160. }
  161. } catch (error) {
  162. console.log(error);
  163. }
  164. },
  165. resetQueryForm() {
  166. this.queryForm.queryParam = "";
  167. this.getList();
  168. },
  169. },
  170. };
  171. </script>
  172. <style scoped></style>