feat:e袋洗3.0迭代

src/views/ewash/partials/unable-tips.vue

+<template>
+  <el-dialog title="提示" :visible="ewashTipDialog" width="400px">
+    <div class="text-center pb20">
+      <i class="el-icon-error red fz40 mb20 pb10"></i>
+      <div class="fz16">请联系客服进行开通使用！</div>
+    </div>
+    <div class="text-center pb10 mt20">
+      <el-button @click="ewashTipDialog = false">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+export default {
+  name: 'unable-tips',
+  props: ['ewashTipDialog']
+};
+</script>

src/views/ewash/store-list.vue

+<template>
+  <section class="dm-wrap">
+    <div class="clearfix pb22">
+      <el-input v-model="listParams.searchParam" class="w300" placeholder="输入门店名称/code进行搜索" clearable @change="refresh"><i slot="prefix" class="el-input__icon el-icon-search"></i></el-input>
+      <div class="fr">
+        <el-button type="primary" @click="$router.push('/ewash/statements')" :disabled="!ewashDisable">查看账单</el-button>
+        <el-button type="primary" @click="handleDialogShow" :disabled="!ewashDisable">创建子账户</el-button>
+      </div>
+    </div>
+    <el-table tooltipEffect="light" :data="tableList" style="width: 100%" v-loading="loading">
+      <el-table-column v-for="(v, i) in tableHeader" :show-overflow-tooltip="v.tooltip" :width="v.width" :min-width="v.minWidth" :align="v.align" :key="i" :prop="v.prop" :label="v.label" :formatter="v.formatter" :fixed="v.fixed">
+        <template slot-scope="scope">
+          <span v-if="v.formatter" v-html="v.formatter(scope.row)"></span>
+          <span v-else>{{ scope.row[v.prop] }}</span>
+        </template>
+      </el-table-column>
+    </el-table>
+    <el-pagination v-show="tableList.length" background class="dm-pagination" @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="listParams.currentPage" :page-sizes="[20, 40, 60, 80]" :page-size="listParams.pageSize" layout="total, sizes, prev, pager, next" :total="total"></el-pagination>
+    <!-- 创建子账户dialog -->
+    <store-child ref="storeChild" :dialogVisible.sync="dialogVisible" />
+    <!-- 未创建e袋洗服务 -->
+    <unable-tips :ewashTipDialog="ewashTipDialog" />
+  </section>
+</template>
+<script>
+import { getEdxStoreList } from '@/service/api/ewashApi.js';
+import tableMethods from '@/mixins/tableMethods.js';
+import unableTips from './partials/unable-tips';
+import storeChild from './partials/store-child';
+
+export default {
+  name: 'ewash-store-list',
+  mixins: [tableMethods],
+  data() {
+    return {
+      dialogVisible: false,
+      tableList: [],
+      tableHeader: [
+        { label: '门店名称', prop: 'storeName', minWidth: '120', align: 'left' },
+        { label: '门店code', prop: 'storeCode', minWidth: '120', tooltip: true, align: 'left' },
+        {
+          label: '店长信息',
+          minWidth: '140',
+          tooltip: false,
+          align: 'left',
+          formatter: row => {
+            return `<div>${row.clerkManagerName}</div><div class="fz13 minor-font-color">${row.clerkManagerPhone}</div>`;
+          }
+        },
+        { label: '门店地址', prop: 'address', minWidth: '160', tooltip: true, align: 'left' },
+        {
+          label: '当前余额',
+          prop: 'storeBalance',
+          minWidth: '120',
+          tooltip: false,
+          align: 'left',
+          formatter: row => {
+            return `¥ ${row.storeBalance ? row.storeBalance : '0.00'}`;
+          }
+        }
+      ],
+      listParams: {
+        searchParam: '',
+        currentPage: 1,
+        pageSize: 20
+      },
+      total: 0,
+      ewashDisable: false, // e袋洗服务能否使用
+      ewashTipDialog: false
+    };
+  },
+  components: {
+    unableTips,
+    storeChild
+  },
+  methods: {
+    // 创建子账户dialog
+    handleDialogShow() {
+      this.dialogVisible = true;
+      this.$refs.storeChild.reload();
+    },
+    // 获取列表
+    async getTableList() {
+      try {
+        this.loading = true;
+        let res = await getEdxStoreList(this.listParams);
+        if (res.errorCode === 0 && res.result) {
+          this.tableList = res.result.result || [];
+          this.total = res.result.totalCount;
+          this.ewashDisable = true;
+        } else {
+          this.tableList = [];
+          this.total = 0;
+          if (res.data && res.data.errorCode === 170049) {
+            // 未开通e袋洗服务
+            this.ewashTipDialog = true;
+            this.ewashDisable = false;
+          }
+        }
+        this.loading = false;
+      } catch (err) {
+        this.loading = false;
+      }
+    }
+  },
+  mounted() {
+    this.getTableList();
+  },
+  created() {
+    this.$store.commit('mutations_breadcrumb', [{ name: 'e袋洗服务', path: '' }, { name: '门店管理', path: '/ewash/store' }]);
+  }
+};
+</script>