index.html 3.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273
  1. <link rel="stylesheet" href="__CDN__/assets/addons/shopro/libs/element/element.css">
  2. <link rel="stylesheet" href="__CDN__/assets/addons/shopro/libs/common.css">
  3. <style>
  4. #companyIndex {
  5. color: #444;
  6. background: #fff;
  7. border-radius: 4px;
  8. padding: 0px 20px 30px;
  9. }
  10. .table-img {
  11. width: 30px;
  12. height: 30px;
  13. margin-right: 16px;
  14. }
  15. [v-cloak] {
  16. display: none
  17. }
  18. </style>
  19. <script src="__CDN__/assets/addons/shopro/libs/vue.js"></script>
  20. <script src="__CDN__/assets/addons/shopro/libs/element/element.js"></script>
  21. <script src="__CDN__/assets/addons/shopro/libs/moment.js"></script>
  22. <div id="companyIndex" v-cloak v-loading="isAjax">
  23. <div class="custom-index">
  24. <div class="custom-header display-flex">
  25. <div class="custom-header-title">
  26. 快递公司列表
  27. </div>
  28. <div class="custom-search">
  29. <el-input placeholder="请输入关键字" suffix-icon="el-icon-search" v-model="searchKey" size="small">
  30. </el-input>
  31. </div>
  32. </div>
  33. <div class="custom-button-container">
  34. <div class="create-btn" @click="operation('create')">
  35. <i class="el-icon-plus"></i>
  36. <span>添加</span>
  37. </div>
  38. <!-- <div class="recycle-btn" @click="operation('recycle')">
  39. <i class="fa fa-recycle"></i>
  40. 回收站
  41. </div> -->
  42. </div>
  43. <div>
  44. <el-table ref="multipleTable" :data="indexData" tooltip-effect="dark" style="width: 100%" border
  45. :row-class-name="tableRowClassName" :cell-class-name="tableCellClassName"
  46. :header-cell-class-name="tableCellClassName" @row-dblclick="operation">
  47. <el-table-column label="ID" prop="id" width="60">
  48. </el-table-column>
  49. <el-table-column label="快递公司" prop="name" min-width="220">
  50. </el-table-column>
  51. <el-table-column prop="code" label="编码" min-width="180">
  52. </el-table-column>
  53. <el-table-column prop="weigh" label="权重" width="100">
  54. </el-table-column>
  55. <el-table-column label="操作" width="120">
  56. <template slot-scope="scope">
  57. <span class="table-edit-text" @click="operation('edit',scope.row.id)">编辑
  58. </span>
  59. <span class="table-delete-text" @click.stop="operation('del',scope.row.id)">删除</span>
  60. </template>
  61. </el-table-column>
  62. </el-table>
  63. </div>
  64. <div class="pagination-container">
  65. <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
  66. :current-page="currentPage" :page-sizes="[10, 20, 30, 40]" :page-size="limit"
  67. layout="total, sizes, prev, pager, next, jumper" :total="totalPage">
  68. </el-pagination>
  69. </div>
  70. </div>
  71. </div>