|
|
<template> <div class="mod-config"> <el-form v-model="searchData"> <el-form :inline="true" label-position="top" label-width="100px" style="margin-top: 5px;" > <el-form-item :label="'店铺名称：'"> <el-input v-model="searchData.shopName" style="width: 120px"></el-input> </el-form-item> <el-form-item :label="'店铺编号：'"> <el-input v-model="searchData.shopId" style="width: 120px"></el-input> </el-form-item> <el-form-item :label="' '"> <el-button @click="refreshPageTables()" style="margin-left: 0px" type="primary">查询</el-button> <el-button @click="addOrUpdateModal('Y')" style="margin-left: 14px" type="primary">新增</el-button> <el-button @click="addOrUpdateModal('N')" style="margin-left: 14px" type="primary">修改</el-button> </el-form-item> <el-form-item :label="' '"> <download-excel :fields="fields()" type="xls" :name="exportName" :fetch="createExportData" worksheet="导出信息" class="el-button el-button--primary el-button--medium"> {{ '导出' }} </download-excel> </el-form-item> </el-form> </el-form> <el-table :height="height" :data="tableData" ref="fileTable" highlight-current-row @row-click="setCurrentRow" @current-change="changeCurrentRow" border style="width: 100%"> <el-table-column v-for="(item,index) in columnList" :key="index" :sortable="item.columnSortable" :prop="item.columnProp" header-align="center" :show-overflow-tooltip="item.showOverflowTooltip" :align="item.align" :fixed="item.fixed==''?false:item.fixed" :min-width="item.columnWidth" :label="item.columnLabel"> <template slot-scope="scope"> <span v-if="!item.columnHidden"> {{ scope.row[item.columnProp] }}</span> <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]" style="width: 100px; height: 80px"/></span> </template> </el-table-column>
</el-table> <!--新增或者修改--><comAddUpdateShopStore ref="comAddUpdateShopStore" @refreshPageTables="refreshPageTables" v-drag></comAddUpdateShopStore> </div>
</template>
<script>import comAddUpdateShopStore from "./com_add_update_shop_store";import { getShopStores, insertShopStore, saveShopStore,} from '@/api/jst/shop_store.js'import Vue from 'vue'
export default { name: 'salesOrder', data () { return { // 导出+动态列 start
exportData: [], exportName: '店铺映射表' + this.getStrDate(), columnList: [ { tableId: 'shopStoreHist', tableName: this.$route.meta.title, columnProp: 'contract', columnLabel: '域', columnHidden: false, columnImage: false, columnSortable: false, columnWidth: 30, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: 'left' }, { tableId: 'shopStoreHist', tableName: this.$route.meta.title, columnProp: 'shopSite', columnLabel: '店铺站点', columnHidden: false, columnImage: false, columnSortable: false, columnWidth: 60, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: 'left' }, { tableId: 'shopStoreHist', tableName: this.$route.meta.title, columnProp: 'shopId', columnLabel: '店铺编号', columnHidden: false, columnImage: false, columnSortable: false, columnWidth: 60, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: 'left' }, { tableId: 'shopStoreHist', tableName: this.$route.meta.title, columnProp: 'shopName', columnLabel: '店铺名称', columnHidden: false, columnImage: false, columnSortable: false, columnWidth: 120, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: 'left' }, { tableId: 'shopStoreHist', tableName: this.$route.meta.title, columnProp: 'customerNo', columnLabel: '客户编号', columnHidden: false, columnImage: false, columnSortable: false, columnWidth: 60, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: 'left' }, { tableId: 'shopStoreHist', tableName: this.$route.meta.title, columnProp: 'pureCustom', columnLabel: '区分纯电商', columnHidden: false, columnImage: false, columnSortable: false, columnWidth: 60, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: 'left' }, { tableId: 'shopStoreHist', tableName: this.$route.meta.title, columnProp: 'distinguishCustom', columnLabel: '区分客户', columnHidden: false, columnImage: false, columnSortable: false, columnWidth: 60, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: 'left' }, { tableId: 'shopStoreHist', tableName: this.$route.meta.title, columnProp: 'consignmentFlag', columnLabel: '区分寄售', columnHidden: false, columnImage: false, columnSortable: false, columnWidth: 60, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: 'left' }, { tableId: 'shopStoreHist', tableName: this.$route.meta.title, columnProp: 'orderType', columnLabel: '订单类型', columnHidden: false, columnImage: false, columnSortable: false, columnWidth: 60, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: 'right' }, { tableId: 'shopStoreHist', tableName: this.$route.meta.title, columnProp: 'salesmanCode', columnLabel: '销售员', columnHidden: false, columnImage: false, columnSortable: false, columnWidth: 60, format: null, functionId: this.$route.meta.menuId, sortLv: 0, status: true, fixed: '', serialNumber: null, columnType: null, align: 'right' }, ], currentRow:{}, visible: false, // 导出 end
height: 200, tableData: [], searchData: { shopName: '', shopId: '', }, } },
components: { comAddUpdateShopStore,/*新增或修改*/ }, mounted () { this.$nextTick(() => { this.height = window.innerHeight - 150 }) }, methods: { refreshPageTables () { getShopStores(this.searchData).then(({data}) => { this.tableData = data.rows; if(data.total > 0){ //设置选中行
this.$refs.fileTable.setCurrentRow(this.tableData[0]); } }) },
/*设置工艺的行*/ setCurrentRow(row, column, event) { this.currentRow = row; },
// 选中记录
/*当前值发生变化的时候修改*/ changeCurrentRow(row, oldRow){ //判断是否是获取焦点的事件
if(row){ this.currentRow = JSON.parse(JSON.stringify(row)); } },
// 导出+动态列
fields () { let json = '{' this.columnList.forEach((item, index) => { if (index === this.columnList.length - 1) { json += '"' + item.columnLabel + '"' + ':' + '"' + item.columnProp + '"' } else { json += '"' + item.columnLabel + '"' + ':' + '"' + item.columnProp + '"' + ',' } }) json += '}' return eval('(' + json + ')') }, createExportData () { // 点击导出按钮之后,开始导出数据之前的执行函数,返回值为需要下载的数据
return this.tableData }, getStrDate () { let dd = new Date() let Y = dd.getFullYear() let M = (dd.getMonth() + 1) < 10 ? '0' + (dd.getMonth() + 1) : (dd.getMonth() + 1)// 获取当前月份的日期，不足10补0
let D = dd.getDate() < 10 ? '0' + dd.getDate() : dd.getDate()// 获取当前几号，不足10补0
let H = dd.getHours() < 10 ? '0' + dd.getHours() : dd.getHours() let MM = dd.getMinutes() < 10 ? '0' + dd.getMinutes() : dd.getMinutes() let S = dd.getSeconds() < 10 ? '0' + dd.getSeconds() : dd.getSeconds() return Y + M + D + H + MM + S },
/*新增或修改的modal*/ addOrUpdateModal(addFlag){ //打开组件 去做新增业务
this.$nextTick(() => { //区分是否是新增
if('Y' === addFlag){ this.$refs.comAddUpdateShopStore.init({}, addFlag); }else{ this.$refs.comAddUpdateShopStore.init(this.currentRow, addFlag); } }) },
},
created() { this.refreshPageTables(); // this.getLanguageList()
} }</script>
<style scoped>
</style>
|
