Selaa lähdekoodia

fix(frontend): ProductPpointManage排序列头+sortableColumns+sort-tag位置修正

iwt 2 kuukautta sitten
vanhempi
sitoutus
add05488a3
1 muutettua tiedostoa jossa 23 lisäystä ja 12 poistoa
  1. 23 12
      cfc-web/src/views/admin/ProductPpointManage.vue

+ 23 - 12
cfc-web/src/views/admin/ProductPpointManage.vue

@@ -6,6 +6,16 @@
         <el-input v-model="searchText" placeholder="商品名称搜索" prefix-icon="el-icon-search" style="width: 200px;" clearable @keyup.enter.native="loadList" />
         <el-input v-model="searchText" placeholder="商品名称搜索" prefix-icon="el-icon-search" style="width: 200px;" clearable @keyup.enter.native="loadList" />
         <el-button type="primary" @click="loadList">查询</el-button>
         <el-button type="primary" @click="loadList">查询</el-button>
         <el-button type="success" @click="openAddDialog">新增配置</el-button>
         <el-button type="success" @click="openAddDialog">新增配置</el-button>
+        <el-tag
+          v-if="sortState.length > 0"
+          closable
+          size="mini"
+          class="sort-tag"
+          @close="clearSort"
+          @click="clearSort"
+        >
+          {{ sortLabel }}
+        </el-tag>
       </div>
       </div>
     </div>
     </div>
     <el-table :max-height="tableHeight" :data="list" v-loading="loading" border stripe>
     <el-table :max-height="tableHeight" :data="list" v-loading="loading" border stripe>
@@ -16,7 +26,11 @@
           <span v-else>-</span>
           <span v-else>-</span>
         </template>
         </template>
       </el-table-column>
       </el-table-column>
-      <el-table-column prop="productName" label="商品名称" min-width="160" show-overflow-tooltip />
+      <el-table-column prop="productName" label="商品名称" min-width="160" show-overflow-tooltip>
+        <template slot="header">
+          <span class="sort-header" @click.stop="onSortClick('productName', $event)" @dblclick.stop="onSortToggle('productName')">商品名称{{ sortIcon('productName') }}</span>
+        </template>
+      </el-table-column>
       <el-table-column prop="price" label="售价(元)" width="90">
       <el-table-column prop="price" label="售价(元)" width="90">
         <template slot-scope="{ row }">
         <template slot-scope="{ row }">
           {{ row.price != null ? (row.price / 100).toFixed(2) : '-' }}
           {{ row.price != null ? (row.price / 100).toFixed(2) : '-' }}
@@ -28,6 +42,9 @@
         </template>
         </template>
       </el-table-column>
       </el-table-column>
       <el-table-column label="P点基点(bps)" width="120">
       <el-table-column label="P点基点(bps)" width="120">
+        <template slot="header">
+          <span class="sort-header" @click.stop="onSortClick('ppoint', $event)" @dblclick.stop="onSortToggle('ppoint')">P点基点(bps){{ sortIcon('ppoint') }}</span>
+        </template>
         <template slot-scope="{ row }">
         <template slot-scope="{ row }">
           <span v-if="editId !== row.id">{{ row.ppoint != null ? row.ppoint + ' bps' : '-' }}</span>
           <span v-if="editId !== row.id">{{ row.ppoint != null ? row.ppoint + ' bps' : '-' }}</span>
           <el-input-number
           <el-input-number
@@ -42,6 +59,9 @@
         </template>
         </template>
       </el-table-column>
       </el-table-column>
       <el-table-column label="生效日期" width="100">
       <el-table-column label="生效日期" width="100">
+        <template slot="header">
+          <span class="sort-header" @click.stop="onSortClick('startDate', $event)" @dblclick.stop="onSortToggle('startDate')">生效日期{{ sortIcon('startDate') }}</span>
+        </template>
         <template slot-scope="{ row }">
         <template slot-scope="{ row }">
           {{ row.startDate || '-' }}
           {{ row.startDate || '-' }}
         </template>
         </template>
@@ -57,16 +77,6 @@
       <el-table-column label="操作" width="150" fixed="right">
       <el-table-column label="操作" width="150" fixed="right">
         <template slot-scope="{ row }">
         <template slot-scope="{ row }">
           <template v-if="editId !== row.id">
           <template v-if="editId !== row.id">
-            <el-tag
-                v-if="sortState.length > 0"
-                closable
-                size="mini"
-                class="sort-tag"
-                @close="clearSort"
-                @click="clearSort"
-              >
-                {{ sortLabel }}
-              </el-tag>
           <el-button type="primary" size="small" @click="startEdit(row)">编辑</el-button>
           <el-button type="primary" size="small" @click="startEdit(row)">编辑</el-button>
             <el-button type="danger" size="small" @click="deleteRow(row)">删除</el-button>
             <el-button type="danger" size="small" @click="deleteRow(row)">删除</el-button>
           </template>
           </template>
@@ -143,7 +153,8 @@ export default {
         ppoint: 0,
         ppoint: 0,
         startDate: ''
         startDate: ''
       },
       },
-      productOptions: []
+      productOptions: [],
+      sortableColumns: { productName: '商品名称', ppoint: 'P点基点', startDate: '生效日期' }
     }
     }
   },
   },
   mounted() {
   mounted() {