store.vue

<template>
  <div class="main">
    <div class="title">全部品牌（ 共{{zcache.page.allItem}}个 ）</div>
    <!-- 搜索区 -->
    <div class="searchs">
      <div class="buttons">
        <el-button class="button buttonlight" size="small" @click="addStore">添加品牌</el-button>
        <el-button class="button buttondark" size="small" @click="storeDelStoreArr">批量删除</el-button>
      </div>

      <el-form class="searchzone" :inline="true" :model="data.search" label-width="auto">
        <el-form-item label="关键词">
          <el-input
            size="small"
            v-model="zdata.searchPost.keywords"
            style="width:160px"
            placeholder="请输入关键词"
          />
        </el-form-item>
        <el-button
          class="button buttondark"
          size="small"
          @click="storeSearch"
          style="margin-top:4px;"
        >搜索</el-button>
      </el-form>
    </div>
    <!-- 列表区 -->
    <div class="lists">
      <el-table
        stripe
        class="list"
        ref="multipleTable"
        :data="list.main"
        tooltip-effect="dark"
        style="width: 100%"
        @selection-change="listPick"
        height="calc(100vh - 360px)"
      >
        <el-table-column type="selection" width="60"></el-table-column>
        <el-table-column prop="adminStall.name" label="品牌名称" align="center"></el-table-column>
        <el-table-column prop="adminStall.type" label="品牌类型" align="center" width="120"></el-table-column>
        <el-table-column prop="adminStall.principal" label="品牌负责人" align="center" width="120"></el-table-column>
        <el-table-column prop="shopName" label="所属柜组" align="center" width="120"></el-table-column>
        <el-table-column prop="adminStall.location" label="位置" align="center" width="120"></el-table-column>
        <el-table-column prop="adminStall.signNum" label="门牌号" align="center" width="120"></el-table-column>
        <el-table-column label="操作" align="center" fixed="right" width="200">
          <template slot-scope="scope">
            <el-button type="text" @click="storeGetStoreDetail(scope.row.adminStall.id)" class="btn">详情</el-button>
            <el-button type="text" @click="storeEditStore(scope.row.adminStall.id)" class="btn">编辑</el-button>
            <el-button type="text" @click="storeDelStore(scope.row.adminStall.id)" class="listButtonRed">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>

    <div class="pages">
      <el-pagination
        @current-change="storePageIndexChange"
        :current-page="zcache.page.nowPage"
        :page-size="zcache.page.pageSize"
        layout="total, prev, pager, next, jumper"
        :total="zcache.page.allItem"
      ></el-pagination>
    </div>

    <add-store ref="addStore"></add-store>
    <store-detail ref="storeDetail"></store-detail>

    <!-- 对话框区 -->
    <div class="ztask-dialogs">
      <!-- New -->
      <el-dialog
        title="新建品牌"
        :visible.sync="zcache.status.newDialog"
        width="65%"
        :before-close="dialogNewClose"
      >
        <div class="dialogMain">
          <!-- <el-form :model="zdata.post" label-width="auto" ref="addStore" :rules="zrule"> -->
          <el-form
            :model="zdata.newPost"
            label-width="auto"
            ref="newStore"
            style="border: 0px solid red;"
          >
            <!-- <el-form :model="zdata.post" label-width="auto" ref="createForm" :rules="rules"> -->
            <el-form-item label="品牌名称:" prop="storeName">
              <el-input
                size="small"
                v-model="zdata.newPost.storeName"
                style="width:240px;"
                placeholder="请输入品牌名称"
              />
            </el-form-item>

            <el-form-item label="品牌类型:" prop="storeType">
              <el-select
                size="small"
                v-model="zdata.newPost.storeTypeId"
                placeholder="请选择品牌类型"
                style="width:240px"
              >
                <el-option
                  v-for="item in zlist.storeType"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>

            <el-form-item label="品牌负责人:" prop="people">
              <el-select
                size="small"
                v-model="zdata.newPost.storeBossId"
                placeholder="请选择品牌负责人"
                style="width:240px"
                @change="ztestman"
              >
                <el-option
                  v-for="item in zlist.unGroupMan"
                  :key="item.id"
                  :label="item.userName"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>

            <el-form-item label="所属柜组:" prop="counter">
              <el-select
                size="small"
                v-model="zdata.newPost.storeFromBarId"
                placeholder="请选择所属柜组"
                style="width:240px"
              >
                <el-option
                  v-for="item in zlist.bar"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>

            <el-form-item label="门牌号:" prop="number">
              <el-input
                size="small"
                v-model="zdata.newPost.storeDoorCode"
                style="width:240px"
                placeholder="请输入门牌号"
              />
            </el-form-item>

            <el-form-item label="位置:" prop="area">
              <el-input
                size="small"
                v-model="zdata.newPost.storeAddress"
                style="width:240px"
                placeholder="请输入位置"
              />
            </el-form-item>
          </el-form>
        </div>

        <span slot="footer" class="dialog-footer">
          <el-button size="small" @click="dialogNewCancel">取 消</el-button>
          <!-- <el-button type="primary" @click="addStoreSubmit('createForm')" size="small">确 定</el-button> -->
          <el-button type="primary" @click="dialogNewSubmit" size="small">确 定</el-button>
        </span>
      </el-dialog>

      <!-- See -->
      <el-dialog
        title="品牌详情"
        :visible.sync="zcache.status.seeDialog"
        width="50%"
        :before-close="dialogSeeClose"
      >
        <div class="dialogMain">
          <el-form :model="zdata.see" label-width="120px">
            <el-row>
              <el-col :span="24">
                <el-form-item label="品牌名称：">
                  <el-input
                    :disabled="true"
                    v-model="zdata.see.storeName"
                    autocomplete="off"
                    placeholder="品牌名称缺失"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <el-form-item label="品牌类型：">
                  <el-input
                    :disabled="true"
                    v-model="zdata.see.storeType"
                    autocomplete="off"
                    placeholder="品牌类型为空"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <el-form-item label="所属柜组：">
                  <el-input
                    :disabled="true"
                    v-model="zdata.see.storeFromBar"
                    autocomplete="off"
                    placeholder="柜组信息未知"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <el-form-item label="品牌负责人：">
                  <el-input
                    :disabled="true"
                    v-model="zdata.see.storeBossName"
                    autocomplete="off"
                    placeholder="品牌负责人未知"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <el-form-item label="门牌号：">
                  <el-input
                    :disabled="true"
                    v-model="zdata.see.storeDoorId"
                    autocomplete="off"
                    placeholder="门牌号未知"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <el-form-item label="位置：">
                  <el-input
                    :disabled="true"
                    v-model="zdata.see.storeAddress"
                    autocomplete="off"
                    placeholder="位置未知"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="24">
                <el-form-item label="店员：">
                  <el-table class="list" :data="zdata.see.storeManList" tooltip-effect="dark">
                    <el-table-column type="index" width="50" align="center"></el-table-column>
                    <el-table-column prop="userName" label="品牌名称" align="center"></el-table-column>
                    <el-table-column prop="userId" label="品牌类型" align="center"></el-table-column>
                    <el-table-column prop="mobile" label="品牌类型" align="center"></el-table-column>
                  </el-table>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </div>

        <span slot="footer" class="dialog-footer">
          <el-button size="small" @click="dialogSeeClose">关 闭</el-button>
          <!-- <el-button size="small" type="primary" @click="dialogSeeSubmitSend('seeForm')">任务下发</el-button> -->
        </span>
      </el-dialog>

      <!-- Edit -->
      <el-dialog
        title="编辑品牌"
        :visible.sync="zcache.status.editDialog"
        width="65%"
        :before-close="dialogEditClose"
      >
        <div class="dialogMain">
          <!-- <el-form :model="zdata.post" label-width="auto" ref="addStore" :rules="zrule"> -->
          <el-form
            :model="zdata.editPost"
            label-width="auto"
            ref="editStore"
            style="border: 0px solid red;"
          >
            <!-- <el-form :model="zdata.post" label-width="auto" ref="createForm" :rules="rules"> -->
            <el-form-item label="品牌名称:" prop="storeName">
              <el-input
                size="small"
                v-model="zdata.editPost.storeName"
                style="width:240px;"
                placeholder="请输入品牌名称"
              />
            </el-form-item>

            <el-form-item label="品牌类型:" prop="storeType">
              <el-select
                size="small"
                v-model="zdata.editPost.storeTypeId"
                placeholder="请选择品牌类型"
                style="width:240px"
              >
                <el-option
                  v-for="item in zlist.storeType"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>

            <el-form-item label="品牌负责人:" prop="people">
              <el-select
                size="small"
                v-model="zdata.editPost.storeBossId"
                placeholder="请选择品牌负责人"
                style="width:240px"
              >
                <el-option
                  v-for="item in zlist.unGroupMan"
                  :key="item.id"
                  :label="item.userName"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>

            <el-form-item label="所属柜组:" prop="counter">
              <el-select
                size="small"
                v-model="zdata.editPost.storeFromBarId"
                placeholder="请选择所属柜组"
                style="width:240px"
              >
                <el-option
                  v-for="item in zlist.storeFromBarId"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>

            <el-form-item label="门牌号:" prop="number">
              <el-input
                size="small"
                v-model="zdata.editPost.storeDoorCode"
                style="width:240px"
                placeholder="请输入门牌号"
              />
            </el-form-item>

            <el-form-item label="位置:" prop="area">
              <el-input
                size="small"
                v-model="zdata.editPost.storeAddress"
                style="width:240px"
                placeholder="请输入位置"
              />
            </el-form-item>
          </el-form>
        </div>

        <span slot="footer" class="dialog-footer">
          <el-button size="small" @click="dialogEditCancel">取 消</el-button>
          <!-- <el-button type="primary" @click="addStoreSubmit('createForm')" size="small">确 定</el-button> -->
          <el-button type="primary" @click="dialogEditSubmit" size="small">确 定</el-button>
        </span>
      </el-dialog>
    </div>
  </div>
