| | |
| | | <template> |
| | | <div class="userList"> |
| | | <myAside /> |
| | | <div class="right"> |
| | | <header> |
| | | <div class="headerContent"> |
| | | <div class="find"> |
| | | <div class="search-item"> |
| | | <span>输入查询:</span> |
| | | <el-input style="flex: 1" placeholder="请输入店铺编号" v-model="storeCode" slot="prefix"></el-input> |
| | | </div> |
| | | <div class="search-item"> |
| | | <span>店铺状态:</span> |
| | | <el-select v-model="storeStatus" placeholder="选择店铺状态"> |
| | | <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" /> |
| | | </el-select> |
| | | </div> |
| | | <div class="findBtn"> |
| | | <el-button type="primary" @click="search" icon="el-icon-search">查询</el-button> |
| | | <el-button icon="el-icon-delete-solid" @click="handleReset">重置</el-button> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </header> |
| | | <main> |
| | | <!-- 数据展示 --> |
| | | <el-table ref="multipleTable" |
| | | :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}" |
| | | :data="tableData" style="width: 100%" :row-class-name="tableRowClassName"> |
| | | <el-table-column type="selection" min-width="5"> |
| | | </el-table-column> |
| | | <el-table-column prop="storeNumber" label="店铺编号" min-width="10"> |
| | | </el-table-column> |
| | | <el-table-column prop="storeName" label="店铺名称" min-width="10"> |
| | | </el-table-column> |
| | | <el-table-column prop="owner" label="店铺联系人" min-width="10"> |
| | | </el-table-column> |
| | | <el-table-column prop="contact" label="店铺联系电话" min-width="10"> |
| | | </el-table-column> |
| | | <el-table-column prop="storeAddress" label="店铺详细地址" min-width="10"> |
| | | </el-table-column> |
| | | <el-table-column prop="relationVideo" label="关联摄像机" min-width="10"> |
| | | </el-table-column> |
| | | <el-table-column prop="operation" label="操作" min-width="20"> |
| | | <template slot-scope="scope"> |
| | | <div class="operation"> |
| | | <el-link icon="el-icon-edit" :underline="false" @click="handleView(scope.row, 'update')">编辑</el-link> |
| | | <el-link class="leftPx" icon="el-icon-delete-solid" :underline="false" @click="handleDelete(scope.row.id)">删除</el-link> |
| | | <el-link class="leftPx" icon="el-icon-edit" :underline="false">推送信息</el-link> |
| | | <el-link class="leftPx" icon="el-icon-edit" :underline="false" @click="handleView(scope.row, 'view')">查看</el-link> |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <!-- 查看修改页面 --> |
| | | <el-dialog :visible.sync="dialogUpdate" width="45%" |
| | | :title="updateFlag ? '修改店铺信息' : '查看店铺信息'" :before-close="handleClose"> |
| | | <updateUser :updateFlag="updateFlag" :storeInfo="storeInfo" @closeDialog="closeDialog" /> |
| | | </el-dialog> |
| | | <!-- 分页 --> |
| | | <div class="pagination"> |
| | | <el-pagination background :current-page="currentPage" layout="prev, pager, next" :total="totalNum" |
| | | :page-size="pageSize" @current-change="changeCurrentPage"> |
| | | </el-pagination> |
| | | </div> |
| | | </main> |
| | | </div> |
| | | <myAside @selectedDepartment="selectedDepartment" /> |
| | | <store-content :model="'three-pack'" /> |
| | | </div> |
| | | </template> |
| | | <script> |
| | | import myAside from "./components/aside"; |
| | | import updateUser from "@/views/operate/fivepack/threepack/components/updateUser"; |
| | | import storeContent from "@/views/operate/fivepack/threepack/components/content"; |
| | | import { getStoreInfoList, deleteStoreInfo } from "@/api/operate/storeManagement"; |
| | | import { SUCCESS_CODE } from "@/utils"; |
| | | |
| | | export default { |
| | | components: { myAside, updateUser }, |
| | | components: { myAside, storeContent, updateUser }, |
| | | |
| | | created() { |
| | | this.search(); |
| | |
| | | return { |
| | | storeCode: null, |
| | | storeStatus: null, |
| | | options: [{ label: '经营', value: 1 }, { label: '倒闭', value: 2 }], |
| | | options: [{ label: '全部', value: 0 }, { label: '经营', value: 1 }, { label: '倒闭', value: 2 }], |
| | | tableData: [], |
| | | dialogUpdate: false, |
| | | currentPage: 1, |
| | |
| | | }, |
| | | |
| | | methods: { |
| | | search() { |
| | | getStoreInfoList({ keyword: this.storeCode }) |
| | | search(data) { |
| | | let communityId, streetId; |
| | | if (data) { |
| | | communityId = data.parentId; |
| | | streetId = data.id; |
| | | } |
| | | getStoreInfoList({ keyword: this.storeCode, communityId, streetId }) |
| | | .then(({ list, pageSize, totalPage }) => { |
| | | this.tableData = list; |
| | | this.pageSize = pageSize; |
| | |
| | | return "success-row"; |
| | | } |
| | | }, |
| | | selectedDepartment(data) { |
| | | if (!data.children) { |
| | | this.search(); |
| | | } |
| | | } |
| | | } |
| | | } |
| | | </script> |