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

开发车型报价前端的相关页面并调整样式

master
yunuo970428 3 years ago
parent
694dd3ffaf
commit
9fc6b6dad3
8 changed files with 1991 additions and 8 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. 37
      anrui-scm/anrui-scm-ui/src/router/modules/codemenu.js
  2. 7
      anrui-scm/anrui-scm-ui/src/styles/index.scss
  3. 315
      anrui-scm/anrui-scm-ui/src/views/cheliang/chexingbaojia/daibaojiaguanli/daibaojia.vue
  4. 311
      anrui-scm/anrui-scm-ui/src/views/cheliang/chexingbaojia/daibaojiaguanli/daibaojiaInfo.vue
  5. 594
      anrui-scm/anrui-scm-ui/src/views/cheliang/chexingbaojia/daibaojiaguanli/diabaojiaAdd.vue
  6. 253
      anrui-scm/anrui-scm-ui/src/views/cheliang/chexingbaojia/yibaojiaguanli/vehicleconfiguration.vue
  7. 321
      anrui-scm/anrui-scm-ui/src/views/cheliang/chexingbaojia/yibaojiaguanli/yibaojia.vue
  8. 161
      anrui-scm/anrui-scm-ui/src/views/cheliang/chexingbaojia/yibaojiaguanli/yibaojiaInfo.vue

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

