修改数值类型展示、固定列

src/main.js

@@ -46,10 +46,28 @@ function filterByPermission(data, targetPermission) {
     return newItem;
   });
 }
+//金额千分符 会在整数后添加两个0 --适用于直接显示的
+function  stateFormat(row, column, cellValue) {
+  if (cellValue) {
+      return Number(cellValue)
+        .toFixed(2)
+        .replace(/(\d)(?=(\d{3})+\.)/g, ($0, $1) => {
+          return $1 + ",";
+        })
+        .replace(/\.$/, "");
+    }
+}
+//金额千分符 自定义渲染表格内容情况下，调用此方法
+function formatNumber(value) {
+  if (value === null || value === undefined) return '';
+  return Number(value).toLocaleString();
+}
 Vue.prototype.$routerBaseApi = 'http://admin.pengda.checkcopy.com';
 // 复制
 Vue.prototype.$copy = modernCopyToClipboard;
 Vue.prototype.$filterByPermission = filterByPermission;
+Vue.prototype.$stateFormat = stateFormat;
+Vue.prototype.$formatNumber = formatNumber;
 Vue.prototype.$loadingFn = LoadingService;
 Vue.config.productionTip = false;
 // 请求

src/views/elementGroups.vue

@@ -101,9 +101,7 @@
                 <div>
                     <h3 for="">表格：(表头自定义、自定义渲染、固定列)</h3>
                     <GuipButton type="primary" @click="toggleAllSelection">全选按钮</GuipButton>
-
-
-                    <GuipTable :tableData="[{payment:0}]" ref="multipleTable" @selectChange="handleSelectionChange"
+                    <GuipTable :tableData="[{payment:0,name2:10008.9}]" ref="multipleTable" @selectChange="handleSelectionChange"
                         :multiple="true" autoColumn="true" :loading="tableLoading">
                         <!-- <template slot="header"> -->
                         <el-table-column width="180" fixed="left" label="名称(固定左)"></el-table-column>
@@ -140,7 +138,7 @@
                             </template>
 
                         </el-table-column>
-                        <el-table-column prop="name2" label="姓名" width="150"></el-table-column>
+                        <el-table-column prop="name2" label="姓名" width="150" :formatter="$stateFormat"></el-table-column>
                         <el-table-column prop="statu" label="价格" width="150">
                             <template slot-scope="scope">
                                 <GuipSwitch v-model="scope.row.statu" activeText="默认类型boolean" inactiveText="关闭" :active-value="1" :inactive-value="0"

src/views/super/Ranking/RankBatchList.vue

@@ -26,7 +26,7 @@
                 <GuipTable :tableData="tableData" style="width: 100%" :border="true" @sort-change="handleSortChange"
                     :loading="loading" @cell-mouse-enter="handleRowHover">
                     <el-table-column fixed="left" prop="sort" label="排序" width="70"></el-table-column>
-                    <el-table-column
+                    <el-table-column fixed="left"
                         v-if="(dataRank == 1 || dataRank == 2) && (dataType == 'ver_type' || dataType == 'check_type')"
                         prop="name" :key="selectedType" :label="type_select[selectedType]" min-width="120">
 
@@ -44,7 +44,7 @@
                         </template>
 
                     </el-table-column>
-                    <el-table-column v-else prop="name" :label="type_desc[dataType]" width="150"></el-table-column>
+                    <el-table-column v-else fixed="left" prop="name" :label="type_desc[dataType]" width="150"></el-table-column>
 
                     <el-table-column v-for="(field, index) in valueFields" :key="field" :label="labels[index]"
                         :prop="String(index + 1)"
@@ -53,9 +53,6 @@
 
                         <!--产品利润排行展示查看更多-->
                         <template v-if="index == 3 && dataRank == 1" v-slot="{ row, $index }">
-                            <!-- <el-popover v-model="row.id_popover" placement="top" trigger="manual"
-                                :ref="`popover-${$index}`" :append-to-body="false" :visible-arrow="true"
-                                popper-class="custom-popover" @show="popshow"> -->
                                 <el-popover v-model="row.id_popover" :ref="`popover-${row.id}`" 
                                 placement="bottom" trigger="manual" :append-to-body="false"  :visible-arrow="true"
                                 popper-class="custom-popover"  @show="popshow" >
@@ -116,7 +113,8 @@
                                 </div>
 
                                 <div class="flex" slot="reference">
-                                    {{ row[field] }}
+                                    <!-- {{ row[field] }} -->
+                                    {{ $formatNumber(row[field]) }}
                                         <svg-icon  :size="14" v-if="row[field] *100 != 0" 
                                             :path="require('@/assets/super/list-detail.svg')" :color="'#8A9099'"
                                             :hoverColor="'#006AFF'" @click="handleClick(row, $index, 'id')" />
@@ -126,7 +124,7 @@
                         </template>
                         <template v-else slot-scope="scope">
                             <div class="flex">
-                                {{ scope.row[field] }}
+                                {{ $formatNumber(scope.row[field]) }}
                             </div>
                         </template>
                     </el-table-column>
@@ -134,7 +132,7 @@
                     <!--产品利润排行展示代理商排行-->
                     <el-table-column v-if="dataRank == 1 && (dataType == 'ver_type' || dataType == 'check_type')"
                         :render-header=" (h, scope) => renderHeaderWithIcon(h, scope, require('@/assets/require.svg')) "
-                        key="top" prop="top" label="代理商排行" width="250" fixed="right">
+                        key="top" prop="top" label="代理商排行" width="250">
                         <template v-slot="{ row, $index }">
                             <!-- :fallback-placements="['bottom','top','left']" -->
                             <el-popover v-model="row.id_popover_2" :ref="`popover_2-${$index}`"
@@ -233,7 +231,7 @@ export default {
                 'ver_type': '按品牌名称',
                 'check_type': '按服务名称',
             },
-            selectedType: 'check_type',
+            selectedType: 'ver_type',
             view: 'month',
             labels: ['', '', '', ''],
             current_month: '',
@@ -609,6 +607,7 @@ export default {
 </script>
 <style scoped lang="scss">
 .pagetitle {
+    margin-bottom: 12px;
     h4 {
         margin-bottom: 0;
     }
@@ -628,7 +627,6 @@ export default {
 }
 
 .beforeNotice {
-    margin-top: 12px;
     border-radius: 4px;
     background: #F2F7FF;
     border: 1px solid #BFDAFF;

src/views/super/Ranking/RankList.vue

@@ -268,7 +268,7 @@ export default {
                 'ver_type': '按品牌名称',
                 'check_type': '按服务名称',
             },
-            selectedType: 'check_type',
+            selectedType: 'ver_type',
             viewDesc: {
                 'month': '月份',
                 'monthTwo': '月份',