675 lines
22 KiB
Vue
675 lines
22 KiB
Vue
|
<template>
|
|||
|
|
<el-dialog
|
|||
|
|
title="编辑机器信息"
|
|||
|
|
:visible.sync="brandshow"
|
|||
|
|
width="1200px"
|
|||
|
|
top="5vh"
|
|||
|
|
append-to-body
|
|||
|
|
:close-on-click-modal="false"
|
|||
|
|
:before-close="handleClose"
|
|||
|
|
>
|
|||
|
|
<div>
|
|||
|
|
<div v-if="!!brandform['pjt_account']" class="paiclass">
|
|||
|
|
<i v-if="brandform.level_name" class="level">{{ brandform.level_name }}</i>
|
|||
|
|
<!-- <el-link type="primary" v-if="brandform.foreign.length>0" @click="inspectionclick(brandform)">质检报告</el-link> -->
|
|||
|
|
<span>{{ brandform.pjt_contact_name }}:{{ brandform.pjt_account }}</span>
|
|||
|
|
<span style="color:#e67e22;margin-left:5px">拍:{{ brandform.pjt_model_info }}</span>
|
|||
|
|
</div>
|
|||
|
|
<div style="display:flex;margin-top: 10px;">
|
|||
|
|
<el-popover
|
|||
|
|
v-if="!!brandform.img"
|
|||
|
|
placement="right"
|
|||
|
|
width="350"
|
|||
|
|
trigger="hover"
|
|||
|
|
>
|
|||
|
|
<el-image
|
|||
|
|
v-if="!!brandform.img"
|
|||
|
|
style="height: 350px"
|
|||
|
|
:src="brandform.img"
|
|||
|
|
>
|
|||
|
|
<div slot="error" class="image-slot">
|
|||
|
|
<i class="el-icon-picture-outline" />
|
|||
|
|
</div>
|
|||
|
|
</el-image>
|
|||
|
|
<el-image
|
|||
|
|
v-if="!!brandform.img"
|
|||
|
|
slot="reference"
|
|||
|
|
style="height: 70px;width:70px"
|
|||
|
|
:src="brandform.img"
|
|||
|
|
>
|
|||
|
|
<div slot="error" class="image-slot">
|
|||
|
|
<i class="el-icon-picture-outline" />
|
|||
|
|
</div>
|
|||
|
|
</el-image>
|
|||
|
|
</el-popover>
|
|||
|
|
<div style="margin-left:10px;flex: 1;display: flex;flex-direction: column;justify-content: space-between;">
|
|||
|
|
<div style="display: flex;align-items: center;margin-bottom: 5px;">
|
|||
|
|
<div v-if="!!brandform['mp_full_model']" style="background:#ecf5ff;height:30px;display:flex;align-items:center;color: #1e90ff;padding: 0 30px;">
|
|||
|
|
官网信息: {{ brandform['mp_full_model'] }}
|
|||
|
|
</div>
|
|||
|
|
<div style="margin-left:10px;font-size: 16px;font-weight: bold;color: #000;">
|
|||
|
|
{{ brandform['brand_name'] }} {{ brandform['model_name'] }} {{ brandform['rom_name'] }} {{ brandform['color_name'] }}
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div style="display:flex;justify-content:space-between">
|
|||
|
|
<div :span="7" style="display:flex;align-items:center;flex: 1;">
|
|||
|
|
<span>IMEI</span>
|
|||
|
|
<el-input v-model="brandform.imei1" size="mini" style="width: 70%;margin-left:5px" />
|
|||
|
|
</div>
|
|||
|
|
<div :span="7" style="display:flex;align-items:center; flex: 1;">
|
|||
|
|
<span>IMEI2</span>
|
|||
|
|
<el-input v-model="brandform.imei2" size="mini" style="width: 70%;margin-left:5px" />
|
|||
|
|
</div>
|
|||
|
|
<div :span="7" style="display:flex;align-items:center;flex: 1;">
|
|||
|
|
<span>sn</span>
|
|||
|
|
<el-input v-model="brandform.sn" size="mini" style="width: 70%;margin-left:5px" />
|
|||
|
|
</div>
|
|||
|
|
<div :span="7" style="display:flex;align-items:center;flex: 1;">
|
|||
|
|
<span>第三方条码</span>
|
|||
|
|
<el-input v-model="brandform.pjt_product_no" size="mini" style="width: 65%;margin-left:5px;flex:1" />
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<!-- 品牌选择 -->
|
|||
|
|
<div ref="ss" class="bodyclass">
|
|||
|
|
<!-- 左边 -->
|
|||
|
|
<div>
|
|||
|
|
<h3 style="font-weight: bold;">分类</h3>
|
|||
|
|
<div style="overflow-y: auto;height: 780px;">
|
|||
|
|
<a-menu v-model="current" style="height: 100%;" mode="inline">
|
|||
|
|
<a-menu-item v-for="(item,index) in cate_options" :key="item.value">
|
|||
|
|
<span style="font-size:15px;color: #000;font-weight: 600;">{{ item.label }}</span>
|
|||
|
|
</a-menu-item>
|
|||
|
|
</a-menu>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<!-- 右边 -->
|
|||
|
|
<div style="padding-left: 20px">
|
|||
|
|
<div class="flex-b">
|
|||
|
|
<h3 style="font-weight: bold;">品牌</h3>
|
|||
|
|
<div>
|
|||
|
|
<el-autocomplete v-model="keywords" style="width: 350px;" :fetch-suggestions="inputchange" size="small" placeholder="型号搜索(内容大于2个字符)" @select="handleSelect">
|
|||
|
|
<template slot-scope="{ item }">
|
|||
|
|
<div class="number" style="white-space: pre-wrap;">{{ item.brand_name }} {{ item.model_name }}</div>
|
|||
|
|
</template>
|
|||
|
|
</el-autocomplete>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div>
|
|||
|
|
<el-row>
|
|||
|
|
<el-col v-for="(v,index) in brand_options" :key="index" :span="4" style="margin:10px">
|
|||
|
|
<div class="btnclass">
|
|||
|
|
<el-button class="buttonDiv" plain :type="brandform.brand_id==v.value ? 'primary' :''" style="width: 100%;" @click="brandclick($event,v)">{{ v.label }}</el-button>
|
|||
|
|
</div>
|
|||
|
|
</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
<el-pagination layout="prev, pager, next" :page-size="10" :total="brandtotal" @current-change="currentchange" />
|
|||
|
|
</div>
|
|||
|
|
<h3 style="font-weight: bold;">型号</h3>
|
|||
|
|
<div v-if="model_options && model_options.length>0">
|
|||
|
|
<el-row>
|
|||
|
|
<el-col v-for="(v,index) in model_options" :key="index" :span="4" style="margin:10px">
|
|||
|
|
<div class="btnclass">
|
|||
|
|
<el-button class="buttonDiv" plain :type="brandform.model_id==v.value ? 'primary' :''" style="width: 100%;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;" @click="modelclick($event,v)">
|
|||
|
|
<el-tooltip v-if="v.label.length>18" class="item" effect="dark" :content="v.label" placement="top"> <span>{{ v.label }}</span></el-tooltip>
|
|||
|
|
<span v-else>{{ v.label }}</span>
|
|||
|
|
</el-button>
|
|||
|
|
</div>
|
|||
|
|
</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
<el-pagination layout="prev, pager, next" :page-size="10" :total="modeltotal" @current-change="currentchange1" />
|
|||
|
|
</div>
|
|||
|
|
<div v-else>
|
|||
|
|
请先选择品牌
|
|||
|
|
</div>
|
|||
|
|
<h3 style="font-weight: bold;">容量</h3>
|
|||
|
|
<div v-if="rom_options && rom_options.length>0">
|
|||
|
|
<el-row>
|
|||
|
|
<el-col v-for="(v,index) in rom_options" :key="index" :span="4" style="margin:10px">
|
|||
|
|
<div class="btnclass">
|
|||
|
|
<el-button class="buttonDiv" plain :type="brandform.rom_id==v.value ? 'primary' :''" style="width: 100%;" @click="romclick($event,v)">{{ v.label }}</el-button>
|
|||
|
|
</div>
|
|||
|
|
</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
</div>
|
|||
|
|
<div v-else>
|
|||
|
|
请先选择容量
|
|||
|
|
</div>
|
|||
|
|
<h3 style="font-weight: bold;">颜色</h3>
|
|||
|
|
<div v-if="color_options && color_options.length>0" style="max-height: 340px;overflow-y: auto">
|
|||
|
|
<el-row>
|
|||
|
|
<el-col v-for="(v,index) in color_options" :key="index" :span="4" style="margin:10px">
|
|||
|
|
<div style="display:flex;flex-direction:column;align-items:center;">
|
|||
|
|
<el-popover
|
|||
|
|
placement="right"
|
|||
|
|
width="350"
|
|||
|
|
trigger="click"
|
|||
|
|
>
|
|||
|
|
<el-image
|
|||
|
|
v-if="v.img"
|
|||
|
|
style="height: 350px"
|
|||
|
|
:src="v.img"
|
|||
|
|
>
|
|||
|
|
<div slot="error" class="image-slot">
|
|||
|
|
<i class="el-icon-picture-outline" />
|
|||
|
|
</div>
|
|||
|
|
</el-image>
|
|||
|
|
<el-image
|
|||
|
|
slot="reference"
|
|||
|
|
style="height: 70px;width:70px"
|
|||
|
|
:src="v.img"
|
|||
|
|
>
|
|||
|
|
<div slot="error" class="image-slot">
|
|||
|
|
<i class="el-icon-picture-outline" />
|
|||
|
|
</div>
|
|||
|
|
</el-image>
|
|||
|
|
</el-popover>
|
|||
|
|
<div class="btnclass" style=" width: 100%;">
|
|||
|
|
<el-button class="buttonDiv" plain :type="brandform.color_id==v.value ? 'primary' :''" style="width: 100%;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;" @click="colorclick($event,v)">
|
|||
|
|
<el-tooltip v-if="v.label.length>12" class="item" effect="dark" :content="v.label" placement="top"> <span>{{ v.label }}</span></el-tooltip>
|
|||
|
|
<span v-else>{{ v.label }}</span>
|
|||
|
|
</el-button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
</div>
|
|||
|
|
<div v-else>
|
|||
|
|
请先选择颜色
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div style="text-align: right">
|
|||
|
|
<el-button @click="handleClose()">取 消</el-button>
|
|||
|
|
<el-button type="primary" @click="editinfo">确认</el-button>
|
|||
|
|
</div>
|
|||
|
|
</el-dialog>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import html2canvas from 'html2canvas' // 转图片打印需要先安装html2Canvas和print-js
|
|||
|
|
import printJS from 'print-js'
|
|||
|
|
import QRCode from 'qrcodejs2'
|
|||
|
|
import { ai_model_update_v2, cate_brand_list_all, user_warranty_query } from '@/api/Warehousing' // 获取客户信息接口
|
|||
|
|
import { res_advanced_search } from '@/api/machineList' // 获取机器列表信息接口
|
|||
|
|
import { pre_print } from '@/api/machineList' // 获取列表信息接口
|
|||
|
|
import { op_order_details_code, cate_brand_list, edit_drafts_box, purchase_order_edit_phone } from '@/api/Warehousing' // 获取二维码信息接口
|
|||
|
|
import { mapGetters } from 'vuex'
|
|||
|
|
export default {
|
|||
|
|
name: 'EditBrand',
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
keywords: '',
|
|||
|
|
warranty_query: 2,
|
|||
|
|
form: { cate_id: null, brand_id: null, model_id: null, rom_id: null, color_id: null },
|
|||
|
|
cate_options: [],
|
|||
|
|
brand_options: [],
|
|||
|
|
model_options: [],
|
|||
|
|
rom_options: [],
|
|||
|
|
color_options: [],
|
|||
|
|
customer_options: [],
|
|||
|
|
quote_user_options: [],
|
|||
|
|
countries_options: [// 国别
|
|||
|
|
{ label: '中国', value: '中国' },
|
|||
|
|
{ label: '国行运营商', value: '国行运营商' },
|
|||
|
|
{ label: '国行全网通', value: '国行全网通' },
|
|||
|
|
{ label: '海外', value: '海外' },
|
|||
|
|
{ label: '美版', value: '美版' },
|
|||
|
|
{ label: '日本', value: '日本' },
|
|||
|
|
{ label: '韩版', value: '韩版' },
|
|||
|
|
{ label: '港澳台', value: '港澳台' },
|
|||
|
|
{ label: '新加坡', value: '新加坡' },
|
|||
|
|
{ label: '欧盟', value: '欧盟' },
|
|||
|
|
{ label: '国际版', value: '国际版' }],
|
|||
|
|
id_options: [
|
|||
|
|
{ label: '有', value: 1 },
|
|||
|
|
{ label: '无', value: 2 },
|
|||
|
|
{ label: '未知', value: 0 }],
|
|||
|
|
current: [],
|
|||
|
|
brandtotal: null,
|
|||
|
|
modeltotal: null,
|
|||
|
|
romtotal: null,
|
|||
|
|
default_brand_id: null,
|
|||
|
|
default_model_id: null
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
computed: {
|
|||
|
|
...mapGetters([
|
|||
|
|
'is_warranty_query', // 1查询，2不查询
|
|||
|
|
'user_id'
|
|||
|
|
]),
|
|||
|
|
date() {
|
|||
|
|
var date = new Date()
|
|||
|
|
return date.toLocaleDateString()
|
|||
|
|
},
|
|||
|
|
sumprice() {
|
|||
|
|
var price = 0
|
|||
|
|
this.tableData.map((res) => {
|
|||
|
|
price += Number(res.price)
|
|||
|
|
})
|
|||
|
|
return price
|
|||
|
|
},
|
|||
|
|
aaa() {
|
|||
|
|
const obj = JSON.parse(JSON.stringify(this.formLabelAlign))
|
|||
|
|
for (const key in obj) {
|
|||
|
|
this.input.map((res, index) => {
|
|||
|
|
if (res.enName == key) {
|
|||
|
|
if (Array.isArray(res.options)) {
|
|||
|
|
res.options.map(r => {
|
|||
|
|
if (obj[key] == r.value) {
|
|||
|
|
obj[key] = r.label
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
// window.localStorage.setItem("setform",JSON.stringify(this.formLabelAlign));//存储
|
|||
|
|
return obj
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
watch: {
|
|||
|
|
// 'brandform.cate_id':{
|
|||
|
|
// handler(val){
|
|||
|
|
// if (!!val) {
|
|||
|
|
// this.current=[val]
|
|||
|
|
// }
|
|||
|
|
// },deep:true,immediate:true
|
|||
|
|
// },
|
|||
|
|
current: {
|
|||
|
|
handler(val) {
|
|||
|
|
if (val[0]) {
|
|||
|
|
this.brandform.cate_id = val[0]
|
|||
|
|
this.getbrand()
|
|||
|
|
this.brandform.brand_id = null
|
|||
|
|
this.brandform.model_id = null
|
|||
|
|
this.brandform.rom_id = null
|
|||
|
|
this.brandform.color_id = null
|
|||
|
|
this.model_options = []
|
|||
|
|
this.rom_options = []
|
|||
|
|
this.color_options = []
|
|||
|
|
} else {
|
|||
|
|
this.brandform.cate_id = 71510 // 默认手机
|
|||
|
|
this.brandform.brand_id = 71510
|
|||
|
|
this.getbrand()
|
|||
|
|
}
|
|||
|
|
}, deep: true, immediate: true
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
created() {
|
|||
|
|
this.getcate()
|
|||
|
|
},
|
|||
|
|
mounted() {
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
props: {
|
|||
|
|
brandshow: {
|
|||
|
|
type: Boolean,
|
|||
|
|
default: () => {
|
|||
|
|
return false
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
tableData: {
|
|||
|
|
type: Array,
|
|||
|
|
default: () => {
|
|||
|
|
return []
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
brandform: {
|
|||
|
|
type: Object,
|
|||
|
|
default: () => {
|
|||
|
|
return {}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
id: {
|
|||
|
|
type: String,
|
|||
|
|
default: () => {
|
|||
|
|
return ''
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
input: {
|
|||
|
|
type: Array,
|
|||
|
|
default: () => {
|
|||
|
|
return []
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
formLabelAlign: {
|
|||
|
|
type: Object,
|
|||
|
|
default: () => {
|
|||
|
|
return {}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
jiqidata: {
|
|||
|
|
type: Array,
|
|||
|
|
default: () => {
|
|||
|
|
return []
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
inputchange(queryString, callback) {
|
|||
|
|
if (!!queryString && queryString.length >= 2) {
|
|||
|
|
// 调用的后台接口
|
|||
|
|
cate_brand_list({ keywords: queryString }).then((res) => {
|
|||
|
|
callback(res.datas)
|
|||
|
|
}).catch((error) => {
|
|||
|
|
})
|
|||
|
|
} else {
|
|||
|
|
callback([])
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 是否查询状态改变
|
|||
|
|
warrantychange(e) {
|
|||
|
|
user_warranty_query({ user_id: this.user_id, is_warranty_query: e }).then(res => {
|
|||
|
|
this.$message({ type: 'success', message: e == 1 ? '查询已开启' : '查询已关闭' })
|
|||
|
|
this.$store.dispatch('user/getInfo')
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
getcate() {
|
|||
|
|
cate_brand_list().then(res => {
|
|||
|
|
this.current = [this.brandform.cate_id]
|
|||
|
|
this.cate_options = res.datas.datas
|
|||
|
|
})
|
|||
|
|
res_advanced_search().then(e => {
|
|||
|
|
this.quote_user_options = e.datas['quote_user_id']
|
|||
|
|
this.customer_options = e.datas['supplier_info']
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
getbrand(page) {
|
|||
|
|
cate_brand_list({ cate_id: this.brandform.cate_id, list_row: 10, page: page, default_brand_id: this.default_brand_id }).then(res => {
|
|||
|
|
this.brand_options = res.datas.datas
|
|||
|
|
this.brandtotal = res.datas.total
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
getmodel(page) {
|
|||
|
|
cate_brand_list({ cate_id: this.brandform.cate_id, list_row: 10, page: page, brand_id: this.brandform.brand_id, default_model_id: this.default_model_id, default_brand_id: this.default_brand_id }).then(res => {
|
|||
|
|
this.model_options = res.datas.datas
|
|||
|
|
this.modeltotal = res.datas.total
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
async handleSelect(data) {
|
|||
|
|
await this.$set(this.brandform, 'cate_id', data.cate_id)
|
|||
|
|
await this.$set(this, 'default_brand_id', data.brand_id)
|
|||
|
|
await this.$set(this, 'current', [data.cate_id])
|
|||
|
|
await this.$set(this.brandform, 'brand_id', data.brand_id)
|
|||
|
|
await this.$set(this, 'default_model_id', data.model_id)
|
|||
|
|
await this.$set(this.brandform, 'model_id', data.model_id)
|
|||
|
|
this.$set(this.brandform, 'rom_id', null)
|
|||
|
|
this.$set(this.brandform, 'color_id', null)
|
|||
|
|
// await this.getbrand()
|
|||
|
|
await this.getmodel()
|
|||
|
|
await this.getromcolor()
|
|||
|
|
},
|
|||
|
|
getromcolor(page) {
|
|||
|
|
cate_brand_list({ cate_id: this.brandform.cate_id, list_row: 10, page: page, brand_id: this.brandform.brand_id, model_id: this.brandform.model_id, default_model_id: this.default_model_id, default_brand_id: this.default_brand_id }).then(res => {
|
|||
|
|
this.rom_options = res.datas.datas['rom_list']
|
|||
|
|
this.color_options = res.datas.datas['color_list']
|
|||
|
|
this.romtotal = res.datas.total
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
editinfo() {
|
|||
|
|
if (this.brandform.res_id) { // 采购单
|
|||
|
|
purchase_order_edit_phone(this.brandform).then(res => {
|
|||
|
|
this.$parent.getlist()
|
|||
|
|
this.handleClose()
|
|||
|
|
if (this.brandform.warranty_query_info_id) {
|
|||
|
|
const obj = { warranty_query_info_id: this.brandform.warranty_query_info_id, cate_id: this.brandform['cate_id'], brand_id: this.brandform['brand_id'],
|
|||
|
|
model_id: this.brandform['model_id'], rom_id: this.brandform['rom_id'], color_id: this.brandform['color_id'] }
|
|||
|
|
ai_model_update_v2(obj).then(res => {})
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
} else {
|
|||
|
|
edit_drafts_box({ ...this.brandform, client_type: 2 }).then(res => {
|
|||
|
|
if (this.brandform.warranty_query_info_id) {
|
|||
|
|
const obj = { warranty_query_info_id: this.brandform.warranty_query_info_id, cate_id: this.brandform['cate_id'], brand_id: this.brandform['brand_id'],
|
|||
|
|
model_id: this.brandform['model_id'], rom_id: this.brandform['rom_id'], color_id: this.brandform['color_id'] }
|
|||
|
|
ai_model_update_v2(obj).then(res => {})
|
|||
|
|
}
|
|||
|
|
this.$parent.getlist()
|
|||
|
|
this.handleClose()
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
change(val, name) {
|
|||
|
|
if (name == 'cate_id') {
|
|||
|
|
this.form.brand_id = null
|
|||
|
|
this.form.model_id = null
|
|||
|
|
this.form.rom_id = null
|
|||
|
|
this.form.color_id = null
|
|||
|
|
if (val) {
|
|||
|
|
cate_brand_list_all({ cate_id: val }).then(res => {
|
|||
|
|
this.brand_options = res.datas
|
|||
|
|
})
|
|||
|
|
} else {
|
|||
|
|
this.brand_options = []
|
|||
|
|
this.rom_options = []
|
|||
|
|
this.color_options = []
|
|||
|
|
}
|
|||
|
|
} else if (name == 'brand_id') {
|
|||
|
|
this.form.model_id = null
|
|||
|
|
this.form.rom_id = null
|
|||
|
|
this.form.color_id = null
|
|||
|
|
if (val) {
|
|||
|
|
cate_brand_list_all({ cate_id: this.form.cate_id, brand_id: val }).then(res => {
|
|||
|
|
this.model_options = res.datas
|
|||
|
|
})
|
|||
|
|
} else {
|
|||
|
|
this.model_options = []
|
|||
|
|
this.rom_options = []
|
|||
|
|
this.color_options = []
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
this.form.rom_id = null
|
|||
|
|
this.form.color_id = null
|
|||
|
|
if (val) {
|
|||
|
|
cate_brand_list_all({ cate_id: this.form.cate_id, brand_id: this.form.brand_id, model_id: val }).then(res => {
|
|||
|
|
this.rom_options = res.datas['rom_list']
|
|||
|
|
this.color_options = res.datas['color_list']
|
|||
|
|
})
|
|||
|
|
} else {
|
|||
|
|
this.rom_options = []
|
|||
|
|
this.color_options = []
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
brandclick(e, v) {
|
|||
|
|
let target = e.target
|
|||
|
|
if (target.nodeName === 'SPAN') {
|
|||
|
|
target = e.target.parentNode
|
|||
|
|
}
|
|||
|
|
target.blur()
|
|||
|
|
this.brandform.brand_id = v.value
|
|||
|
|
this.brandform.model_id = null
|
|||
|
|
this.brandform.rom_id = null
|
|||
|
|
this.brandform.color_id = null
|
|||
|
|
this.model_options = []
|
|||
|
|
this.rom_options = []
|
|||
|
|
this.color_options = []
|
|||
|
|
this.getmodel()
|
|||
|
|
},
|
|||
|
|
modelclick(e, v) {
|
|||
|
|
let target = e.target
|
|||
|
|
if (target.nodeName === 'SPAN') {
|
|||
|
|
target = e.target.parentNode
|
|||
|
|
}
|
|||
|
|
target.blur()
|
|||
|
|
this.brandform.model_id = v.value
|
|||
|
|
this.brandform.rom_id = null
|
|||
|
|
this.brandform.color_id = null
|
|||
|
|
this.rom_options = []
|
|||
|
|
this.color_options = []
|
|||
|
|
this.getromcolor()
|
|||
|
|
},
|
|||
|
|
romclick(e, v) {
|
|||
|
|
let target = e.target
|
|||
|
|
if (target.nodeName === 'SPAN') {
|
|||
|
|
target = e.target.parentNode
|
|||
|
|
}
|
|||
|
|
target.blur()
|
|||
|
|
this.brandform.rom_id = v.value
|
|||
|
|
},
|
|||
|
|
colorclick(e, v) {
|
|||
|
|
let target = e.target
|
|||
|
|
if (target.nodeName === 'SPAN') {
|
|||
|
|
target = e.target.parentNode
|
|||
|
|
}
|
|||
|
|
target.blur()
|
|||
|
|
this.brandform.color_id = v.value
|
|||
|
|
},
|
|||
|
|
currentchange(data) {
|
|||
|
|
this.getbrand(data)
|
|||
|
|
},
|
|||
|
|
currentchange1(data) {
|
|||
|
|
this.getmodel(data)
|
|||
|
|
},
|
|||
|
|
currentchange2(data) {
|
|||
|
|
this.getromcolor(data)
|
|||
|
|
},
|
|||
|
|
handleClose() {
|
|||
|
|
this.$set(this, 'keywords', '')
|
|||
|
|
this.model_options = []
|
|||
|
|
this.rom_options = []
|
|||
|
|
this.color_options = []
|
|||
|
|
this.$emit('update:brandshow', false)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="less" scoped>
|
|||
|
|
::v-deep .el-dialog__header{
|
|||
|
|
padding: 10px 20px 0px;
|
|||
|
|
}
|
|||
|
|
.bodyclass{
|
|||
|
|
margin-top:10px;
|
|||
|
|
display: flex;
|
|||
|
|
//height: 720px;
|
|||
|
|
}
|
|||
|
|
.bodyclass ::v-deep .el-button{
|
|||
|
|
padding: 8px;
|
|||
|
|
}
|
|||
|
|
// .btnclass ::v-deep .el-button--primary:focus{
|
|||
|
|
// margin-right: 12px;
|
|||
|
|
// border-radius: 2px;
|
|||
|
|
// box-shadow: 0 2px 4px 0 #f4f4f4;
|
|||
|
|
// color: #2794f8;
|
|||
|
|
// background: white;
|
|||
|
|
// }
|
|||
|
|
.btnclass ::v-deep .el-button--primary:hover{
|
|||
|
|
border-radius: 2px;
|
|||
|
|
color: #2794f8;
|
|||
|
|
background: #d2e6fc;
|
|||
|
|
border-color:#b3d8ff ;
|
|||
|
|
}
|
|||
|
|
.body {
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
}
|
|||
|
|
.body-text {
|
|||
|
|
// display: flex;
|
|||
|
|
// flex-direction: column;
|
|||
|
|
margin-bottom: 15px;
|
|||
|
|
}
|
|||
|
|
.header {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
margin-bottom: 25px;
|
|||
|
|
}
|
|||
|
|
.text {
|
|||
|
|
font-size: 20px;
|
|||
|
|
font-weight: bold;
|
|||
|
|
}
|
|||
|
|
.text1 {
|
|||
|
|
font-size: 18px;
|
|||
|
|
// height: 20px;
|
|||
|
|
}
|
|||
|
|
.calculation {
|
|||
|
|
border: 1px solid #ebeef5;
|
|||
|
|
padding: 10px;
|
|||
|
|
font-size: 14px;
|
|||
|
|
span {
|
|||
|
|
padding: 0 10px;
|
|||
|
|
display: inline-block;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
table,td,th {
|
|||
|
|
border: 1px solid #d4d4d4;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
table {
|
|||
|
|
border-collapse: collapse;
|
|||
|
|
height: 100px;
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
th {
|
|||
|
|
height: 65px;
|
|||
|
|
}
|
|||
|
|
.top{
|
|||
|
|
display: flex;
|
|||
|
|
background-color:#4ca48c;
|
|||
|
|
height:60px
|
|||
|
|
}
|
|||
|
|
.top-text{
|
|||
|
|
font-family: STHeiti;
|
|||
|
|
color: #fff;
|
|||
|
|
font-size: 26px;
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
.top-text1{
|
|||
|
|
font-family: STHeiti;
|
|||
|
|
color: #fff;
|
|||
|
|
font-size: 12px;
|
|||
|
|
}
|
|||
|
|
.fotter-top{
|
|||
|
|
display: flex;
|
|||
|
|
background-color:#4ca48c;
|
|||
|
|
height:60px;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
align-items: center;
|
|||
|
|
padding: 0 30px;
|
|||
|
|
}
|
|||
|
|
.footer-Toptext{
|
|||
|
|
font-family: STHeiti;
|
|||
|
|
color: #fff;
|
|||
|
|
font-size: 24px;
|
|||
|
|
}
|
|||
|
|
.fotter-main{
|
|||
|
|
display: flex;
|
|||
|
|
// background-color:#fff;
|
|||
|
|
height:30px;
|
|||
|
|
justify-content: center;
|
|||
|
|
}
|
|||
|
|
.footer-maintext{
|
|||
|
|
font-family: STHeiti;
|
|||
|
|
color:#FFFFFF;
|
|||
|
|
font-size: 20px;
|
|||
|
|
}
|
|||
|
|
.el-col-6{
|
|||
|
|
width: 20%!important;
|
|||
|
|
}
|
|||
|
|
.level{
|
|||
|
|
display: inline-block;
|
|||
|
|
height: 20px;
|
|||
|
|
line-height: 20px;
|
|||
|
|
padding: 0 15px;
|
|||
|
|
background: #ff633c;
|
|||
|
|
border-radius: 12px;
|
|||
|
|
font-size: 12px;;
|
|||
|
|
font-weight: 500;
|
|||
|
|
color: #fff;
|
|||
|
|
cursor: pointer;
|
|||
|
|
margin:0px 10px;
|
|||
|
|
}
|
|||
|
|
.paiclass{
|
|||
|
|
height: 40px;
|
|||
|
|
background: #f2f2f2;
|
|||
|
|
display: flex;
|
|||
|
|
font-size: 16px;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
</style>
|