@ -240,6 +240,15 @@ const codemenu = [
title: '车辆台账'
}
},
{
path: '/cheliang/chexingbaojia',
component: () =>
import('@/views/cheliang/chexingbaojia/daibaojiaguanli/daibaojia.vue'),
name: 'daibaojia',
meta: {
title: '车型报价'
}
},
// 车辆信息
{
@ -351,16 +360,30 @@ const codemenu = [
{
path: '/kucunguanli',
component: Layout,
redirect: '/kucunguanli/tiaojiaguanli',
redirect: '/kucunguanli',
meta: {
title: '库存管理'
},
children: [{
path: '/kucunguanli/tiaojiaguanli',
component: () => import('@/views/kucunguanli/tiaojiaguanli/tiaojiashenqingguanli/priceguanli.vue'),
name: 'priceguanli',
meta: { title: '调价申请管理' }
}]
children: [
{
path: '/kucunguanli/tiaojiaguanli',
component: () => import('@/views/kucunguanli/tiaojiaguanli/priceguanli.vue'),
name: 'priceguanli',
meta: { title: '调价申请管理' }
},
{
path: '/kucunguanli/panku',
component: () => import('@/views/kucunguanli/panku/pankuguanli.vue'),
name: 'pankuguanli',
meta: { title: '盘库管理' }
},
{
path: '/kucunguanli/cheliangweihu/richangxunjian',
component: () => import('@/views/kucunguanli/cheliangweihu/richangxunjian/cheliangxunjian.vue'),
name: 'cheliangxunjianjiluchaxun',
meta: { title: '日常巡检' }
}
]
},
// 入账管理
{

7
anrui-scm/anrui-scm-ui/src/styles/index.scss
View File

@ -271,7 +271,12 @@ div:focus {
.addinputw {
padding: 5px 0;
width: 65%;
margin-left: 75px;
margin-left: 80px;
}
.addinputInfo {
margin-left: 80px;
line-height: 48px;
}
}
}

315
anrui-scm/anrui-scm-ui/src/views/cheliang/chexingbaojia/daibaojiaguanli/daibaojia.vue
View File

@ -0,0 +1,315 @@
<template>
<div class="app-container">
<!-- Start 列表页面 -->
<div v-show="viewState == 1">
<button-bar view-title="车型报价" ref="btnbar" :btndisabled="btndisabled" @btnhandle="btnHandle"/>
<div class="main-content">
<el-tabs v-model="activeName" @tab-click="handleClick" type="card" style="margin-top: 10px;">
<el-tab-pane label="待报价列表" name="first"></el-tab-pane>
<el-tab-pane label="已报价列表" name="second"></el-tab-pane>
</el-tabs>
<div class="searchcon">
<el-button size="small" class="searchbtn" @click="clicksearchShow">{{ searchxianshitit }}</el-button>
<div v-show="isSearchShow" class="search">
<el-form ref="listQueryform" :inline="true" :model="listQuery" class="tab-header">
<el-form-item label="品牌">
<el-select v-model="listQuery.params.vehicleType" placeholder="请选择" clearable class="addinputw">
<el-option v-for="item in vehicleFunction_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
</el-form-item>
<el-form-item label="车型">
<el-select v-model="listQuery.params.productLine" placeholder="请选择" clearable class="addinputw">
<el-option v-for="item in productLine_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
</el-form-item>
<el-form-item label="询价日期">
<div class="block" style="float: left;">
<el-date-picker v-model="listQuery.params.warehousingStartTime" type="date" clearable value-format="yyyy-MM-dd" placeholder="选择日期"/>
</div>
<div style="float: left;margin: 0px 10px">至</div>
<div class="block" style="float: left;">
<el-date-picker v-model="listQuery.params.warehousingEndTime" type="date" clearable value-format="yyyy-MM-dd" placeholder="选择日期"/>
</div>
</el-form-item>
</el-form>
<div class="btn" style="text-align: center;">
<el-button type="primary" @click="handleFilter" size="small">查询</el-button>
<el-button type="primary" @click="handleReset" size="small">重置</el-button>
</div>
</div>
</div>
<div class="listtop">
<div class="tit">待报价列表</div>
<pageye v-show="list.length > 0" :total="listQuery.total" :page.sync="listQuery.current" :limit.sync="listQuery.size" class="pagination" @pagination="getList"/>
</div>
<div class="">
<el-table :key="tableKey" v-loading="listLoading" :data="list" border style="width: 100%;">
<el-table-column width="80px" label="序号" type="index" :index="indexMethod" align="center"/>
<el-table-column label="操作" width="100px" align="center">
<template slot-scope="scope">
<el-button type="primary" size="mini" @click="handLook(scope.row)">查看</el-button>
<el-button type="primary" size="mini" @click="handBaoJia(scope.row)">报价</el-button>
</template>
</el-table-column>
<el-table-column label="品牌" align="center">
<template slot-scope="scope">
<span>{{ scope.row.vehicleVersion }}</span>
</template>
</el-table-column>
<el-table-column label="车型" align="center">
<template slot-scope="scope">
<span>{{ scope.row.engineTypeValue }}</span>
</template>
</el-table-column>
<el-table-column label="询价日期" align="center" width="180">
<template slot-scope="scope">
<span>{{ scope.row.vehicleTypeCode }}</span>
</template>
</el-table-column>
<el-table-column label="询价人" align="center" width="180">
<template slot-scope="scope">
<span>{{ scope.row.vehicleTypeCode }}</span>
</template>
</el-table-column>
</el-table>
</div>
<div class="pages">
<!-- 翻页 -->
<pagination v-show="list.length > 0" :total="listQuery.total" :page.sync="listQuery.current" :limit.sync="listQuery.size" class="pagination" @pagination="getList"/>
</div>
</div>
</div>
<!-- End 列表页面 -->
<diabaojiaAdd v-show="viewState == 2" ref="divAdd"/>
<daibaojiaInfo v-show="viewState == 3" ref="divInfo" @doback="resetState"/>
<yibaojia v-show="viewState == 4" ref="divYiBao" @doback="resetState"/>
</div>
</template>
<script>
import { pagerList, pullDown } from '@/api/cheliang/basevehiclemodel'
import Pagination from '@/components/pagination'
import pageye from '@/components/pagination/pageye'
import ButtonBar from '@/components/ButtonBar'
import diabaojiaAdd from './diabaojiaAdd'
import daibaojiaInfo from './daibaojiaInfo'
import yibaojia from '../yibaojiaguanli/yibaojia'
export default {
name: 'daibaojia',
components: {
Pagination,
pageye,
ButtonBar,
diabaojiaAdd,
daibaojiaInfo,
yibaojia
},
data() {
return {
viewState: 4,
activeName: 'first',
btndisabled: false,
btnList: [
{
type: 'info',
size: 'small',
icon: 'cross',
btnKey: 'doClose',
btnLabel: '关闭'
}
],
isSearchShow: false,
searchxianshitit: '显示查询条件',
// 查询条件 -----------
tableKey: 0,
list: [],
vehicleFunction_list: [], // 功能
productLine_list: [], // 系列
FormLoading: false,
listLoading: false,
listQuery: {
params: {
carBrand: '',
vehicleType: '',
productLine: '',
driveForm: '',
power: '',
vehicleVersion: '',
fuelType: '',
vehicleTypeCode: '',
gearboxType: '',
emissionStandard: '',
engineType: '',
marketSegments: '',
specifications: ''
},
current: 1,
size: 10,
total: 0
},
rules: {}
}
},
created() {
// 初始化变量
this.init()
// 加载列表
this.getList()
},
mounted() {
this.$refs['btnbar'].setButtonList(this.btnList)
},
methods: {
// 搜索条件效果
clicksearchShow() {
this.isSearchShow = !this.isSearchShow
if (this.isSearchShow) {
this.searchxianshitit = '隐藏查询条件'
} else {
this.searchxianshitit = '显示查询条件'
}
},
btnHandle(btnKey) {
console.log('XXXXXXXXXXXXXXX ' + btnKey)
switch (btnKey) {
case 'doClose':
this.doClose()
break
default:
break
}
},
init() {
// 下拉框-状态
pullDown({
type: 'vehicleFunction'
}).then((res) => {
if (res.code === '200') {
this.vehicleFunction_list = res.data
console.log('下拉框请求功能', res.data)
}
})
// 下拉框-打款状态
pullDown({
type: 'driver'
}).then((res) => {
if (res.code === '200') {
this.driveForm_list = res.data
console.log('下拉框请求驱动', res.data)
}
})
},
// 序号
indexMethod(index) {
var pagestart = (this.listQuery.current - 1) * this.listQuery.size
var pageindex = index + 1 + pagestart
return pageindex
},
// 查询列表信息
getList() {
this.listLoading = true
pagerList(this.listQuery).then((response) => {
console.log('列表查询结果：', response)
this.listLoading = false
if (
response.code === '200' &&
response.data &&
response.data.total > 0
) {
this.list = response.data.records
this.listQuery.total = response.data.total
} else {
this.list = []
this.listQuery.total = 0
}
})
},
handleClick(tab, event) {
if (tab.name === 'second') {
this.viewState = 4
this.$refs['divYiBao'].loadList()
}
},
// 查询按钮
handleFilter() {
this.listQuery.current = 1
this.getList()
},
handleReset() {
this.listQuery = {
params: {
carBrand: '',
vehicleType: '',
productLine: '',
driveForm: '',
power: '',
vehicleVersion: '',
fuelType: '',
vehicleTypeCode: '',
gearboxType: '',
emissionStandard: '',
engineType: '',
marketSegments: '',
specifications: ''
},
current: 1,
size: 10,
total: 0
}
this.getList()
},
handBaoJia(row) {
this.viewState = 2
this.$refs['divAdd'].showInfo(row)
},
handLook(row) {
this.viewState = 3
this.$refs['divInfo'].showInfo(row)
},
resetState() {
this.viewState = 1
},
doClose() {
this.$store.dispatch('tagsView/delView', this.$route)
this.$router.go(-1)
}
}
}
</script>
<style scoped>
/deep/ .el-tabs__header {
border-bottom: 0px !important;
}
/deep/ .el-tabs__nav-scroll {
padding: 0px !important;
border-bottom: 0px !important;
}
.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>

311
anrui-scm/anrui-scm-ui/src/views/cheliang/chexingbaojia/daibaojiaguanli/daibaojiaInfo.vue
View File

@ -0,0 +1,311 @@
<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">
<div class="headline">【品牌】车型询价单</div>
<el-row>
<el-col :span="8">
<div class="span-sty spanOneWidth"><span>销售专员</span></div>
<el-form-item><span class="addinputInfo addinputwOne">{{ formobj.name }}</span></el-form-item>
</el-col>
<el-col :span="8">
<div class="span-sty spanTwoWidth"><span>联系电话</span></div>
<el-form-item><span class="addinputInfo addinputwTwo">{{ formobj.name }}</span></el-form-item>
</el-col>
<el-col :span="8">
<div class="span-sty spanTwoWidth"><span>询价时间</span></div>
<el-form-item><span class="addinputInfo addinputwTwo">{{ formobj.name }}</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.name }}</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.name }}</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.name }}</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.name }}</span></el-form-item>
</el-col>
</el-row>
<div class="headline">【品牌】车型报价单</div>
<div class="headtitle"><span>系列：{{ formobj.productLineValue }}<span style="margin-left: 20px">驱动：{{ formobj.driveFormValue }}<span style="margin-left: 20px">功能：{{ formobj.vehicleTypeValue }}<span style="margin-left: 20px">马力：{{ formobj.powerValue }}</span></span></span></span></div>
<el-row>
<el-col :span="3">
<div class="span-sty"><span>品牌</span></div>
<el-form-item><span class="addinputw">{{ formobj.brandName }}</span></el-form-item>
</el-col>
<el-col :span="3">
<div class="span-sty"><span>功能</span></div>
<el-form-item><span class="addinputw">{{ formobj.vehicleTypeValue }}</span></el-form-item>
</el-col>
<el-col :span="3">
<div class="span-sty"><span>系列</span></div>
<el-form-item><span class="addinputw">{{ formobj.productLineValue }}</span></el-form-item>
</el-col>
<el-col :span="3">
<div class="span-sty"><span>驱动</span></div>
<el-form-item><span class="addinputw">{{ formobj.driveFormValue }}</span></el-form-item>
</el-col>
<el-col :span="3">
<div class="span-sty"><span>马力</span></div>
<el-form-item><span class="addinputw">{{ formobj.powerValue }}</span></el-form-item>
</el-col>
<el-col :span="3">
<div class="span-sty"><span>版本</span></div>
<el-form-item><span class="addinputw">{{ formobj.vehicleVersionValue }}</span></el-form-item>
</el-col>
<el-col :span="3">
<div class="span-sty"><span>燃料</span></div>
<el-form-item><span class="addinputw">{{ formobj.fuelTypeValue }}</span></el-form-item>
</el-col>
<el-col :span="3">
<div class="span-sty"><span>变速箱</span></div>
<el-form-item><span class="addinputw">{{ formobj.gearboxTypeValue }}</span></el-form-item>
</el-col>
</el-row>
<div class="headline">车型信息</div>
<el-row>
<el-col :span="5">
<div class="span-sty spanTwoWidth"><span>排放标准</span></div>
<el-form-item><span class="addinputw addinputwTwo">{{ formobj.specifications }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty spanTwoWidth"><span>发动机型号</span></div>
<el-form-item><span class="addinputw addinputwTwo">{{ formobj.engineTypeValue }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty spanTwoWidth"><span>细分市场</span></div>
<el-form-item><span class="addinputw addinputwTwo">{{ formobj.marketSegmentsValue }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty spanTwoWidth"><span>规格型号</span></div>
<el-form-item><span class="addinputw addinputwTwo">{{ formobj.specifications }}</span></el-form-item>
</el-col>
<el-col :span="4">
<div class="span-sty spanTwoWidth"><span>系别</span></div>
<el-form-item><span class="addinputw addinputwTwo">{{ formobj.department }}</span></el-form-item>
</el-col>
</el-row>
<div class="headline">常用配置</div>
<el-row>
<el-col :span="5">
<div class="span-sty"><span>颜色</span></div>
<el-form-item><span class="addinputw">{{ formobj.department }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>缓速器</span></div>
<el-form-item><span class="addinputw">{{ formobj.slowMachine }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>后视镜</span></div>
<el-form-item><span class="addinputw">{{ formobj.rearViewMirrorKey }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>轮胎</span></div>
<el-form-item><span class="addinputw">{{ formobj.tireSizeKey }}</span></el-form-item>
</el-col>
<el-col :span="4">
<div class="span-sty"><span>驾驶室</span></div>
<el-form-item><span class="addinputw">{{ formobj.specification }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="5">
<div class="span-sty"><span>后桥速比</span></div>
<el-form-item><span class="addinputw">{{ formobj.rearAxleRatio }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>空调</span></div>
<el-form-item><span class="addinputw">{{ formobj.airConditionerKey }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>轮毂材质</span></div>
<el-form-item><span class="addinputw">{{ formobj.hubMaterialKey }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>导流罩</span></div>
<el-form-item><span class="addinputw">{{ formobj.baffleModelKey }}</span></el-form-item>
</el-col>
<el-col :span="4">
<div class="span-sty"><span>悬架</span></div>
<el-form-item><span class="addinputw">{{ formobj.suspensionKey }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="5">
<div class="span-sty"><span>座椅</span></div>
<el-form-item><span class="addinputw">{{ formobj.seatKey }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>护轮罩</span></div>
<el-form-item><span class="addinputw">{{ formobj.tireCoverKey }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>鞍座</span></div>
<el-form-item><span class="addinputw">{{ formobj.saddleKey }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>轴距</span></div>
<el-form-item><span class="addinputw">{{ formobj.wheelbaseKey }}</span></el-form-item>
</el-col>
<el-col :span="4">
<div class="span-sty"><span>保险杠</span></div>
<el-form-item><span class="addinputw">{{ formobj.bumperKey }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="5">
<div class="span-sty"><span>配置包</span></div>
<el-form-item><span class="addinputw">{{ formobj.configuringBaoKey }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>独立热源</span></div>
<el-form-item><span class="addinputw">{{ formobj.independentSourcesKey }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>燃料箱</span></div>
<el-form-item><span class="addinputw">{{ formobj.fuelTank }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>多媒体</span></div>
<el-form-item><span class="addinputw">{{ formobj.multimediaKey }}</span></el-form-item>
</el-col>
<el-col :span="4">
<div class="span-sty"><span>货箱</span></div>
<el-form-item><span class="addinputw">{{ formobj.packingCase }}</span></el-form-item>
</el-col>
</el-row>
<div class="headline">更多配置</div>
<el-row>
<el-col :span="24">
<el-form-item>{{ formobj.otherConfig }}</el-form-item>
</el-col>
</el-row>
<div class="headline">特殊或差异说明</div>
<el-row>
<el-col :span="24">
<el-form-item>
<el-form-item>{{ formobj.otherConfig }}</el-form-item>
</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="addinputwInfo addinputwOne">{{ formobj.otherConfig }}</span></el-form-item>
</el-col>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>销售参考价(万元)</span></div>
<el-form-item><span class="addinputwInfo addinputwOne">{{ formobj.otherConfig }}</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="addinputwInfo addinputwOne">{{ formobj.remarks }}</span></el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</div>
</template>
<script>
import { selectExiCarConfig } from '@/api/chexingchaxun/modelinquire.js'
export default {
name: 'daibaojiaInfo',
data() {
return {
FormLoading: false,
formobj: {
name: '张磊'
},
sid_list: {
modelSid: '',
configSid: '',
userSid: window.sessionStorage.getItem('userSid')
}
}
},
created() {
this.init()
},
methods: {
// ----------------------------------方法--------------------
// 返回
handleReturn() {
this.$emit('doback')
},
// 查看
showInfo(sid, row) {
this.FormLoading = true
this.sid_list.modelSid = sid
this.sid_list.configSid = row.sid
selectExiCarConfig(this.sid_list).then((response) => {
this.FormLoading = false
if (response.code === '200') {
this.formobj = response.data
} else {
this.$notify({
title: '失败',
message: '查询失败',
type: 'error'
})
}
})
}
}
}
</script>
<style scoped>
.headline{
height: 40px;
padding: 10px;
font-weight: bold;
font-size: 20px;
background-color: #0294d7;
text-align: left;
color: #ffffff;
}
.headtitle{
height: 40px;
padding: 10px;
font-weight: bold;
font-size: 18px;
background-color: #ffffff;
border-bottom: 1px solid #dfe4ed;
text-align: left;
}
.spanOneWidth {
width: 140px !important;
}
.spanTwoWidth {
width: 100px !important;
}
.addinputwOne {
margin-left: 150px !important;
}
.addinputwTwo {
margin-left: 110px !important;
}
</style>

594
anrui-scm/anrui-scm-ui/src/views/cheliang/chexingbaojia/daibaojiaguanli/diabaojiaAdd.vue
View File

@ -0,0 +1,594 @@
<template>
<div class="app-container">
<div class="tab-header webtop">
<div>销售支持报价</div>
<div>
<el-button type="primary" size="small" @click="handleReturn">提交</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="headline">【品牌】车型询价单</div>
<el-row>
<el-col :span="8">
<div class="span-sty spanOneWidth"><span>销售专员</span></div>
<el-form-item><span class="addinputInfo addinputwOne">{{ formobj.name }}</span></el-form-item>
</el-col>
<el-col :span="8">
<div class="span-sty spanTwoWidth"><span>联系电话</span></div>
<el-form-item><span class="addinputInfo addinputwTwo">{{ formobj.name }}</span></el-form-item>
</el-col>
<el-col :span="8">
<div class="span-sty spanTwoWidth"><span>询价时间</span></div>
<el-form-item><span class="addinputInfo addinputwTwo">{{ formobj.name }}</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.name }}</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.name }}</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.name }}</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.name }}</span></el-form-item>
</el-col>
</el-row>
<div class="headline">【品牌】车型报价单</div>
<div class="headtitle"><span>系列：{{ formobj.productLineValue }}<span style="margin-left: 20px">驱动：{{ formobj.driveFormValue }}<span style="margin-left: 20px">功能：{{ formobj.vehicleTypeValue }}<span style="margin-left: 20px">马力：{{ formobj.powerValue }}</span></span></span></span></div>
<el-row>
<el-col :span="3">
<div class="span-sty"><span>品牌</span></div>
<el-form-item><span class="addinputw">{{ formobj.brandName }}</span></el-form-item>
</el-col>
<el-col :span="3">
<div class="span-sty"><span>功能</span></div>
<el-form-item><span class="addinputw">{{ formobj.vehicleTypeValue }}</span></el-form-item>
</el-col>
<el-col :span="3">
<div class="span-sty"><span>系列</span></div>
<el-form-item><span class="addinputw">{{ formobj.productLineValue }}</span></el-form-item>
</el-col>
<el-col :span="3">
<div class="span-sty"><span>驱动</span></div>
<el-form-item><span class="addinputw">{{ formobj.driveFormValue }}</span></el-form-item>
</el-col>
<el-col :span="3">
<div class="span-sty"><span>马力</span></div>
<el-form-item><span class="addinputw">{{ formobj.powerValue }}</span></el-form-item>
</el-col>
<el-col :span="3">
<div class="span-sty"><span>版本</span></div>
<el-form-item><span class="addinputw">{{ formobj.vehicleVersionValue }}</span></el-form-item>
</el-col>
<el-col :span="3">
<div class="span-sty"><span>燃料</span></div>
<el-form-item><span class="addinputw">{{ formobj.fuelTypeValue }}</span></el-form-item>
</el-col>
<el-col :span="3">
<div class="span-sty"><span>变速箱</span></div>
<el-form-item><span class="addinputw">{{ formobj.gearboxTypeValue }}</span></el-form-item>
</el-col>
</el-row>
<div class="headline">车型信息</div>
<el-row>
<el-col :span="5">
<div class="span-sty spanTwoWidth"><span>排放标准</span></div>
<el-form-item><span class="addinputw addinputwTwo">{{ formobj.specifications }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty spanTwoWidth"><span>发动机型号</span></div>
<el-form-item><span class="addinputw addinputwTwo">{{ formobj.engineTypeValue }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty spanTwoWidth"><span>细分市场</span></div>
<el-form-item><span class="addinputw addinputwTwo">{{ formobj.marketSegmentsValue }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty spanTwoWidth"><span>规格型号</span></div>
<el-form-item><span class="addinputw addinputwTwo">{{ formobj.specifications }}</span></el-form-item>
</el-col>
<el-col :span="4">
<div class="span-sty spanTwoWidth"><span>系别</span></div>
<el-form-item><span class="addinputw addinputwTwo">{{ formobj.department }}</span></el-form-item>
</el-col>
</el-row>
<div class="headline">常用配置</div>
<el-row>
<el-col :span="5">
<div class="span-sty"><span>颜色</span></div>
<el-form-item>
<el-select v-model="formobj.carColor" placeholder="请选择" filterable clearable class="addinputw">
<el-option v-for="item in carColor_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
<button style="border: 0px;background: #FFFFFF;font-size: 20px;margin-left: 2px" @click="add('bodyColor')">+</button>
</el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>缓速器</span></div>
<el-form-item>
<el-select v-model="formobj.slowMachine" placeholder="请选择" filterable clearable class="addinputw">
<el-option v-for="item in slowMachine_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
<button style="border: 0px;background: #FFFFFF;font-size: 20px;margin-left: 2px" @click="add('slowMachine')">+</button>
</el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>后视镜</span></div>
<el-form-item>
<el-select v-model="formobj.rearViewMirrorKey" placeholder="请选择" filterable clearable class="addinputw">
<el-option v-for="item in rearViewMirror_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
<button style="border: 0px;background: #FFFFFF;font-size: 20px;margin-left: 2px" @click="add('rearViewMirror')">+</button>
</el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>轮胎</span></div>
<el-form-item>
<el-select v-model="formobj.tireSizeKey" placeholder="请选择" filterable clearable class="addinputw">
<el-option v-for="item in tireSize_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
<button style="border: 0px;background: #FFFFFF;font-size: 20px;margin-left: 2px" @click="add('tireSize')">+</button>
</el-form-item>
</el-col>
<el-col :span="4">
<div class="span-sty"><span>驾驶室</span></div>
<el-form-item>
<el-select v-model="formobj.specification" placeholder="请选择" filterable clearable class="addinputw addinputwWidth">
<el-option v-for="item in specification_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
<button style="border: 0px;background: #FFFFFF;font-size: 18px;" @click="add('specification')">+</button>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="5">
<div class="span-sty"><span>后桥速比</span></div>
<el-form-item>
<el-select v-model="formobj.rearAxleRatio" placeholder="请选择" filterable clearable class="addinputw">
<el-option v-for="item in rearAxleRatio_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
<button style="border: 0px;background: #FFFFFF;font-size: 20px;margin-left: 2px" @click="add('rearAxleRatio')">+</button>
</el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>空调</span></div>
<el-form-item>
<el-select v-model="formobj.airConditionerKey" placeholder="请选择" filterable clearable class="addinputw">
<el-option v-for="item in airConditioner_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
<button style="border: 0px;background: #FFFFFF;font-size: 20px;margin-left: 2px" @click="add('whether')">+</button>
</el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>轮毂材质</span></div>
<el-form-item>
<el-select v-model="formobj.hubMaterialKey" placeholder="请选择" filterable clearable class="addinputw">
<el-option v-for="item in hubMaterial_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
<button style="border: 0px;background: #FFFFFF;font-size: 20px;margin-left: 2px">+</button>
</el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>导流罩</span></div>
<el-form-item>
<el-select v-model="formobj.baffleModelKey" placeholder="请选择" filterable clearable class="addinputw">
<el-option v-for="item in baffleModel_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
<button style="border: 0px;background: #FFFFFF;font-size: 20px;margin-left: 2px">+</button>
</el-form-item>
</el-col>
<el-col :span="4">
<div class="span-sty"><span>悬架</span></div>
<el-form-item>
<el-select v-model="formobj.suspensionKey" placeholder="请选择" filterable clearable class="addinputw addinputwWidth">
<el-option v-for="item in suspension_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
<button style="border: 0px;background: #FFFFFF;font-size: 18px;" @click="add('specification')">+</button>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="5">
<div class="span-sty"><span>座椅</span></div>
<el-form-item>
<el-select v-model="formobj.seatKey" placeholder="请选择" filterable clearable class="addinputw">
<el-option v-for="item in seat_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
<button style="border: 0px;background: #FFFFFF;font-size: 20px;margin-left: 2px">+</button>
</el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>护轮罩</span></div>
<el-form-item>
<el-select v-model="formobj.tireCoverKey" placeholder="请选择" filterable clearable class="addinputw">
<el-option v-for="item in tireCover_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
<button style="border: 0px;background: #FFFFFF;font-size: 20px;margin-left: 2px">+</button>
</el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>鞍座</span></div>
<el-form-item>
<el-select v-model="formobj.saddleKey" placeholder="请选择" filterable clearable class="addinputw">
<el-option v-for="item in saddle_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
<button style="border: 0px;background: #FFFFFF;font-size: 20px;margin-left: 2px">+</button>
</el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>轴距</span></div>
<el-form-item>
<el-select v-model="formobj.wheelbaseKey" placeholder="请选择" filterable clearable class="addinputw">
<el-option v-for="item in wheelbase_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
<button style="border: 0px;background: #FFFFFF;font-size: 20px;margin-left: 2px">+</button>
</el-form-item>
</el-col>
<el-col :span="4">
<div class="span-sty"><span>保险杠</span></div>
<el-form-item>
<el-select v-model="formobj.bumperKey" placeholder="请选择" filterable clearable class="addinputw addinputwWidth">
<el-option v-for="item in bumper_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
<button style="border: 0px;background: #FFFFFF;font-size: 18px;" @click="add('specification')">+</button>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="5">
<div class="span-sty"><span>配置包</span></div>
<el-form-item>
<el-select v-model="formobj.configuringBaoKey" placeholder="请选择" filterable clearable class="addinputw">
<el-option v-for="item in configuringBao_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
<button style="border: 0px;background: #FFFFFF;font-size: 20px;margin-left: 2px">+</button>
</el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>独立热源</span></div>
<el-form-item>
<el-select v-model="formobj.independentSourcesKey" placeholder="请选择" filterable clearable class="addinputw">
<el-option v-for="item in independentSources_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
<button style="border: 0px;background: #FFFFFF;font-size: 20px;margin-left: 2px">+</button>
</el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>燃料箱</span></div>
<el-form-item>
<el-select v-model="formobj.fuelTank" placeholder="请选择" filterable clearable class="addinputw">
<el-option v-for="item in fuelTank_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
<button style="border: 0px;background: #FFFFFF;font-size: 20px;margin-left: 2px">+</button>
</el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>多媒体</span></div>
<el-form-item>
<el-select v-model="formobj.multimediaKey" placeholder="请选择" filterable clearable class="addinputw">
<el-option v-for="item in multimedia_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
<button style="border: 0px;background: #FFFFFF;font-size: 20px;margin-left: 2px">+</button>
</el-form-item>
</el-col>
<el-col :span="4">
<div class="span-sty"><span>货箱</span></div>
<el-form-item>
<el-select v-model="formobj.packingCase" placeholder="请选择" filterable clearable class="addinputw addinputwWidth">
<el-option v-for="item in packingCase_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
<button style="border: 0px;background: #FFFFFF;font-size: 18px;" @click="add('specification')">+</button>
</el-form-item>
</el-col>
</el-row>
<div class="headline">更多配置</div>
<el-row>
<el-col :span="24">
<el-form-item>
<el-input v-model="formobj.otherConfig" clearable placeholder="" class="addinputw addinputwThree"></el-input>
</el-form-item>
</el-col>
</el-row>
<div class="headline">特殊或差异说明</div>
<el-row>
<el-col :span="24">
<el-form-item>
<el-input v-model="formobj.otherConfig" clearable placeholder="" class="addinputw addinputwThree"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<div class="span-sty spanOneWidth"><span>厂家结算价(万元)</span></div>
<el-form-item>
<el-input v-model="formobj.otherConfig" @keyup.native="UpNumber" @keydown.native="UpNumber" class="addinputInfo addinputwOne" style="width: 30% !important;" clearable placeholder=""></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.otherConfig" @keyup.native="UpNumber" @keydown.native="UpNumber" class="addinputInfo addinputwOne" style="width: 30% !important;" clearable placeholder=""></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="span-sty spanOneWidth"><span>备注</span></div>
<el-form-item>
<el-input v-model="formobj.remarks" class="addinputInfo addinputwOne" style="width: 50% !important;" clearable placeholder=""></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
<el-dialog :visible.sync="DialogVisible" width="50%">
<table class="e-table" cellspacing="0">
<tr>
<td>数据key</td>
<td>
<el-input v-model="dataDictionary_list.dictKey"></el-input>
</td>
</tr>
<tr>
<td>数据value</td>
<td>
<el-input v-model="dataDictionary_list.dictValue"></el-input>
</td>
</tr>
</table>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="save()">保 存</el-button>
<el-button @click="colse()">关 闭</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import { selectExiCarConfig } from '@/api/chexingchaxun/modelinquire.js'
import { typeValues } from '@/api/cheliang/dictcommons'
export default {
name: 'xiaoshouzhichibaojia',
data() {
return {
FormLoading: false,
DialogVisible: false,
formobj: {
name: '张磊'
},
dataDictionary_list: {
dictType: '',
dictKey: '',
dictValue: '',
parentSid: '0'
},
carColor_list: [], // 颜色
slowMachine_list: [], // 缓速器
rearViewMirror_list: [], // 后视镜
tireSize_list: [], // 轮胎
specification_list: [], // 驾驶室
rearAxleRatio_list: [], // 后速桥比
airConditioner_list: [], // 空调
hubMaterial_list: [], // 轮毂材质
baffleModel_list: [], // 导流罩
suspension_list: [], // 悬架
seat_list: [], // 座椅
tireCover_list: [], // 护轮罩
saddle_list: [], // 鞍座
wheelbase_list: [], // 轴距
bumper_list: [], // 保险杠
configuringBao_list: [], // 配置包
independentSources_list: [], // 独立热源
fuelTank_list: [], // 燃料箱
multimedia_list: [], // 多媒体
packingCase_list: [], // 货箱
sid_list: {
modelSid: '',
configSid: '',
userSid: window.sessionStorage.getItem('userSid')
}
}
},
created() {
this.init()
},
methods: {
init() {
this.shujuzidian()
},
shujuzidian() {
typeValues({ type: 'bodyColor' }).then((res) => {
if (res.success) {
this.carColor_list = res.data
}
})
typeValues({ type: 'slowMachine' }).then((res) => {
if (res.success) {
this.slowMachine_list = res.data
}
})
typeValues({ type: 'rearviewMirror' }).then((res) => {
if (res.success) {
this.rearViewMirror_list = res.data
}
})
typeValues({ type: 'tiresize' }).then((res) => {
if (res.success) {
this.tireSize_list = res.data
}
})
typeValues({ type: 'specification' }).then((res) => {
if (res.success) {
this.specification_list = res.data
}
})
typeValues({ type: 'rearAxleRatio' }).then((res) => {
if (res.success) {
this.rearAxleRatio_list = res.data
}
})
typeValues({ type: 'whether' }).then((res) => {
if (res.success) {
this.airConditioner_list = res.data
console.log('下拉框请求空调', res.data)
this.baffleModel_list = res.data
console.log('下拉框请求导流罩', res.data)
this.tireCover_list = res.data
console.log('下拉框请求护轮罩', res.data)
this.independentSources_list = res.data
console.log('下拉框请求护独立热源', res.data)
this.multimedia_list = res.data
console.log('下拉框请求多媒体', res.data)
}
})
typeValues({ type: 'hubMaterial' }).then((res) => {
if (res.success) {
this.hubMaterial_list = res.data
}
})
typeValues({ type: 'suspension' }).then((res) => {
if (res.success) {
this.suspension_list = res.data
}
})
typeValues({ type: 'seat' }).then((res) => {
if (res.success) {
this.seat_list = res.data
}
})
typeValues({ type: 'saddle' }).then((res) => {
if (res.success) {
this.saddle_list = res.data
}
})
typeValues({ type: 'wheelbase' }).then((res) => {
if (res.success) {
this.wheelbase_list = res.data
}
})
typeValues({ type: 'bumper' }).then((res) => {
if (res.success) {
this.bumper_list = res.data
}
})
typeValues({ type: 'configuringBao' }).then((res) => {
if (res.success) {
this.configuringBao_list = res.data
}
})
typeValues({ type: 'fuelTank' }).then((res) => {
if (res.success) {
this.fuelTank_list = res.data
}
})
typeValues({ type: 'packingCase' }).then((res) => {
if (res.success) {
this.packingCase_list = res.data
}
})
},
UpNumber(e) {
e.target.value = e.target.value.replace(/[^0-9.]/g, '') // 清除“数字”和“.”"-"以外的字符
e.target.value = e.target.value.replace(/^00/, '0.') // 开头不能有两个0
e.target.value = e.target.value.replace(/\.{2,}/g, '.') // 只保留第一个. 清除多余的
e.target.value = e.target.value.replace('.', '$#$').replace(/\./g, '').replace('$#$', '.').replace(/\-{2,}/g, '-') // 只保留第一个-
e.target.value = e.target.value.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3') // 只能输入两个小数
if (e.target.value.indexOf('.') < 0 && e.target.value !== '' && e.target.value !== '-') {
// 以上已经过滤，此处控制的是如果没有小数点，首位不能为类似于 01、02的金额
e.target.value = parseFloat(e.target.value)
}
},
add(value) {
this.dataDictionary_list.dictType = value
this.DialogVisible = true
},
save() {},
colse() {
this.DialogVisible = false
this.dataDictionary_list = {
dictType: '',
dictKey: '',
dictValue: '',
parentSid: '0'
}
},
// ----------------------------------方法--------------------
// 返回
handleReturn() {
this.$emit('doback')
},
// 查看
showInfo(sid, row) {
this.FormLoading = true
this.sid_list.modelSid = sid
this.sid_list.configSid = row.sid
selectExiCarConfig(this.sid_list).then((response) => {
this.FormLoading = false
if (response.code === '200') {
this.formobj = response.data
} else {
this.$notify({
title: '失败',
message: '查询失败',
type: 'error'
})
}
})
}
}
}
</script>
<style scoped>
.headline{
height: 40px;
padding: 10px;
font-weight: bold;
font-size: 20px;
background-color: #0294d7;
text-align: left;
color: #ffffff;
}
.headtitle{
height: 40px;
padding: 10px;
font-weight: bold;
font-size: 18px;
background-color: #ffffff;
border-bottom: 1px solid #dfe4ed;
text-align: left;
}
.spanOneWidth {
width: 140px !important;
}
.spanTwoWidth {
width: 100px !important;
}
.addinputwOne {
margin-left: 150px !important;
}
.addinputwTwo {
margin-left: 110px !important;
}
.addinputwThree {
width: 100% !important;
margin-left: 0px !important;
}
.addinputwWidth {
width: 55% !important;
}
</style>

253
anrui-scm/anrui-scm-ui/src/views/cheliang/chexingbaojia/yibaojiaguanli/vehicleconfiguration.vue
View File

@ -0,0 +1,253 @@
<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="listadd">
<div class="wlInfo">
<span>车型配置标准页面</span>
</div>
<el-form ref="dataForm" :model="formobj" class="formaddcopy02">
<div class="headtitle"><span>系列：{{ formobj.productLineValue }}<span style="margin-left: 20px">驱动：{{ formobj.driveFormValue }}<span style="margin-left: 20px">功能：{{ formobj.vehicleTypeValue }}<span style="margin-left: 20px">马力：{{ formobj.powerValue }}</span></span></span></span></div>
<el-row>
<el-col :span="3">
<div class="span-sty"><span>品牌</span></div>
<el-form-item><span class="addinputw">{{ formobj.brandName }}</span></el-form-item>
</el-col>
<el-col :span="3">
<div class="span-sty"><span>功能</span></div>
<el-form-item><span class="addinputw">{{ formobj.vehicleTypeValue }}</span></el-form-item>
</el-col>
<el-col :span="3">
<div class="span-sty"><span>系列</span></div>
<el-form-item><span class="addinputw">{{ formobj.productLineValue }}</span></el-form-item>
</el-col>
<el-col :span="3">
<div class="span-sty"><span>驱动</span></div>
<el-form-item><span class="addinputw">{{ formobj.driveFormValue }}</span></el-form-item>
</el-col>
<el-col :span="3">
<div class="span-sty"><span>马力</span></div>
<el-form-item><span class="addinputw">{{ formobj.powerValue }}</span></el-form-item>
</el-col>
<el-col :span="3">
<div class="span-sty"><span>版本</span></div>
<el-form-item><span class="addinputw">{{ formobj.vehicleVersionValue }}</span></el-form-item>
</el-col>
<el-col :span="3">
<div class="span-sty"><span>燃料</span></div>
<el-form-item><span class="addinputw">{{ formobj.fuelTypeValue }}</span></el-form-item>
</el-col>
<el-col :span="3">
<div class="span-sty"><span>变速箱</span></div>
<el-form-item><span class="addinputw">{{ formobj.gearboxTypeValue }}</span></el-form-item>
</el-col>
</el-row>
<div class="headline">车型信息</div>
<el-row>
<el-col :span="5">
<div class="span-sty spanTwoWidth"><span>排放标准</span></div>
<el-form-item><span class="addinputw addinputwTwo">{{ formobj.specifications }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty spanTwoWidth"><span>发动机型号</span></div>
<el-form-item><span class="addinputw addinputwTwo">{{ formobj.engineTypeValue }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty spanTwoWidth"><span>细分市场</span></div>
<el-form-item><span class="addinputw addinputwTwo">{{ formobj.marketSegmentsValue }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty spanTwoWidth"><span>规格型号</span></div>
<el-form-item><span class="addinputw addinputwTwo">{{ formobj.specifications }}</span></el-form-item>
</el-col>
<el-col :span="4">
<div class="span-sty spanTwoWidth"><span>系别</span></div>
<el-form-item><span class="addinputw addinputwTwo">{{ formobj.department }}</span></el-form-item>
</el-col>
</el-row>
<div class="headline">常用配置</div>
<el-row>
<el-col :span="5">
<div class="span-sty"><span>颜色</span></div>
<el-form-item><span class="addinputw">{{ formobj.department }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>缓速器</span></div>
<el-form-item><span class="addinputw">{{ formobj.slowMachine }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>后视镜</span></div>
<el-form-item><span class="addinputw">{{ formobj.rearViewMirrorKey }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>轮胎</span></div>
<el-form-item><span class="addinputw">{{ formobj.tireSizeKey }}</span></el-form-item>
</el-col>
<el-col :span="4">
<div class="span-sty"><span>驾驶室</span></div>
<el-form-item><span class="addinputw">{{ formobj.specification }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="5">
<div class="span-sty"><span>后桥速比</span></div>
<el-form-item><span class="addinputw">{{ formobj.rearAxleRatio }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>空调</span></div>
<el-form-item><span class="addinputw">{{ formobj.airConditionerKey }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>轮毂材质</span></div>
<el-form-item><span class="addinputw">{{ formobj.hubMaterialKey }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>导流罩</span></div>
<el-form-item><span class="addinputw">{{ formobj.baffleModelKey }}</span></el-form-item>
</el-col>
<el-col :span="4">
<div class="span-sty"><span>悬架</span></div>
<el-form-item><span class="addinputw">{{ formobj.suspensionKey }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="5">
<div class="span-sty"><span>座椅</span></div>
<el-form-item><span class="addinputw">{{ formobj.seatKey }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>护轮罩</span></div>
<el-form-item><span class="addinputw">{{ formobj.tireCoverKey }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>鞍座</span></div>
<el-form-item><span class="addinputw">{{ formobj.saddleKey }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>轴距</span></div>
<el-form-item><span class="addinputw">{{ formobj.wheelbaseKey }}</span></el-form-item>
</el-col>
<el-col :span="4">
<div class="span-sty"><span>保险杠</span></div>
<el-form-item><span class="addinputw">{{ formobj.bumperKey }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="5">
<div class="span-sty"><span>配置包</span></div>
<el-form-item><span class="addinputw">{{ formobj.configuringBaoKey }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>独立热源</span></div>
<el-form-item><span class="addinputw">{{ formobj.independentSourcesKey }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>燃料箱</span></div>
<el-form-item><span class="addinputw">{{ formobj.fuelTank }}</span></el-form-item>
</el-col>
<el-col :span="5">
<div class="span-sty"><span>多媒体</span></div>
<el-form-item><span class="addinputw">{{ formobj.multimediaKey }}</span></el-form-item>
</el-col>
<el-col :span="4">
<div class="span-sty"><span>货箱</span></div>
<el-form-item><span class="addinputw">{{ formobj.packingCase }}</span></el-form-item>
</el-col>
</el-row>
<div class="headline">更多配置</div>
<el-row>
<el-col :span="24">
<el-form-item>{{ formobj.otherConfig }}</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</div>
</template>
<script>
import { selectExiCarConfig } from '@/api/chexingchaxun/modelinquire.js'
export default {
name: 'chexingpeizhibiaozhun',
data() {
return {
FormLoading: false,
guidedPrice: '',
priceValidity: '',
formobj: {},
sid_list: {
modelSid: '',
configSid: '',
userSid: window.sessionStorage.getItem('userSid')
}
}
},
methods: {
init() {
this.tempDate.sid = this.$route.query.sid
},
// ----------------------------------方法--------------------
// 返回
handleReturn() {
this.$emit('doback')
},
// 查看
showInfo(sid, row) {
this.FormLoading = true
this.sid_list.modelSid = sid
this.sid_list.configSid = row.sid
this.guidedPrice = row.guidedPrice
this.priceValidity = row.priceValidity
selectExiCarConfig(this.sid_list).then((response) => {
this.FormLoading = false
if (response.code === '200') {
this.formobj = response.data
} else {
this.$notify({
title: '失败',
message: '查询失败',
type: 'error'
})
}
})
}
}
}
</script>
<style scoped>
.wlInfo {
padding: 40px 0;
font-size: 24px;
display: flex;
justify-content: center;
align-items: center;
}
.headline{
height: 40px;
padding: 10px;
font-weight: bold;
font-size: 20px;
background-color: #0294d7;
text-align: left;
color: #ffffff;
}
.headtitle{
height: 40px;
padding: 10px;
font-weight: bold;
font-size: 18px;
background-color: #ffffff;
border-bottom: 1px solid #dfe4ed;
text-align: left;
}
.spanTwoWidth {
width: 100px !important;
}
.addinputwTwo {
margin-left: 110px !important;
}
</style>

321
anrui-scm/anrui-scm-ui/src/views/cheliang/chexingbaojia/yibaojiaguanli/yibaojia.vue
View File

@ -0,0 +1,321 @@
<template>
<div class="app-container">
<!-- Start 列表页面 -->
<div v-show="viewState == 1">
<button-bar view-title="车型报价" ref="btnbar" :btndisabled="btndisabled" @btnhandle="btnHandle"/>
<div class="main-content">
<el-tabs v-model="activeName" @tab-click="handleClick" type="card" style="margin-top: 10px;">
<el-tab-pane label="待报价列表" name="first"></el-tab-pane>
<el-tab-pane label="已报价列表" name="second"></el-tab-pane>
</el-tabs>
<div class="searchcon">
<el-button size="small" class="searchbtn" @click="clicksearchShow">{{ searchxianshitit }}</el-button>
<div v-show="isSearchShow" class="search">
<el-form ref="listQueryform" :inline="true" :model="listQuery" class="tab-header">
<el-form-item label="品牌">
<el-select v-model="listQuery.params.vehicleType" placeholder="请选择" clearable class="addinputw">
<el-option v-for="item in vehicleFunction_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
</el-form-item>
<el-form-item label="车型">
<el-select v-model="listQuery.params.productLine" placeholder="请选择" clearable class="addinputw">
<el-option v-for="item in productLine_list" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey"/>
</el-select>
</el-form-item>
<el-form-item label="报价日期">
<div class="block" style="float: left;">
<el-date-picker v-model="listQuery.params.warehousingStartTime" type="date" clearable value-format="yyyy-MM-dd" placeholder="选择日期"/>
</div>
<div style="float: left;margin: 0px 10px">至</div>
<div class="block" style="float: left;">
<el-date-picker v-model="listQuery.params.warehousingEndTime" type="date" clearable value-format="yyyy-MM-dd" placeholder="选择日期"/>
</div>
</el-form-item>
</el-form>
<div class="btn" style="text-align: center;">
<el-button type="primary" @click="handleFilter" size="small">查询</el-button>
<el-button type="primary" @click="handleReset" size="small">重置</el-button>
</div>
</div>
</div>
<div class="listtop">
<div class="tit">已报价列表</div>
<pageye v-show="list.length > 0" :total="listQuery.total" :page.sync="listQuery.current" :limit.sync="listQuery.size" class="pagination" @pagination="getList"/>
</div>
<div class="">
<el-table :key="tableKey" v-loading="listLoading" :data="list" border style="width: 100%;">
<el-table-column width="80px" label="序号" type="index" :index="indexMethod" align="center"/>
<el-table-column label="操作" width="100px" align="center">
<template slot-scope="scope">
<el-button type="primary" size="mini" @click="handLook(scope.row)">查看</el-button>
</template>
</el-table-column>
<el-table-column label="品牌" align="center">
<template slot-scope="scope">
<span>{{ scope.row.vehicleVersion }}</span>
</template>
</el-table-column>
<el-table-column label="车型" align="center">
<template slot-scope="scope">
<span>{{ scope.row.engineTypeValue }}</span>
</template>
</el-table-column>
<el-table-column label="特殊或差异说明" align="center">
<template slot-scope="scope">
<span>{{ scope.row.engineTypeValue }}</span>
</template>
</el-table-column>
<el-table-column label="厂家结算价(万元)" align="center">
<template slot-scope="scope">
<span>{{ scope.row.engineTypeValue }}</span>
</template>
</el-table-column>
<el-table-column label="销售指导价(万元)" align="center">
<template slot-scope="scope">
<span>{{ scope.row.engineTypeValue }}</span>
</template>
</el-table-column>
<el-table-column label="报价日期" align="center" width="180">
<template slot-scope="scope">
<span>{{ scope.row.vehicleTypeCode }}</span>
</template>
</el-table-column>
<el-table-column label="备注" align="center" width="180">
<template slot-scope="scope">
<span>{{ scope.row.vehicleTypeCode }}</span>
</template>
</el-table-column>
</el-table>
</div>
<div class="pages">
<!-- 翻页 -->
<pagination v-show="list.length > 0" :total="listQuery.total" :page.sync="listQuery.current" :limit.sync="listQuery.size" class="pagination" @pagination="getList"/>
</div>
</div>
</div>
<!-- End 列表页面 -->
<yibaojiaInfo v-show="viewState ==2" ref="divInfo"/>
<vehicleconfiguration v-show="viewState ==3" ref="divVehicle"/>
</div>
</template>
<script>
import { pagerList, pullDown } from '@/api/cheliang/basevehiclemodel'
import Pagination from '@/components/pagination'
import pageye from '@/components/pagination/pageye'
import ButtonBar from '@/components/ButtonBar'
import yibaojiaInfo from './yibaojiaInfo'
import vehicleconfiguration from './vehicleconfiguration'
export default {
name: 'yibaojia',
components: {
Pagination,
pageye,
ButtonBar,
yibaojiaInfo,
vehicleconfiguration
},
data() {
return {
viewState: 3,
activeName: 'second',
btndisabled: false,
btnList: [
{
type: 'info',
size: 'small',
icon: 'cross',
btnKey: 'doClose',
btnLabel: '关闭'
}
],
isSearchShow: false,
searchxianshitit: '显示查询条件',
// 查询条件 -----------
tableKey: 0,
list: [],
vehicleFunction_list: [], // 功能
productLine_list: [], // 系列
FormLoading: false,
listLoading: false,
listQuery: {
params: {
carBrand: '',
vehicleType: '',
productLine: '',
driveForm: '',
power: '',
vehicleVersion: '',
fuelType: '',
vehicleTypeCode: '',
gearboxType: '',
emissionStandard: '',
engineType: '',
marketSegments: '',
specifications: ''
},
current: 1,
size: 10,
total: 0
},
rules: {}
}
},
created() {
// 初始化变量
this.init()
// 加载列表
this.getList()
},
mounted() {
this.$refs['btnbar'].setButtonList(this.btnList)
},
methods: {
// 搜索条件效果
clicksearchShow() {
this.isSearchShow = !this.isSearchShow
if (this.isSearchShow) {
this.searchxianshitit = '隐藏查询条件'
} else {
this.searchxianshitit = '显示查询条件'
}
},
btnHandle(btnKey) {
console.log('XXXXXXXXXXXXXXX ' + btnKey)
switch (btnKey) {
case 'doClose':
this.doClose()
break
default:
break
}
},
init() {
// 下拉框-状态
pullDown({
type: 'vehicleFunction'
}).then((res) => {
if (res.code === '200') {
this.vehicleFunction_list = res.data
console.log('下拉框请求功能', res.data)
}
})
// 下拉框-打款状态
pullDown({
type: 'driver'
}).then((res) => {
if (res.code === '200') {
this.driveForm_list = res.data
console.log('下拉框请求驱动', res.data)
}
})
},
// 序号
indexMethod(index) {
var pagestart = (this.listQuery.current - 1) * this.listQuery.size
var pageindex = index + 1 + pagestart
return pageindex
},
// 查询列表信息
getList() {
this.listLoading = true
pagerList(this.listQuery).then((response) => {
console.log('列表查询结果：', response)
this.listLoading = false
if (
response.code === '200' &&
response.data &&
response.data.total > 0
) {
this.list = response.data.records
this.listQuery.total = response.data.total
} else {
this.list = []
this.listQuery.total = 0
}
})
},
handleClick(tab,event){
if (tab.name === 'first') {
this.$emit('doback')
}
},
// 查询按钮
handleFilter() {
this.listQuery.current = 1
this.getList()
},
handleReset() {
this.listQuery = {
params: {
carBrand: '',
vehicleType: '',
productLine: '',
driveForm: '',
power: '',
vehicleVersion: '',
fuelType: '',
vehicleTypeCode: '',
gearboxType: '',
emissionStandard: '',
engineType: '',
marketSegments: '',
specifications: ''
},
current: 1,
size: 10,
total: 0
}
this.getList()
},
handLook(row) {
this.viewState = 3
this.$refs['divInfo'].showInfo(row)
},
resetState() {
this.viewState = 1
},
doClose() {
this.$store.dispatch('tagsView/delView', this.$route)
this.$router.go(-1)
}
}
}
</script>
<style scoped>
/deep/ .el-tabs__header {
border-bottom: 0px !important;
}
/deep/ .el-tabs__nav-scroll {
padding: 0px !important;
border-bottom: 0px !important;
}
.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>

161
anrui-scm/anrui-scm-ui/src/views/cheliang/chexingbaojia/yibaojiaguanli/yibaojiaInfo.vue
View File

@ -0,0 +1,161 @@
<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">
<div class="headline">【品牌】车型询价单</div>
<el-row>
<el-col :span="8">
<div class="span-sty spanOneWidth"><span>销售专员</span></div>
<el-form-item><span class="addinputInfo addinputwOne">{{ formobj.name }}</span></el-form-item>
</el-col>
<el-col :span="8">
<div class="span-sty spanTwoWidth"><span>联系电话</span></div>
<el-form-item><span class="addinputInfo addinputwTwo">{{ formobj.name }}</span></el-form-item>
</el-col>
<el-col :span="8">
<div class="span-sty spanTwoWidth"><span>询价时间</span></div>
<el-form-item><span class="addinputInfo addinputwTwo">{{ formobj.name }}</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.name }}</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.name }}</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.name }}</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.name }}</span></el-form-item>
</el-col>
</el-row>
<div class="headline">【品牌】车型报价单</div>
<el-row>
<el-col :span="24">
<div class="span-sty spanOneWidth"><span>车型</span></div>
<el-form-item><span class="addinputInfo addinputwOne">{{ formobj.name }}</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.name }}</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.name }}</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.name }}</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.name }}</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.remarks }}</span></el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</div>
</template>
<script>
import { selectExiCarConfig } from '@/api/chexingchaxun/modelinquire.js'
export default {
name: 'yibaojiaInfo',
data() {
return {
FormLoading: false,
guidedPrice: '',
priceValidity: '',
formobj: {},
sid_list: {
modelSid: '',
configSid: '',
userSid: window.sessionStorage.getItem('userSid')
}
}
},
methods: {
init() {
this.tempDate.sid = this.$route.query.sid
},
// ----------------------------------方法--------------------
// 返回
handleReturn() {
this.$emit('doback')
},
// 查看
showInfo(sid, row) {
this.FormLoading = true
this.sid_list.modelSid = sid
this.sid_list.configSid = row.sid
this.guidedPrice = row.guidedPrice
this.priceValidity = row.priceValidity
selectExiCarConfig(this.sid_list).then((response) => {
this.FormLoading = false
if (response.code === '200') {
this.formobj = response.data
} else {
this.$notify({
title: '失败',
message: '查询失败',
type: 'error'
})
}
})
}
}
}
</script>
<style scoped>
.headline{
height: 40px;
padding: 10px;
font-weight: bold;
font-size: 20px;
background-color: #0294d7;
text-align: left;
color: #ffffff;
}
.spanOneWidth {
width: 140px !important;
}
.spanTwoWidth {
width: 100px !important;
}
.addinputwOne {
margin-left: 150px !important;
}
.addinputwTwo {
margin-left: 110px !important;
}
</style>
Write Preview
Loading…
Cancel
Save