</template>
<script>
import AddStore from "./components/addStore";
import StoreDetail from "./components/storeDetail";
import {
  ApiStoreGetMainList,
  ApiStoreGetStoreDetail,
  ApiStoreDelStore,
  ApiStoreGetUnGroupManList,
  ApiStoreAddStore,
  ApiStoreEditStore,
  ApiStoreGetBarList,
  ApiStoreSearch
} from "@api/in/store";
import axios from "axios";
const zlog = console.log.bind(console);

export default {
  components: {
    AddStore,
    StoreDetail
  },
  data() {
    return {

      zcache: {
        status: {
          newDialog: false,
          seeDialog: false,
          editDialog: false,
          isSearch: false
        },
        page: {
          allItem: 0,
          pageSize: 10,
          nowPage: 1
        }
      },
      zdata: {
        searchPost: {
          keywords: ""
        },
        newPost: {
          storeName: "",
          storeTypeId: "",
          storeBossId: "",
          storeFromBarId: "",
          storeDoorCode: "",
          storeAddress: ""
        },
        newPostDefault: {
          storeName: "",
          storeTypeId: "",
          storeBossId: "",
          storeFromBarId: "",
          storeDoorCode: "",
          storeAddress: ""
        },
        see: {
          storeName: "storeName",
          storeType: "storeType",
          storeFromBar: "storeFromBar",
          storeBossName: "storeBossName",
          storeDoorId: "storeDoorId",
          storeAddress: "storeAddress",
          storeManList: [
            {
              userName: "Alice",
              userId: "wx0001",
              mobile: "110"
            },
            {
              userName: "Bob",
              userId: "wx0002",
              mobile: "120"
            }
          ]
        },
        edit: {},
        editPost: {
          id: "",
          storeName: "",
          storeTypeId: "",
          storeBossId: "",
          storeFromBarId: "",
          storeDoorCode: "",
          storeAddress: ""
        },
        editPostDefault: {
          id: "",
          storeName: "",
          storeTypeId: "",
          storeBossId: "",
          storeFromBarId: "",
          storeDoorCode: "",
          storeAddress: ""
        }
      },
      zlist: {
        listPick: [],
        storeType: [
          {
            id: "0",
            name: "普通"
          },
          {
            id: "1",
            name: "专柜"
          }
        ],
        storeBossId: [
          {
            id: "2001200138020920001",
            name: "王月云"
          },
          {
            id: "2001200138020930002",
            name: "李强"
          }
        ],
        storeFromBarId: [
          {
            id: "2001201134572130000",
            name: "柜组一号"
          },
          {
            id: "2001201135500920000",
            name: "柜组二号"
          }
        ],
        unGroupMan: [],
        bar: []
      },

      page: {
        currentPage: 1,
        size: 20,
        total: 100
      },
      list: {
        testMain: [
          {
            id: "1001",
            taskName: "2019年男装销售任务",
            taskType: "拉新",
            bar: "男装",
            taskContent: "任务内容任务内容任务内容...",
            sendDate: "2019/02/08"
          },
          {
            id: "1002",
            taskName: "2019年男装销售任务",
            taskType: "拉新",
            bar: "男装",
            taskContent: "任务内容任务内容任务内容...",
            sendDate: "2019/02/08"
          },
          {
            id: "1003",
            taskName: "2019年男装销售任务",
            taskType: "拉新",
            bar: "男装",
            taskContent: "任务内容任务内容任务内容...",
            sendDate: "2019/02/08"
          },
          {
            id: "1003",
            taskName: "2019年男装销售任务",
            taskType: "拉新",
            bar: "男装",
            taskContent: "任务内容任务内容任务内容...",
            sendDate: "2019/02/08"
          },
          {
            id: "1003",
            taskName: "2019年男装销售任务",
            taskType: "拉新",
            bar: "男装",
            taskContent: "任务内容任务内容任务内容...",
            sendDate: "2019/02/08"
          },
          {
            id: "1003",
            taskName: "2019年男装销售任务",
            taskType: "拉新",
            bar: "男装",
            taskContent: "任务内容任务内容任务内容...",
            sendDate: "2019/02/08"
          },
          {
            id: "1003",
            taskName: "2019年男装销售任务",
            taskType: "拉新",
            bar: "男装",
            taskContent: "任务内容任务内容任务内容...",
            sendDate: "2019/02/08"
          }
        ],
        main: [],
        man: [],
        search: {
          bar: [
            {
              id: "1",
              name: "全部"
            },
            {
              id: "2",
              name: "测试"
            }
          ],
          taskType: [
            {
              id: "1",
              name: "全部"
            },
            {
              id: "2",
              name: "测试"
            }
          ]
        },
        listPick: []
      },
      tableHeight: window.innerHeight * 0.5,
      data: {
        search: {
          bar: "",
          taskType: "",
          date: "",
          keys: ""
        },
        page: {
          nowPageNum: 4
        }
      },
      msgId: "",
      detailDialog: false
    };
  },
  watch: {
    // addStoreDialog() {
    addStoreDialog() {
      // if ((this.$refs.addStore.addStoreDialog = false)) {
      //   this.storeGetMainList();
      // }
      
    },
    "": {
      handler: function() {},
      deep: true
    }
  },
  // created() {
  //   this.storeGetMainList();
  //   zlog('--->Created!')
  // },
  mounted() {
    // this.storeGetMainList();
    this.storeSearch();
    this.storeReadyBarList()
    this.storeGetUnGroupManList();
  },
  methods: {
    storeReadyBarList(){
      ApiStoreGetBarList()
      .then(res => {
        this.zlist.bar = res.data
      })
      .catch(err => {

      })
    },
    storeGetUnGroupManList() {
      let postData = {};

      ApiStoreGetUnGroupManList(postData)
        .then(res => {
          this.zlist.unGroupMan = res.data;
        })
        .catch(err => {});
    },
    storeGetBarList() {},
    matchManIdAndManName(inId) {
      let manList = this.list.man;
      let manName = "未知";

      for (let i = 0; i < this.list.man.length; i++) {
        let item = manList[i];
        if (item != null && item.id != null) {
          if (item.id == inId) {
            manName = item.userName;
          }
        }
      }
      return manName;
    },
    transManIdToManName() {
      let mainList = this.list.main;
      let id = "";
      let name = "";

      for (let i = 0; i < mainList.length; i++) {
        if (
          this.list.main[i].adminStall.principal &&
          this.list.main[i].adminStall.principal != null
        ) {
          id = this.list.main[i].adminStall.principal;
          name = this.matchManIdAndManName(id);
          this.list.main[i].adminStall.principal = name;
        } else {
          this.list.main[i].adminStall.principal = "未知";
        }
      }
    },
    storeSearch() {
      if (this.zdata.searchPost.keywords == "") {
        this.zcache.status.isSearch = false;
        this.zcache.page.nowPage = 1;
        this.storeGetMainList();
      } else {
        this.zcache.status.isSearch = true;
        let postData = {
          keyWords: this.zdata.searchPost.keywords,
          pageNum: 1
        };
        ApiStoreSearch(postData)
          .then(res => {
            // let result = [];
            // result.push(res.data.stallInfo);
            // this.list.main = result;
            // this.list.main = res.data.list;
            this.list.main = res.data.pageInfo_adminStalls.list;
            this.zcache.page.allItem = Number(
              res.data.pageInfo_adminStalls.total
            );
            this.zcache.page.pageSize = res.data.pageInfo_adminStalls.pageSize;
            this.zcache.page.nowPage = res.data.pageInfo_adminStalls.pageNum;
          })
          .catch(err => {});
      }
    },
    storeGetMainList() {
      // zlog("--->In Get API!");
      let postData = {
        pageNum: this.zcache.page.nowPage
      };

      ApiStoreGetMainList(postData).then(res => {
        // this.list.main = res.data.pageInfo_adminStalls.list[0];
        // this.list.man = res.data.pageInfo_principals.list[0];
        this.list.main = res.data.pageInfo_adminStalls.list;
        this.list.man = res.data.adminStall_principals;
        this.transManIdToManName();

        this.zcache.page.allItem = Number(res.data.pageInfo_adminStalls.total);
        this.zcache.page.pageSize = res.data.pageInfo_adminStalls.pageSize;
        this.zcache.page.nowPage = res.data.pageInfo_adminStalls.pageNum;
      });
    },
    storePageIndexChange(inData) {
      console.log("--->page: inData =", inData);
      this.zcache.page.nowPage = inData;

      if (this.zcache.status.isSearch) {
        let postData = {
          keyWords: this.zdata.searchPost.keywords,
          pageNum: inData
        };
        ApiStoreSearch(postData)
          .then(res => {
            // let result = [];
            // result.push(res.data.stallInfo);
            // this.list.main = result;
            // this.list.main = res.data.list;
            this.list.main = res.data.pageInfo_adminStalls.list;
            this.zcache.page.allItem = Number(
              res.data.pageInfo_adminStalls.total
            );
            this.zcache.page.pageSize = res.data.pageInfo_adminStalls.pageSize;
            this.zcache.page.nowPage = res.data.pageInfo_adminStalls.pageNum;
          })
          .catch(err => {});
      } else {
        this.zcache.page.nowPage = inData;
        this.storeGetMainList();
      }
    },
    storeGetStoreDetail(inData) {
      let postData = {
        isDetail: true,
        stallId: inData
      };

      ApiStoreGetStoreDetail(postData)
        .then(res => {
          this.zdata.see.storeName = res.data.adminStall.name;
          this.zdata.see.storeType = res.data.adminStall.type;
          // this.zdata.see.storeFromBar = res.data.adminStall.shopId;
          this.zdata.see.storeFromBar = res.data.shopName;
          this.zdata.see.storeBossName = res.data.principal.userName;
          this.zdata.see.storeDoorId = res.data.adminStall.signNum;
          this.zdata.see.storeAddress = res.data.adminStall.location;
          this.zdata.see.storeManList = res.data.clerks_unselected;
        })
        .catch(err => {});

      this.zcache.status.seeDialog = true;
    },
    storeEditStore(inData) {
      this.storeGetUnGroupManList();
      this.zdata.editPost.id = Number(inData);

      let postData = {
        isDetail: true,
        stallId: inData
      };

      ApiStoreGetStoreDetail(postData)
        .then(res => {
          this.zdata.edit = res;

          let timeStoreTypeId = "";
          if (res.data.adminStall.type == "普通") {
            timeStoreTypeId = "0";
          } else {
            timeStoreTypeId = "1";
          }

          this.zdata.editPost.storeName = res.data.adminStall.name;
          this.zdata.editPost.storeTypeId = timeStoreTypeId;
          this.zdata.editPost.storeBossId = res.data.adminStall.principal;
          this.zdata.editPost.storeFromBarId = res.data.adminStall.shopId;
          this.zdata.editPost.storeDoorCode = res.data.adminStall.signNum;
          this.zdata.editPost.storeAddress = res.data.adminStall.location;
        })
        .catch(err => {});

      this.zcache.status.editDialog = true;
    },
    storeDelStore(inData) {
      let delArr = [];
      delArr.push(String(inData));

      let postData = {
        stallIds: delArr
      };

      ApiStoreDelStore(postData)
        .then(res => {
          if (res.result == "success") {
            this.$message({
              message: "删除成功",
              type: "success"
            });
            this.storeGetMainList();
          } else {
            this.$message({
              message: "删除失败！",
              type: "error"
            });
          }
        })
        .catch(err => {
          this.$message({
            message: "删除失败！",
            type: "error"
          });
        });
    },
    listPick(inData) {
      this.zlist.listPick = inData;
    },
    storeDelStoreArr() {
      let delArr = this.zlist.listPick;
      let delIdsArr = [];
      for (let i = 0; i < delArr.length; i++) {
        delIdsArr.push(String(delArr[i].id));
      }
      let postData = {
        stallIds: delIdsArr
      };

      ApiStoreDelStore(postData)
        .then(res => {
          if (res.result == "success") {
            this.$message({
              message: "删除成功",
              type: "success"
            });
            this.storeGetMainList();
          } else {
            this.$message({
              message: "删除失败！",
              type: "error"
            });
          }
        })
        .catch(err => {
          this.$message({
            message: "删除失败！",
            type: "error"
          });
        });
    },

    ztestman(inData){
      console.log('--->ManList =', this.zlist.unGroupMan)
      console.log('--->PickId =', inData, ' type =', typeof(inData))
      // this.zdata.newPost.storeBossId = Number(inData)
    },
    dialogNewClose() {
      this.zcache.status.newDialog = false;
      this.zdata.newPost = JSON.parse(
        JSON.stringify(this.zdata.newPostDefault)
      );
    },
    dialogNewCancel() {
      this.zcache.status.newDialog = false;
      this.zdata.newPost = JSON.parse(
        JSON.stringify(this.zdata.newPostDefault)
      );
    },
    dialogNewSubmit() {
      // console.log('--->PostId =', this.zdata.newPost.storeBossId * 1)
      let postData = {
        name: this.zdata.newPost.storeName,
        // stallType: Number(this.zdata.newPost.storeTypeId),
        stallType: this.zdata.newPost.storeTypeId,
        principal: this.zdata.newPost.storeBossId,
        shopId: this.zdata.newPost.storeFromBarId,
        signNum: this.zdata.newPost.storeDoorCode,
        location: this.zdata.newPost.storeAddress
      };

      console.log("--->postData =", postData);

      ApiStoreAddStore(postData)
        .then(res => {
          if (res.result == "success") {
            this.$message({
              message: "添加成功",
              type: "success"
            });

            this.zcache.status.newDialog = false;
            this.zdata.newPost = JSON.parse(
              JSON.stringify(this.zdata.newPostDefault)
            );
            this.storeSearch();
          }
        })
        .catch(err => {});
    },

    dialogEditClose() {
      this.zcache.status.editDialog = false;
      this.zdata.editPost = JSON.parse(
        JSON.stringify(this.zdata.editPostDefault)
      );
    },
    dialogEditCancel() {
      this.zcache.status.editDialog = false;
      this.zdata.editPost = JSON.parse(
        JSON.stringify(this.zdata.editPostDefault)
      );
    },
    dialogEditSubmit() {
      let postData = {
        stallId: Number(this.zdata.editPost.id),
        name: this.zdata.editPost.storeName,
        type: String(this.zdata.editPost.storeTypeId),
        principal: Number(this.zdata.editPost.storeBossId),
        shopId: Number(this.zdata.editPost.storeFromBarId),
        signNum: String(this.zdata.editPost.storeDoorCode),
        location: this.zdata.editPost.storeAddress
      };

      ApiStoreEditStore(postData)
        .then(res => {
          if (res.result == "success") {
            this.$message({
              message: "编辑成功",
              type: "success"
            });
            this.zdata.editPost = JSON.parse(
              JSON.stringify(this.zdata.editPostDefault)
            );
            this.zcache.status.editDialog = false;
            this.storeGetMainList();
          } else {
            this.$message({
              message: "编辑失败！",
              type: "error"
            });
          }
        })
        .catch(err => {
          this.$message({
            message: "编辑失败！",
            type: "error"
          });
        });
    },

    testButtonClick() {},
    pagesSizeChange() {},
    pagesNowPageChange() {},
    setListsHeadStyle({ row, column, rowIndex, columnIndex }) {
      if (rowIndex === 0) {
        return "background-color: #0B0F32; border-right: 1px solid white;color: white;";
      } else {
        return "";
      }
    },
    addStore() {
      // this.$refs.addStore.addStoreDialog = true;
      this.zcache.status.newDialog = true;
    },
    handleDetail() {
      this.$refs.storeDetail.detailDialog = true;
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
    },

    dialogSeeClose() {
      this.zcache.status.seeDialog = false;
    }
  }
};
</script>
<style lang="scss" scoped>
.btn {
  font-size: 14px;
  font-weight: bold;
  color: rgba(102, 102, 102, 1);
}
.main {
  position: relative;
  background-color: #fff;
  box-sizing: border-box;
  height: 100%;
  padding: 0px 16px 16px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  width: 100%;
  box-shadow: 0px 2px 4px 0px #ddd;
}

.buttons {
  width: 266px;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}
.buttonlight {
  background-color: #e8e9fe;
  color: #4e59c7;
  border: 1px solid #4e59c7;
  box-sizing: border-box;
}
.buttondark {
  width: 88px;
  height: 32px;
  background-color: #4e59c7;
  color: #ffffff;
  border: 1px solid #4e59c7;
  box-sizing: border-box;
}
.searchzone {
  height: 40px;
  width: auto;
  min-width: 654px;
  text-align: right;
}
.lists {
  height: auto;
  min-height: 70%;
  width: 100%;
  margin-top: 20px;
}
.listButtonRed {
  color: #d0021b;
  font-weight: bold;
}
.pages {
  height: 40px;
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
}
.title {
  height: 48px;
  line-height: 48px;
  color: rgba(56, 56, 56, 1);
  border-bottom: 1px solid #f8f8f8;
  margin-bottom: 16px;
}
</style>