地图 仓库

master
lion 2 months ago
parent 441cd0f9ef
commit b139e37275

@ -282,7 +282,10 @@ export default {
// })
// domecharts
console.log('streetNameList', this.streetNameList)
this.myChart = echarts.init(document.getElementById('chart'))
//
if (!this.myChart) {
this.myChart = echarts.init(document.getElementById('chart'))
}
echarts.registerMap('GX', jtmap)
//
this.myChart.setOption({
@ -599,18 +602,110 @@ export default {
console.log('resetToFullMap - warehouseData:', this.warehouseData);
console.log('resetToFullMap - warehouseData.length:', this.warehouseData ? this.warehouseData.length : 0);
// drawChart
this.drawChart();
//
if (this.myChart) {
this.myChart.dispose(); //
}
//
this.myChart = echarts.init(document.getElementById('chart'));
echarts.registerMap('GX', jtmap);
//
this.myChart.setOption({
//
tooltip: {
trigger: 'item',
position: 'right',
enterable: true,
triggerOn: 'click',
formatter: (val) => {
console.log('val', val)
this.hookToolTip = val
}
},
geo: {
map: 'GX',
roam: true,
zoom: 1.1,
center: [120.585294, 31.299758],
label: {
normal: {
show: false,
fontSize: '0',
color: 'rgba(0,0,0,0.7)'
}
},
itemStyle: {
normal: {
borderColor: 'rgba(0, 0, 0, 0.2)'
},
emphasis: {
shadowOffsetX: 0,
shadowOffsetY: 0,
shadowBlur: 20,
borderWidth: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
},
regions: [
{ name: '相城区', itemStyle: { normal: { areaColor: '#1890ff' }, emphasis: { areaColor: '#1890ff' } } },
{ name: '姑苏区', itemStyle: { normal: { areaColor: '#40a9ff' }, emphasis: { areaColor: '#40a9ff' } } },
{ name: '虎丘区', itemStyle: { normal: { areaColor: '#2f54eb' }, emphasis: { areaColor: '#2f54eb' } } },
{ name: '吴中区', itemStyle: { normal: { areaColor: '#1d39c4' }, emphasis: { areaColor: '#1d39c4' } } },
{ name: '园区', itemStyle: { normal: { areaColor: '#5d39e9' }, emphasis: { areaColor: '#5d39e9' } } },
{ name: '太仓市', itemStyle: { normal: { areaColor: '#597ef7' }, emphasis: { areaColor: '#597ef7' } } },
{ name: '昆山市', itemStyle: { normal: { areaColor: '#10239e' }, emphasis: { areaColor: '#10239e' } } },
{ name: '常熟市', itemStyle: { normal: { areaColor: '#69c0ff' }, emphasis: { areaColor: '#69c0ff' } } },
{ name: '张家港市', itemStyle: { normal: { areaColor: '#0050b3' }, emphasis: { areaColor: '#0050b3' } } },
{ name: '吴江区', itemStyle: { normal: { areaColor: '#096dd9' }, emphasis: { areaColor: '#096dd9' } } }
]
},
series: [{
name: '区域',
type: 'map',
map: 'GX',
geoIndex: 0,
markPoint: {
symbol: '',
symbolSize: [10, 10],
symbolOffset: [0, 0],
label: {
position: 'center',
color: '#333',
textAlign: 'center',
padding: [5, 10],
borderRadius: 20,
borderWidth: 1,
borderColor: '#096dd9',
backgroundColor: '#fff',
formatter(val) {
return val.data.name
}
},
data: this.streetNameList
}
}]
});
//
if (this.warehouseData && this.warehouseData.length > 0) {
this.updateWarehouseData(this.warehouseData);
}
//
this.myChart.resize();
//
this.myChart.on('click', params => {
if (params.componentType === 'series' && params.seriesType === 'map') {
const areaName = params.name;
const areaObj = this.streetNameList.find(item => item.name === areaName);
if (areaObj) {
this.currentArea = areaObj;
this.zoomToArea(areaObj);
}
}
});
console.log('返回全图完成,仓库点位已清除,仓库数量应显示');
console.log('返回全图完成,地图已完全重新加载,仓库点位已清除');
},
updateWarehouseData(warehouseData) {
//

@ -1,14 +1,14 @@
<template>
<div>
<xy-dialog
ref="dialog"
:width="70"
:is-show.sync="isShow"
type="form"
:title="type==='add'?'新增':'编辑'"
<xy-dialog
ref="dialog"
:width="70"
:is-show.sync="isShow"
type="form"
:title="type==='add'?'新增':'编辑'"
:form="form"
:rules="rules"
@submit="submit"
:rules="rules"
@submit="submit"
>
<!-- <template v-slot:storehouses_id>
@ -44,28 +44,40 @@
</div>
</div>
</template>
<template v-slot:shifouzili>
<div class="xy-table-item">
<div class="xy-table-item-label">
<span style="color: red;font-weight: 600;padding-right: 4px;" />是否纳入物资管理
</div>
<div class="xy-table-item-content">
<el-select v-model="form.shifouzili" style="width:300px" placeholder="请选择">
<el-option v-for="item in [{id:'',value:''},{id:'',value:''}]" :key="item.id" :label="item.value" :value="item.value" />
</el-select>
</div>
</div>
</template>
<template v-slot:sort>
<div class="xy-table-item">
<div class="xy-table-item-label">
<span style="color: red;font-weight: 600;padding-right: 4px;" />排序
</div>
<div class="xy-table-item-content">
<el-input v-model="form.sort" style="width:300px" type="number" />
</div>
</div>
</template>
<template v-slot:shifouzili>
<div class="xy-table-item">
<div class="xy-table-item-label">
<span style="color: red;font-weight: 600;padding-right: 4px;" />是否纳入物资管理
</div>
<div class="xy-table-item-content">
<el-select v-model="form.shifouzili" style="width:300px" placeholder="请选择">
<el-option v-for="item in [{id:'',value:''},{id:'',value:''}]" :key="item.id" :label="item.value" :value="item.value" />
</el-select>
</div>
</div>
</template>
<template v-slot:shifouxunihuojia>
<div class="xy-table-item">
<div class="xy-table-item-label">
<span style="color: red;font-weight: 600;padding-right: 4px;" />是否显示虚拟货架
</div>
<div class="xy-table-item-content">
<el-select v-model="form.shifouxunihuojia" style="width:300px" placeholder="请选择">
<el-option v-for="item in [{id:'',value:''},{id:'',value:''}]" :key="item.id" :label="item.value" :value="item.value" />
</el-select>
</div>
</div>
</template>
<template v-slot:sort>
<div class="xy-table-item">
<div class="xy-table-item-label">
<span style="color: red;font-weight: 600;padding-right: 4px;" />排序
</div>
<div class="xy-table-item-content">
<el-input v-model="form.sort" style="width:300px" type="number" />
</div>
</div>
</template>
<template v-slot:suozaiquyu>
<div class="xy-table-item">
@ -85,13 +97,13 @@
<span style="color: red;font-weight: 600;padding-right: 4px;" />建设时间
</div>
<div class="xy-table-item-content">
<el-date-picker
v-model="form.jiansheniandai"
style="width:300px"
value-format="yyyy"
<el-date-picker
v-model="form.jiansheniandai"
style="width:300px"
value-format="yyyy"
format="yyyy"
type="year"
placeholder="选择年"
type="year"
placeholder="选择年"
/>
</div>
</div>
@ -133,11 +145,11 @@
<span style="color: red;font-weight: 600;padding-right: 4px;" />仓库地址
</div>
<div class="xy-table-item-content">
<avue-input-map
v-model="mapform"
:params="mapparams"
<avue-input-map
v-model="mapform"
:params="mapparams"
style="width:300px"
placeholder="请选择地图"
placeholder="请选择地图"
/>
</div>
</div>
@ -178,80 +190,80 @@
<span style="color: red;font-weight: 600;padding-right: 4px;" />仓库概览图
</div>
<div class="xy-table-item-content">
<el-upload
class="upload-demo"
:action="action"
:on-success="handleSuccess"
<el-upload
class="upload-demo"
:action="action"
:on-success="handleSuccess"
:on-remove="handleRemove"
multiple
:limit="1"
:file-list="fileList"
multiple
:limit="1"
:file-list="fileList"
>
<el-button size="small" type="primary">点击上传</el-button>
<!-- <div slot="tip" class="el-upload__tip">只能上传jpg/png文件且不超过500kb</div> -->
</el-upload>
</div>
</div>
</template>
<template v-if="form.shifouzili===''" v-slot:zhizefengong>
<div class="xy-table-item">
<div class="xy-table-item-label">
<span style="color: red;font-weight: 600;padding-right: 4px;" />职责分工
</div>
<div class="xy-table-item-content">
<el-input v-model="form.zhizefengong" style="width: 300px;" type="textarea" />
</div>
</div>
</template>
<template v-if="form.shifouzili===''" v-slot:zhibananpai>
<div class="xy-table-item">
<div class="xy-table-item-label">
<span style="color: red;font-weight: 600;padding-right: 4px;" />值班安排
</div>
<div class="xy-table-item-content">
<el-input v-model="form.zhibananpai" style="width: 300px;" type="textarea" />
</div>
</div>
</template>
<template v-if="form.shifouzili===''" v-slot:huojiaxitong>
<div class="xy-table-item">
<div class="xy-table-item-label">
<span style="color: red;font-weight: 600;padding-right: 4px;" />货架系统
</div>
<div class="xy-table-item-content">
<el-input v-model="form.huojiaxitong" style="width: 300px;" type="textarea" />
</div>
</div>
</template>
<template v-if="form.shifouzili===''" v-slot:zhuangxieshebei>
<div class="xy-table-item">
<div class="xy-table-item-label">
<span style="color: red;font-weight: 600;padding-right: 4px;" />装卸设备
</div>
<div class="xy-table-item-content">
<el-input v-model="form.zhuangxieshebei" style="width: 300px;" type="textarea" />
</div>
</div>
</template>
<template v-if="form.shifouzili===''" v-slot:wenkongshebei>
<div class="xy-table-item">
<div class="xy-table-item-label">
<span style="color: red;font-weight: 600;padding-right: 4px;" />温控设备
</div>
<div class="xy-table-item-content">
<el-input v-model="form.wenkongshebei" style="width: 300px;" type="textarea" />
</div>
</div>
</template>
<template v-if="form.shifouzili===''" v-slot:jiankongxitong>
<div class="xy-table-item">
<div class="xy-table-item-label">
<span style="color: red;font-weight: 600;padding-right: 4px;" />监控系统
</div>
<div class="xy-table-item-content">
<el-input v-model="form.jiankongxitong" style="width: 300px;" type="textarea" />
</div>
</div>
</template>
<template v-if="form.shifouzili===''" v-slot:zhizefengong>
<div class="xy-table-item">
<div class="xy-table-item-label">
<span style="color: red;font-weight: 600;padding-right: 4px;" />职责分工
</div>
<div class="xy-table-item-content">
<el-input v-model="form.zhizefengong" style="width: 300px;" type="textarea" />
</div>
</div>
</template>
<template v-if="form.shifouzili===''" v-slot:zhibananpai>
<div class="xy-table-item">
<div class="xy-table-item-label">
<span style="color: red;font-weight: 600;padding-right: 4px;" />值班安排
</div>
<div class="xy-table-item-content">
<el-input v-model="form.zhibananpai" style="width: 300px;" type="textarea" />
</div>
</div>
</template>
<template v-if="form.shifouzili===''" v-slot:huojiaxitong>
<div class="xy-table-item">
<div class="xy-table-item-label">
<span style="color: red;font-weight: 600;padding-right: 4px;" />货架系统
</div>
<div class="xy-table-item-content">
<el-input v-model="form.huojiaxitong" style="width: 300px;" type="textarea" />
</div>
</div>
</template>
<template v-if="form.shifouzili===''" v-slot:zhuangxieshebei>
<div class="xy-table-item">
<div class="xy-table-item-label">
<span style="color: red;font-weight: 600;padding-right: 4px;" />装卸设备
</div>
<div class="xy-table-item-content">
<el-input v-model="form.zhuangxieshebei" style="width: 300px;" type="textarea" />
</div>
</div>
</template>
<template v-if="form.shifouzili===''" v-slot:wenkongshebei>
<div class="xy-table-item">
<div class="xy-table-item-label">
<span style="color: red;font-weight: 600;padding-right: 4px;" />温控设备
</div>
<div class="xy-table-item-content">
<el-input v-model="form.wenkongshebei" style="width: 300px;" type="textarea" />
</div>
</div>
</template>
<template v-if="form.shifouzili===''" v-slot:jiankongxitong>
<div class="xy-table-item">
<div class="xy-table-item-label">
<span style="color: red;font-weight: 600;padding-right: 4px;" />监控系统
</div>
<div class="xy-table-item-content">
<el-input v-model="form.jiankongxitong" style="width: 300px;" type="textarea" />
</div>
</div>
</template>
</xy-dialog>
@ -275,8 +287,8 @@ export default {
return {
isShow: false,
type: 'add',
id: '',
action: `${process.env.VUE_APP_UPLOAD_API}`,
id: '',
action: `${process.env.VUE_APP_UPLOAD_API}`,
fileList: [],
tableName: 'materialstorages',
// flood_storages
@ -289,8 +301,9 @@ export default {
form: {
storehouses_id: '',
cangkumingcheng: '',
cangkubianma: '',
shifouzili: '否',
cangkubianma: '',
shifouzili: '否',
shifouxunihuojia: '否', //
sort: 0,
suozaiquyu: '',
jiansheniandai: '',
@ -301,12 +314,12 @@ export default {
jingdu: '',
weidu: '',
cangkujianjie: '',
image_id: '',
zhizefengong: '',
zhibananpai: '',
huojiaxitong: '',
zhuangxieshebei: '',
wenkongshebei: '',
image_id: '',
zhizefengong: '',
zhibananpai: '',
huojiaxitong: '',
zhuangxieshebei: '',
wenkongshebei: '',
jiankongxitong: '',
quyu_id: ''
},
@ -332,7 +345,7 @@ export default {
} else {
this.id = ''
this.type = ''
this.mapform = []
this.mapform = []
this.fileList = []
this.$refs['dialog'].reset()
}
@ -374,33 +387,33 @@ export default {
id: this.id,
table_name: this.tableName
})
this.$integrateData(this.form, res)
this.$integrateData(this.form, res)
this.form.sort = res.sort ? res.sort : 0
this.mapform = [res.jingdu, res.weidu, res.cangkudizhi]
if (res.image_id_uploads_id_relation) {
this.fileList.push(res.image_id_uploads_id_relation)
this.mapform = [res.jingdu, res.weidu, res.cangkudizhi]
if (res.image_id_uploads_id_relation) {
this.fileList.push(res.image_id_uploads_id_relation)
}
},
handleRemove(file, fileList) {
this.fileList = fileList
},
handleSuccess(response, file, fileList) {
this.fileList = fileList
handleRemove(file, fileList) {
this.fileList = fileList
},
submit() {
console.log(this.fileList)
this.form.image_id = ''
if (this.fileList.length > 0) {
for (var g of this.fileList) {
if (g.response) {
this.form.image_id = g.response.id
} else {
this.form.image_id = g.id
}
}
} else {
this.form.image_id = ''
}
handleSuccess(response, file, fileList) {
this.fileList = fileList
},
submit() {
console.log(this.fileList)
this.form.image_id = ''
if (this.fileList.length > 0) {
for (var g of this.fileList) {
if (g.response) {
this.form.image_id = g.response.id
} else {
this.form.image_id = g.id
}
}
} else {
this.form.image_id = ''
}
if (this.type === 'add') {
save({
@ -412,7 +425,7 @@ export default {
message: '新增成功'
})
this.$emit('refresh')
this.isShow = false
this.isShow = false
})
return
}
@ -441,4 +454,4 @@ export default {
::v-deep .xy-table-item-label {
min-width: 160px !important
}
</style>
</style>

@ -4,24 +4,27 @@
<lx-header icon="md-apps" text="仓库管理" style="margin-bottom: 10px; border: 0px; margin-top: 15px">
<slot>
<div style="display: flex;justify-content: flex-start;flex-wrap: wrap;">
<Input v-model="select.keyword" style="width: 200px;margin-right: 10px;" placeholder="名称搜索" />
<!-- <Select @on-change="clearType" v-model="select.storehouses_id" style="width: 200px;margin-right: 10px;" placeholder="仓库类型" clearable>
<Option v-for="item in typelist" :key="item.id" :value="item.id">{{ item.name }}</Option>
</Select> -->
<Select v-model="select.area" style="width: 200px;margin-right: 10px;" placeholder="所在区域" clearable @on-change="clearArea">
<Option v-for="item in areaList" :key="item.id" :value="item.id">{{ item.value }}</Option>
</Select>
<Select v-model="select.shifouzili" style="width: 200px;margin-right: 10px;" placeholder="是否纳入物资管理" clearable>
<Option v-for="item in [{id:'是',value:'是'},{id:'否',value:'否'}]" :key="item.id" :value="item.id">{{ item.value }}</Option>
<Input v-model="select.keyword" style="width: 200px;margin-right: 10px;" placeholder="名称搜索" />
<!-- <Select @on-change="clearType" v-model="select.storehouses_id" style="width: 200px;margin-right: 10px;" placeholder="仓库类型" clearable>
<Option v-for="item in typelist" :key="item.id" :value="item.id">{{ item.name }}</Option>
</Select> -->
<Select v-model="select.area" style="width: 200px;margin-right: 10px;" placeholder="所在区域" clearable @on-change="clearArea">
<Option v-for="item in areaList" :key="item.id" :value="item.id">{{ item.value }}</Option>
</Select>
<Select v-model="select.shifouzili" style="width: 200px;margin-right: 10px;" placeholder="是否纳入物资管理" clearable>
<Option v-for="item in [{id:'是',value:'是'},{id:'否',value:'否'}]" :key="item.id" :value="item.id">{{ item.value }}</Option>
</Select>
<Select v-model="select.shifouxunihuojia" style="width: 200px;margin-right: 10px;" placeholder="是否显示虚拟货架" clearable>
<Option v-for="item in [{id:'是',value:'是'},{id:'否',value:'否'}]" :key="item.id" :value="item.id">{{ item.value }}</Option>
</Select>
<Button type="primary" @click="select.page=1,getList()"></Button>
<Button
type="primary"
style="margin-left: 10px;"
@click="$refs['addStorage'].type='add',
<Button
type="primary"
style="margin-left: 10px;"
@click="$refs['addStorage'].type='add',
$refs['addStorage'].typelist = typelist,
$refs['addStorage'].isShow=true"
>添加</Button>
$refs['addStorage'].isShow=true"
>添加</Button>
<!-- <Button icon="ios-add" type="primary" style="margin-left: 10px;"
@click="$refs['imports'].show()">导入</Button> -->
</div>
@ -29,33 +32,33 @@
</lx-header>
</div>
<xy-table
:list="list"
:total="total"
:table-item="table"
<xy-table
:list="list"
:total="total"
:table-item="table"
@pageSizeChange="pageSizeChange"
@pageIndexChange="pageChange"
>
<template v-slot:huojia>
<el-table-column label="货架信息" align="center" width="120" header-align="center">
<template slot-scope="scope">
<div>
<Button type="primary" size="small" @click="showHuojia(scope.row)"></Button>
</div>
</template>
</el-table-column>
@pageIndexChange="pageChange"
>
<template v-slot:huojia>
<el-table-column label="货架信息" align="center" width="120" header-align="center">
<template slot-scope="scope">
<div>
<Button type="primary" size="small" @click="showHuojia(scope.row)"></Button>
</div>
</template>
</el-table-column>
</template>
<template v-slot:btns>
<el-table-column fixed="right" label="操作" align="center" width="120" header-align="center">
<template slot-scope="scope">
<div>
<Button
type="primary"
size="small"
<Button
type="primary"
size="small"
@click="$refs['addStorage'].type='editor',
$refs['addStorage'].id=scope.row.id,$refs['addStorage'].typelist = typelist,
$refs['addStorage'].isShow=true"
$refs['addStorage'].isShow=true"
>编辑</Button>
<Poptip transfer confirm title="确认要删除吗?" @on-ok="delRow(scope.row.id)">
<Button type="error" style="margin-left: 10px;" size="small" ghost>删除</Button>
@ -66,7 +69,7 @@
</template>
</xy-table>
<addStorage ref="addStorage" @refresh="getList" />
<addStorage ref="addStorage" @refresh="getList" />
<shelf ref="shelf" />
</div>
@ -76,32 +79,33 @@
import {
index,
destroy
} from '@/api/system/baseForm.js'
} from '@/api/system/baseForm.js'
import { getStorehouseTypeList } from '@/api/system/storehouseType'
import addStorage from './components/addStorage.vue'
import {
getparameteritem
} from '@/api/system/dictionary.js'
import addStorage from './components/addStorage.vue'
import {
getparameteritem
} from '@/api/system/dictionary.js'
import shelf from './components/shelf.vue'
export default {
components: {
addStorage,
addStorage,
shelf
},
data() {
data() {
return {
select: {
page: 1,
page_size: 10,
keyword: '',
table_name: 'materialstorages',
area: '',
storehouses_id: '',
shifouzili: ''
},
table_name: 'materialstorages',
area: '',
storehouses_id: '',
shifouzili: '',
shifouxunihuojia: ''
},
areaList: [],
total: 0,
list: [],
list: [],
typelist: [],
table: [{
label: '序号',
@ -112,33 +116,39 @@ export default {
label: '仓库名称',
prop: 'cangkumingcheng',
align: 'left',
fixed: 'left',
fixed: 'left',
width: 240
},
// {
// label: '',
// prop: 'storehouses_id_storehouses_id_relation.name',
// align: 'center',
// width: 120,
// },
},
// {
// label: '',
// prop: 'storehouses_id_storehouses_id_relation.name',
// align: 'center',
// width: 120,
// },
{
label: '仓库编码',
prop: 'cangkubianma',
align: 'left',
width: 120
},
{
label: '是否纳入物资管理',
prop: 'shifouzili',
align: 'center',
width: 160
},
{
label: '货架信息',
prop: 'huojia',
align: 'center',
width: 120
},
},
{
label: '是否纳入物资管理',
prop: 'shifouzili',
align: 'center',
width: 160
},
{
label: '是否显示虚拟货架',
prop: 'shifouxunihuojia',
align: 'center',
width: 160
},
{
label: '货架信息',
prop: 'huojia',
align: 'center',
width: 120
},
{
label: '所在区域',
prop: 'suozaiquyu',
@ -150,7 +160,7 @@ export default {
}, {
label: '仓库地址',
prop: 'cangkudizhi',
width: 360,
width: 360,
align: 'left'
}, {
label: '仓库面积',
@ -171,62 +181,66 @@ export default {
}]
}
},
created() {
this.getArea()
created() {
this.getArea()
this.getTypeList()
this.getList()
},
methods: {
getArea() {
getparameteritem('area').then(res => {
this.areaList = res.detail
})
},
clearArea(e) {
if (e) {
this.select.area = e
} else {
this.select.area = ''
}
},
clearType(e) {
if (e) {
this.select.storehouses_id = e
} else {
this.select.storehouses_id = ''
}
},
async getTypeList() {
const res = await getStorehouseTypeList({
page: 1,
page_size: 999
})
this.typelist = res.data
console.log('this.typelist', this.typelist)
methods: {
getArea() {
getparameteritem('area').then(res => {
this.areaList = res.detail
})
},
clearArea(e) {
if (e) {
this.select.area = e
} else {
this.select.area = ''
}
},
clearType(e) {
if (e) {
this.select.storehouses_id = e
} else {
this.select.storehouses_id = ''
}
},
async getTypeList() {
const res = await getStorehouseTypeList({
page: 1,
page_size: 999
})
this.typelist = res.data
console.log('this.typelist', this.typelist)
},
async getList() {
const res = await index({
...this.select,
sort_name: 'sort',
...this.select,
sort_name: 'sort',
sort_type: 'ASC',
filter: [{
key: 'cangkumingcheng',
op: 'like',
value: this.select.keyword
}, {
key: 'quyu_id',
op: 'eq',
value: this.select.area
}, {
key: 'storehouses_id',
op: 'eq',
value: this.select.storehouses_id
}, {
key: 'shifouzili',
op: 'eq',
value: this.select.shifouzili ? this.select.shifouzili : ''
}]
filter: [{
key: 'cangkumingcheng',
op: 'like',
value: this.select.keyword
}, {
key: 'quyu_id',
op: 'eq',
value: this.select.area
}, {
key: 'storehouses_id',
op: 'eq',
value: this.select.storehouses_id
}, {
key: 'shifouzili',
op: 'eq',
value: this.select.shifouzili ? this.select.shifouzili : ''
}, {
key: 'shifouxunihuojia',
op: 'eq',
value: this.select.shifouxunihuojia ? this.select.shifouxunihuojia : ''
}]
})
this.list = res.data
@ -235,15 +249,15 @@ export default {
pageChange(e) {
this.select.page = e
this.getList()
},
pageSizeChange(e) {
this.select.page_size = e
this.getList()
},
showHuojia(row) {
this.$refs.shelf.titleName = row.cangkumingcheng
this.$refs.shelf.storage_id = row.id
this.$refs.shelf.isShow = true
},
pageSizeChange(e) {
this.select.page_size = e
this.getList()
},
showHuojia(row) {
this.$refs.shelf.titleName = row.cangkumingcheng
this.$refs.shelf.storage_id = row.id
this.$refs.shelf.isShow = true
},
delRow(id) {
if (id) {
@ -264,4 +278,4 @@ export default {
</script>
<style>
</style>
</style>

@ -6,11 +6,16 @@
<div class="aside-header">
<h3>仓库列表</h3>
</div>
<el-menu :default-active="activeRepository" class="repository-menu" @select="handleSelectRepository">
<el-menu-item v-for="repo in repositories" :key="repo.id" :index="repo.id.toString()">
<span>{{ repo.cangkumingcheng }}</span>
</el-menu-item>
</el-menu>
<div class="repository-list">
<div
v-for="repo in repositories"
:key="repo.id"
:class="['repository-item', { 'active': activeRepository === repo.id.toString() }]"
@click="handleSelectRepository(repo.id.toString())"
>
{{ repo.cangkumingcheng }}
</div>
</div>
</el-aside>
<!-- 右侧概览图和货架点位展示区 -->
@ -198,6 +203,10 @@
key: 'shifouzili',
op: 'eq',
value: '是'
}, {
key: 'shifouxunihuojia',
op: 'eq',
value: '是'
}]
})
this.repositories = res.data
@ -371,6 +380,39 @@
flex: 1;
}
/* 仓库列表样式 */
.repository-list {
flex: 1;
padding: 0;
}
.repository-item {
padding: 12px 20px;
cursor: pointer;
border-bottom: 1px solid #e4e7ed;
background-color: #fff;
transition: all 0.3s;
word-wrap: break-word;
word-break: break-all;
white-space: normal;
line-height: 1.4;
font-size: 16px;
font-weight: 500;
}
.repository-item:hover {
background-color: #f5f7fa;
color: #409eff;
cursor: pointer;
}
.repository-item.active {
background-color: #ecf5ff;
color: #409eff;
border-right: 3px solid #409eff;
font-weight: 600;
}
/* 右侧主要内容区样式 */
.repository-main {
flex: 1;
@ -478,4 +520,4 @@
margin: 0 auto;
}
}
</style>
</style>

Loading…
Cancel
Save