yxt_develop
/
anrui
9
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

开发上装台账管理和上装配置检索的前端页面

master
yunuo970428 3 years ago
parent
db9f0f4c5a
commit
7f9bbe461f
5 changed files with 1008 additions and 14 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 28
      anrui-scm/anrui-scm-ui/src/router/modules/codemenu.js
  2. 159
      anrui-scm/anrui-scm-ui/src/views/shangzhuang/shangzhuangtaizhangguanli/shangzhangtaizhangInfo.vue
  3. 270
      anrui-scm/anrui-scm-ui/src/views/shangzhuang/shangzhuangtaizhangguanli/shangzhuangpeizhijiansuo.vue
  4. 199
      anrui-scm/anrui-scm-ui/src/views/shangzhuang/shangzhuangtaizhangguanli/shangzhuangtaizhangAdd.vue
  5. 366
      anrui-scm/anrui-scm-ui/src/views/shangzhuang/shangzhuangtaizhangguanli/shangzhuangtaizhangguanli.vue

28
anrui-scm/anrui-scm-ui/src/router/modules/codemenu.js
View File

@ -143,20 +143,20 @@ const codemenu = [
meta: { title: '上装配置管理', noCache: true }
}]
},
// {
// path: '/shangzhuang',
// component: Layout,
// redirect: '/shangzhuang',
// meta: {
// title: '上装台账管理'
// },
// children: [{
// path: '/shangzhuang/shangzhuangtaizhangguanli',
// component: () => import('@/views/shangzhuang/shangzhuangtaizhangguanli/shangzhuangtaizhangguanli.vue'),
// name: 'shangzhuangtaizhangguanli',
// meta: { title: '上装台账管理', noCache: true }
// }]
// },
{
path: '/shangzhuang',
component: Layout,
redirect: '/shangzhuang',
meta: {
title: '上装台账管理'
},
children: [{
path: '/shangzhuang/shangzhuangtaizhangguanli',
component: () => import('@/views/shangzhuang/shangzhuangtaizhangguanli/shangzhuangtaizhangguanli.vue'),
name: 'shangzhuangtaizhangguanli',
meta: { title: '上装台账管理', noCache: true }
}]
},
// 合格证台账
{
path: '/hegezhengtaizhang',

159
anrui-scm/anrui-scm-ui/src/views/shangzhuang/shangzhuangtaizhangguanli/shangzhangtaizhangInfo.vue
View File

@ -0,0 +1,159 @@
<template>
<div class="app-container">
<div class="tab-header webtop">
<div>上装详情</div>
<div>
<el-button type="info" size="small" @click="handleReturn()">关闭</el-button>
</div>
</div>
<div class="listconadd">
<el-form ref="dataForm" :model="formobj" class="formaddcopy02">
<el-row style="border-top: 1px solid #dfe4ed">
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>车辆功能</span></div>
<el-form-item><span class="addinputInfo addinputwOne">{{ formobj.vehicleFunction }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>上装名称</span></div>
<el-form-item><span class="addinputInfo addinputwOne">{{ formobj.topName }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>委改方式</span></div>
<el-form-item><span class="addinputInfo addinputwOne">{{ formobj.refitMethod }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>委改厂</span></div>
<el-form-item><span class="addinputInfo addinputwOne">{{ formobj.refitFactory }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>外廓尺寸</span></div>
<el-form-item>
<div class="addinputInfo addinputwOne" style="display: inline-block;margin-left: 120px;">
<span>长</span>{{ formobj.ceshi }}mm,
<span>宽</span>{{ formobj.ceshi }}mm,
<span>高</span>{{ formobj.ceshi }}mm
</div>
</el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>颜色</span></div>
<el-form-item><span class="addinputInfo addinputwOne">{{ formobj.refitFactory }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>板材材质</span></div>
<el-form-item><span class="addinputInfo addinputwOne">{{ formobj.plateMaterial }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>板材厚度</span></div>
<el-form-item>
<div class="addinputInfo addinputwOne" style="display: inline-block;margin-left: 120px;">
<span>底</span>{{ formobj.ceshi }}mm,
<span>边</span>{{ formobj.ceshi }}mm
</div>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>篷布滑道</span></div>
<el-form-item><span class="addinputInfo addinputwOne">{{ formobj.plateMaterial }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>冷藏冷机</span></div>
<el-form-item><span class="addinputInfo addinputwOne">{{ formobj.plateThickness }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>自卸液压盖板</span></div>
<el-form-item><span class="addinputInfo addinputwOne">{{ formobj.plateMaterial }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>底板加热</span></div>
<el-form-item><span class="addinputInfo addinputwOne">{{ formobj.plateThickness }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="span-sty spanOneWidth"><span>更多配置</span></div>
<el-form-item><span class="addinputInfo addinputwOne">{{ formobj.otherConfig }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>主车车架号</span></div>
<el-form-item><span class="addinputInfo addinputwOne">{{ formobj.plateThickness }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>品牌</span></div>
<el-form-item><span class="addinputInfo addinputwOne">{{ formobj.plateThickness }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>车型</span></div>
<el-form-item><span class="addinputInfo addinputwOne">{{ formobj.plateMaterial }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>公告型号</span></div>
<el-form-item><span class="addinputInfo addinputwOne">{{ formobj.plateThickness }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>厂家结算价(元)</span></div>
<el-form-item><span class="addinputInfo addinputwOne">{{ formobj.plateThickness }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>销售指导价(元)</span></div>
<el-form-item><span class="addinputInfo addinputwOne">{{ formobj.plateThickness }}</span></el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</div>
</template>
<script>
import req from '@/api/shangzhuang/shangzhuang'
export default {
name: 'shangzhuangtaizhangInfo',
data() {
return {
formobj: {},
ceshi: '1'
}
},
methods: {
handleReturn() {
this.formobj = {}
this.$emit('doback')
},
showInfo(row) {
// this.formobj = row
req.fetchBySid(row.sid).then((resp) => {
this.formobj = resp.data
}).catch((e) => {
this.formobj = row
})
console.log('这里是详情回显', row)
}
}
}
</script>
<style scoped>
.spanOneWidth {
width: 110px !important;
}
.addinputwOne {
margin-left: 120px !important;
}
</style>

270
anrui-scm/anrui-scm-ui/src/views/shangzhuang/shangzhuangtaizhangguanli/shangzhuangpeizhijiansuo.vue
View File

@ -0,0 +1,270 @@
<template>
<div class="app-container">
<div v-show="viewState == 1">
<button-bar view-title="上装配置检索" ref="btnbar" :btndisabled="btndisabled" @btnhandle="btnHandle"/>
<div class="searchcon">
<el-button size="small" class="searchbtn" @click="isSearchShow = !isSearchShow">
{{ isSearchShow ? "隐藏查询条件" : "显示查询条件" }}
</el-button>
<div v-show="isSearchShow" class="search">
<el-form :inline="true" class="tab-header">
<el-row>
<el-form-item label="车辆功能">
<el-select v-model="queryParams.params.vehicleFunction" @change="changeVehicleFunction" filterable placeholder="请选择">
<el-option v-for="item in vehicleFunction_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="委改方式">
<el-input v-model="queryParams.params.refitMethod" placeholder="请输入委改方式" clearable/>
</el-form-item>
<el-form-item label="委改厂">
<el-input v-model="queryParams.params.refitFactory" placeholder="请输入委改厂" clearable/>
</el-form-item>
<el-form-item label="上装名称">
<el-select v-model="queryParams.params.topName" @change="changeTopName" filterable placeholder="请选择">
<el-option v-for="item in topName_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="颜色">
<el-input v-model="queryParams.params.overallDimension" placeholder="请输入颜色" clearable/>
</el-form-item>
<el-form-item label="板材材质">
<el-input v-model="queryParams.params.overallDimension" placeholder="请输入板材材质" clearable/>
</el-form-item>
</el-row>
</el-form>
<div class="btn" style="text-align: center">
<el-button type="primary" @click="dosearch">查询</el-button>
<el-button type="primary" @click="resetQuery">重置</el-button>
</div>
</div>
</div>
<!--Start 项目列表头部-->
<div class="listtop">
<div class="tit">上装配置列表</div>
<pageye v-show="dataList.length > 0" :total="queryParams.total" :page.sync="queryParams.current" :limit.sync="queryParams.size" class="pagination" @pagination="loadList"/>
</div>
<!--End 项目列表头部-->
<!--Start 项目列表-->
<div class="listcon">
<el-table v-loading="tableLoading" :data="dataList" border style="width: 100%">
<el-table-column width="80px" label="序号" type="index" :index="indexMethod" align="center"/>
<el-table-column label="操作" align="center">
<template slot-scope="scope">
<el-button type="primary" size="small" @click="handleSelect(scope.row)">选择</el-button>
</template>
</el-table-column>
<el-table-column prop="vehicleFunction" label="车辆功能" align="center"/>
<el-table-column prop="topName" label="上装名称" align="center"/>
<el-table-column prop="refitMethod" label="委改方式" align="center"/>
<el-table-column prop="refitFactory" label="委改厂" align="center"/>
<el-table-column prop="overallDimension" label="外廓尺寸" align="center"/>
<el-table-column prop="announcementModel" label="颜色" align="center"/>
<el-table-column prop="plateMaterial" label="板材材质" align="center"/>
<el-table-column prop="plateThickness" label="板材厚度" align="center"/>
<el-table-column prop="settlementPrice" label="篷布滑道" align="center"/>
<el-table-column prop="guidePrice" label="冷藏冷机" align="center"/>
<el-table-column prop="priceValidity" label="自卸液压盖板" align="center"/>
<el-table-column prop="priceValidity" label="底板加热" align="center"/>
</el-table>
</div>
<!--End 项目列表-->
<div class="pages">
<div class="tit"/>
<!-- 翻页 -->
<pagination v-show="dataList.length > 0" :total="queryParams.total" :page.sync="queryParams.current" :limit.sync="queryParams.size" class="pagination" @pagination="loadList"/>
</div>
</div>
<!--End 查询和其列表部分-->
</div>
</template>
<script>
import req from '@/api/shangzhuang/shangzhuang'
import ButtonBar from '@/components/ButtonBar'
import Pagination from '@/components/pagination'
import pageye from '@/components/pagination/pageye'
export default {
name: 'shangzhuangpeizhijiansuo',
components: {
ButtonBar,
Pagination,
pageye,
},
data() {
return {
btndisabled: false,
btnList: [
{
type: 'info',
size: 'small',
icon: 'cross',
btnKey: 'doClose',
btnLabel: '关闭'
}
],
viewState: 1, // 1、列表 2、添加 3、修改 4、查看
isSearchShow: false,
tableLoading: false,
dataList: [],
topName_list: [],
vehicleFunction_list: [],
queryParams: {
current: 1,
size: 10,
total: 10,
params: {
vehicleFunction: '',
vehicleFunctionKey: '',
refitMethod: '',
refitFactory: '',
topName: '',
topNameKey: '',
overallDimension: ''
}
},
multipleSelection: []
}
},
mounted() {
this.$refs['btnbar'].setButtonList(this.btnList)
},
created() {
this.loadList()
this.DataDictionary()
},
methods: {
btnHandle(btnKey) {
console.log('XXXXXXXXXXXXXXX ' + btnKey)
switch (btnKey) {
case 'doClose':
this.doClose()
break
default:
break
}
},
DataDictionary() {
// 上装名称
req.pullDown({ type: 'topName' }).then((res) => {
if (res.success) {
this.topName_list = res.data
}
})
// 车辆功能
req.pullDown({ type: 'vehicleFunction' }).then((res) => {
if (res.success) {
this.vehicleFunction_list = res.data
}
})
},
changeTopName(value) {
let bb = null
this.topName_list.forEach((e) => {
if (e.dictKey === value) {
bb = {
name: e.dictValue,
value: e.dictKey
}
}
})
this.queryParams.params.topName = bb.name
this.queryParams.params.topNameKey = bb.value
},
changeVehicleFunction(value) {
let bb = null
this.vehicleFunction_list.forEach((e) => {
if (e.dictKey === value) {
bb = {
name: e.dictValue,
value: e.dictKey
}
}
})
this.queryParams.params.vehicleFunction = bb.name
this.queryParams.params.vehicleFunctionKey = bb.value
},
showData() {
const aa = []
},
// 序号
indexMethod(index) {
var pagestart = (this.queryParams.current - 1) * this.queryParams.size
var pageindex = index + 1 + pagestart
return pageindex
},
loadList() {
const _this = this
this.tableLoading = true
req.listPage(this.queryParams).then((resp) => {
_this.tableLoading = false
const data = resp.data
_this.queryParams.total = data.total
_this.dataList = data.records
}).catch(() => {
_this.tableLoading = false
})
},
handleSelect(row) {
this.$emit('backData', row)
},
dosearch() {
this.queryParams.current = 1
this.loadList()
},
resetQuery() {
this.queryParams = {
current: 1,
size: 10,
total: 0,
params: {
vehicleFunction: '',
vehicleFunctionKey: '',
refitMethod: '',
refitFactory: '',
topName: '',
topNameKey: '',
overallDimension: ''
}
}
this.loadList()
}
}
}
</script>
<style scoped>
.searchbtn {
border: #2cab69 1px solid;
color: #2cab69;
}
.btn {
padding: 15px 0 15px 0;
border: 1px solid #e0e3eb;
}
.tab-header {
background-color: #edf1f7;
padding: 8px 20px;
margin-bottom: 0 !important;
}
.tab-header /deep/ .el-form-item {
margin-bottom: 10px;
}
.listtop {
display: flex;
justify-content: space-between;
align-items: center;
border: 1px solid #dfe4ed;
height: 40px;
}
.tit {
margin-bottom: -10px;
}
.pagination {
margin-bottom: -10px;
}
</style>

199
anrui-scm/anrui-scm-ui/src/views/shangzhuang/shangzhuangtaizhangguanli/shangzhuangtaizhangAdd.vue
View File

@ -0,0 +1,199 @@
<template>
<div class="app-container">
<div v-show="viewState ==1">
<div class="tab-header webtop">
<div>【入库】上装信息</div>
<div>
<el-button type="primary" size="small" @click="handleSave()">保存</el-button>
<el-button type="info" size="small" @click="handleReturn()">关闭</el-button>
</div>
</div>
<div class="listconadd">
<el-form ref="dataForm" :model="formobj" class="formaddcopy02">
<div class="tableStyle">
<div class="headline">上装配置信息</div>
<div>
<el-button type="primary" size="small" icon="el-icon-plus" class="btntopblueline" @click="handleSelect()">选择</el-button>
</div>
</div>
<el-row>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>车辆功能</span></div>
<el-form-item><span>{{ formobj.vehicleFunction }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>上装名称</span></div>
<el-form-item><span>{{ formobj.topName }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>委改方式</span></div>
<el-form-item><span>{{ formobj.refitMethod }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>委改厂</span></div>
<el-form-item><span>{{ formobj.refitFactory }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>外廓尺寸</span></div>
<el-form-item>
<div class="addinputw" style="display: inline-block;margin-left: 120px;">
<span>长</span>{{ formobj.ceshi }}mm,
<span>宽</span>{{ formobj.ceshi }}mm,
<span>高</span>{{ formobj.ceshi }}mm
</div>
</el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>颜色</span></div>
<el-form-item><span>{{ formobj.refitFactory }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>板材材质</span></div>
<el-form-item><span>{{ formobj.plateMaterial }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>板材厚度</span></div>
<el-form-item>
<div class="addinputw" style="display: inline-block;margin-left: 120px;">
<span>底</span>{{ formobj.ceshi }}mm,
<span>边</span>{{ formobj.ceshi }}mm
</div>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>篷布滑道</span></div>
<el-form-item><span>{{ formobj.plateMaterial }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>冷藏冷机</span></div>
<el-form-item><span>{{ formobj.plateThickness }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>自卸液压盖板</span></div>
<el-form-item><span>{{ formobj.plateMaterial }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>底板加热</span></div>
<el-form-item><span>{{ formobj.plateThickness }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="span-sty spanOneWidth"><span>更多配置</span></div>
<el-form-item><span>{{ formobj.otherConfig }}</span></el-form-item>
</el-col>
</el-row>
<div class="headline">主车信息</div>
<el-row>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>主车车架号</span></div>
<el-form-item><el-input v-model="formobj.plateMaterial" class="addinputw addinputwOne" placeholder="" clearable></el-input></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>品牌</span></div>
<el-form-item><span>{{ formobj.plateThickness }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>车型</span></div>
<el-form-item><span>{{ formobj.plateMaterial }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>公告型号</span></div>
<el-form-item><span>{{ formobj.plateThickness }}</span></el-form-item>
</el-col>
</el-row>
<div class="headline">上装价格信息</div>
<el-row>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>厂家结算价(元)</span></div>
<el-form-item><el-input v-model="formobj.plateMaterial" class="addinputw addinputwOne" placeholder="" clearable></el-input></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>销售指导价(元)</span></div>
<el-form-item><el-input v-model="formobj.plateMaterial" class="addinputw addinputwOne" placeholder="" clearable></el-input></el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</div>
<shangzhuangpeizhijiansuo v-show="viewState == 2" ref="divSelect" @backData="backData" @doback="resetState"/>
</div>
</template>
<script>
import req from '@/api/shangzhuang/shangzhuang'
import shangzhuangpeizhijiansuo from './shangzhuangpeizhijiansuo'
export default {
name: 'shangzhuangtaizhangAdd',
components: {
shangzhuangpeizhijiansuo
},
data() {
return {
viewState: 1,
formobj: {},
ceshi: '1'
}
},
methods: {
handleSelect() {
this.viewState = 2
this.$refs['divSelect'].showData()
},
handleReturn() {
this.formobj = {}
this.$emit('doback')
},
backData(row) {
},
showAdd() {
},
showEdit(row) {},
}
}
</script>
<style scoped>
.spanOneWidth {
width: 110px !important;
}
.addinputwOne {
margin-left: 120px !important;
width: 30% !important;
}
.headline{
height: 40px;
padding: 10px;
font-weight: bold;
font-size: 20px;
background-color: #018ad2;
text-align: left;
color: #ffffff;
}
.tableStyle {
background-color: #018ad2;
display: flex;
justify-content: space-between;
align-items: center;
/*border: 1px solid #dfe4ed;*/
height: 40px;
}
.btntopblueline {
margin-right: 10px;
}
</style>

366
anrui-scm/anrui-scm-ui/src/views/shangzhuang/shangzhuangtaizhangguanli/shangzhuangtaizhangguanli.vue
View File

@ -0,0 +1,366 @@
<template>
<div class="app-container">
<div v-show="viewState == 1">
<button-bar view-title="上装台账管理" ref="btnbar" :btndisabled="btndisabled" @btnhandle="btnHandle"/>
<div class="main-content">
<div class="searchcon">
<el-button size="small" class="searchbtn" @click="isSearchShow = !isSearchShow">
{{ isSearchShow ? "隐藏查询条件" : "显示查询条件" }}
</el-button>
<div v-show="isSearchShow" class="search">
<el-form :inline="true" class="tab-header">
<el-row>
<el-form-item label="车辆功能">
<el-select v-model="queryParams.params.vehicleFunction" @change="changeVehicleFunction" filterable placeholder="请选择">
<el-option v-for="item in vehicleFunction_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="委改方式">
<el-input v-model="queryParams.params.refitMethod" placeholder="请输入委改方式" clearable/>
</el-form-item>
<el-form-item label="委改厂">
<el-input v-model="queryParams.params.refitFactory" placeholder="请输入委改厂" clearable/>
</el-form-item>
<el-form-item label="上装名称">
<el-select v-model="queryParams.params.topName" @change="changeTopName" filterable placeholder="请选择">
<el-option v-for="item in topName_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="颜色">
<el-input v-model="queryParams.params.overallDimension" placeholder="请输入颜色" clearable/>
</el-form-item>
<el-form-item label="板材材质">
<el-input v-model="queryParams.params.overallDimension" placeholder="请输入板材材质" clearable/>
</el-form-item>
</el-row>
<el-row>
<el-form-item label="公告型号">
<el-input v-model="queryParams.params.overallDimension" placeholder="请输入颜色" clearable/>
</el-form-item>
<el-form-item label="主车车架号">
<el-input v-model="queryParams.params.overallDimension" placeholder="请输入板材材质" clearable/>
</el-form-item>
</el-row>
</el-form>
<div class="btn" style="text-align: center">
<el-button type="primary" @click="dosearch">查询</el-button>
<el-button type="primary" @click="resetQuery">重置</el-button>
</div>
</div>
</div>
<!--Start 项目列表头部-->
<div class="listtop">
<div class="tit">上装库存台账列表</div>
<pageye v-show="dataList.length > 0" :total="queryParams.total" :page.sync="queryParams.current" :limit.sync="queryParams.size" class="pagination" @pagination="loadList"/>
</div>
<!--End 项目列表头部-->
<!--Start 项目列表-->
<div class="listcon">
<el-table v-loading="tableLoading" :data="dataList" border style="width: 100%" @selection-change="handleSelectionChange">
<el-table-column width="50px" type="selection" align="center"/>
<el-table-column width="80px" label="序号" type="index" :index="indexMethod" align="center"/>
<el-table-column label="操作" width="180px" align="center">
<template slot-scope="scope">
<el-button type="primary" size="small" @click="toEdit(scope.row)">编辑</el-button>
<el-button type="primary" size="small" @click="toInfo(scope.row)">查看</el-button>
</template>
</el-table-column>
<el-table-column prop="vehicleFunction" label="车辆功能" align="center"/>
<el-table-column prop="topName" label="上装名称" align="center"/>
<el-table-column prop="refitMethod" label="委改方式" align="center"/>
<el-table-column prop="refitFactory" label="委改厂" align="center"/>
<el-table-column prop="announcementModel" label="颜色" align="center"/>
<el-table-column prop="plateMaterial" label="板材材质" align="center"/>
<el-table-column prop="plateThickness" label="品牌" align="center"/>
<el-table-column prop="plateThickness" label="公告型号" align="center"/>
<el-table-column prop="plateThickness" label="车型" align="center"/>
<el-table-column prop="plateThickness" label="主车车架号" align="center"/>
<el-table-column prop="plateThickness" label="库存状态" align="center"/>
<el-table-column prop="plateThickness" label="入库日期" align="center"/>
<el-table-column prop="plateThickness" label="出库日期" align="center"/>
<el-table-column prop="settlementPrice" label="厂家结算价" align="center"/>
<el-table-column prop="guidePrice" label="销售指导价" align="center"/>
</el-table>
</div>
<!--End 项目列表-->
<div class="pages">
<div class="tit"/>
<!-- 翻页 -->
<pagination v-show="dataList.length > 0" :total="queryParams.total" :page.sync="queryParams.current" :limit.sync="queryParams.size" class="pagination" @pagination="loadList"/>
</div>
</div>
</div>
<!--End 查询和其列表部分-->
<!--新增修改部分组件-->
<shangzhuangtaizhangAdd v-show="viewState == 2 || viewState == 3" ref="divAdd" @doback="resetState" @reloadlist="loadList"/>
<!--详情部分组件-->
<shangzhangtaizhangInfo v-show="viewState == 4" ref="divinfo" @doback="resetState"/>
</div>
</template>
<script>
import req from '@/api/shangzhuang/shangzhuang'
import ButtonBar from '@/components/ButtonBar'
import Pagination from '@/components/pagination'
import pageye from '@/components/pagination/pageye'
import shangzhuangtaizhangAdd from './shangzhuangtaizhangAdd'
import shangzhangtaizhangInfo from './shangzhangtaizhangInfo'
export default {
name: 'shangzhuangtaizhangguanli',
components: {
ButtonBar,
Pagination,
pageye,
shangzhuangtaizhangAdd,
shangzhangtaizhangInfo
},
data() {
return {
btndisabled: false,
btnList: [
{
type: 'primary',
size: 'small',
icon: 'plus',
btnKey: 'toAdd',
btnLabel: '入库'
},
{
type: 'danger',
size: 'small',
icon: 'del',
btnKey: 'doDel',
btnLabel: '删除'
},
{
type: 'info',
size: 'small',
icon: 'cross',
btnKey: 'doClose',
btnLabel: '关闭'
}
],
viewState: 1, // 1、列表 2、添加 3、修改 4、查看
isSearchShow: false,
tableLoading: false,
dataList: [],
topName_list: [],
vehicleFunction_list: [],
queryParams: {
current: 1,
size: 10,
total: 10,
params: {
vehicleFunction: '',
vehicleFunctionKey: '',
refitMethod: '',
refitFactory: '',
topName: '',
topNameKey: '',
overallDimension: ''
}
},
multipleSelection: []
}
},
mounted() {
this.$refs['btnbar'].setButtonList(this.btnList)
},
created() {
this.loadList()
this.DataDictionary()
},
methods: {
DataDictionary() {
// 上装名称
req.pullDown({ type: 'topName' }).then((res) => {
if (res.success) {
this.topName_list = res.data
}
})
// 车辆功能
req.pullDown({ type: 'vehicleFunction' }).then((res) => {
if (res.success) {
this.vehicleFunction_list = res.data
}
})
},
changeTopName(value) {
let bb = null
this.topName_list.forEach((e) => {
if (e.dictKey === value) {
bb = {
name: e.dictValue,
value: e.dictKey
}
}
})
this.queryParams.params.topName = bb.name
this.queryParams.params.topNameKey = bb.value
},
changeVehicleFunction(value) {
let bb = null
this.vehicleFunction_list.forEach((e) => {
if (e.dictKey === value) {
bb = {
name: e.dictValue,
value: e.dictKey
}
}
})
this.queryParams.params.vehicleFunction = bb.name
this.queryParams.params.vehicleFunctionKey = bb.value
},
resetState() {
this.viewState = 1
},
btnHandle(btnKey) {
console.log('XXXXXXXXXXXXXXX ' + btnKey)
switch (btnKey) {
case 'toAdd':
this.toAdd()
break
case 'toEdit':
this.toEdit()
break
case 'doDel':
this.doDel()
break
default:
break
}
},
toAdd(row) {
this.viewState = 2
this.$refs['divAdd'].showAdd()
},
toEdit(row) {
this.viewState = 3
this.$refs['divAdd'].showEdit(row)
},
doDel(row) {
if (this.multipleSelection.length === 0) {
this.$message({
showClose: true,
type: 'error',
message: '请选择至少一条记录进行删除操作'
})
return
}
const _this = this
const sids = []
this.multipleSelection.forEach((row) => {
sids.push(row.sid)
})
const tip = '请确认是否删除所选 ' + this.multipleSelection.length + ' 条记录?'
this.$confirm(tip, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
const loading = this.$loading({
lock: true,
text: 'Loading',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
})
req.delBySids(sids).then((resp) => {
loading.close()
_this.$message({
type: 'success',
message: resp.msg,
showClose: true
})
_this.loadList()
}).catch((e) => {
loading.close()
})
}).catch(() => {
})
},
dosearch() {
this.queryParams.current = 1
this.loadList()
},
resetQuery() {
this.queryParams = {
current: 1,
size: 10,
total: 0,
params: {
vehicleFunction: '',
vehicleFunctionKey: '',
refitMethod: '',
refitFactory: '',
topName: '',
topNameKey: '',
overallDimension: ''
}
}
this.loadList()
},
loadList() {
const _this = this
this.tableLoading = true
req.listPage(this.queryParams).then((resp) => {
_this.tableLoading = false
const data = resp.data
_this.queryParams.total = data.total
_this.dataList = data.records
}).catch(() => {
_this.tableLoading = false
})
},
handleSelectionChange(val) {
console.log(val)
this.multipleSelection = val
},
// 序号
indexMethod(index) {
var pagestart = (this.queryParams.current - 1) * this.queryParams.size
var pageindex = index + 1 + pagestart
return pageindex
},
toInfo(row) {
this.$refs['divinfo'].showInfo(row)
this.viewState = 4
}
}
}
</script>
<style scoped>
.searchbtn {
border: #2cab69 1px solid;
color: #2cab69;
}
.btn {
padding: 15px 0 15px 0;
border: 1px solid #e0e3eb;
}
.tab-header {
background-color: #edf1f7;
padding: 8px 20px;
margin-bottom: 0 !important;
}
.tab-header /deep/ .el-form-item {
margin-bottom: 10px;
}
.listtop {
display: flex;
justify-content: space-between;
align-items: center;
border: 1px solid #dfe4ed;
height: 40px;
}
.tit {
margin-bottom: -10px;
}
.pagination {
margin-bottom: -10px;
}
</style>
Write Preview
Loading…
Cancel
Save