erp-el-element/Dialog/EditIteminfo.vue

477 lines
16 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<el-dialog
title="编辑属性"
:visible.sync="editshow"
width="1000px"
top="5vh"
append-to-body
:close-on-click-modal = "false"
:before-close="handleClose"
>
<div class="main" >
<!-- 基础信息 -->
<div>
<h3 style="font-weight: bold;">基础信息</h3>
<el-form ref="form" :model="attributeform" :inline="true" label-width="80px">
<el-form-item label="客户" required>
<el-select v-model="attributeform.customer_id" :disabled="!!attributeform.res_id" size="small" placeholder="请选择客户" filterable clearable>
<el-option v-for="(e,i) in customer_options" :key="i" :label="e.label" :value="e.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="价格" required>
<el-input v-model="attributeform.pay_amount" :disabled="!!attributeform.res_id && ($route.name!='Purchase_order_Details'|| attributeform.pay_id>0 )" @input="attributeform['pay_amount'] = AmountInput(attributeform['pay_amount'],2,'exceed')" size="small" placeholder="请输入价格" clearable></el-input>
</el-form-item>
<el-form-item label="零售价">
<el-input v-model="attributeform.retail_price" size="small" placeholder="请输入零售价" clearable></el-input>
</el-form-item>
<el-form-item label="参考价" v-if="formLabelAlign && formLabelAlign['warehousing_type'] == 2">
<el-input v-model="attributeform.reference_price" size="small" placeholder="请输入参考价" clearable></el-input>
</el-form-item>
</el-form>
</div>
<!-- 属性 -->
<div>
<h3 style="font-weight: bold;">属性</h3>
<el-form ref="form" :model="attributeform" :inline="true" label-width="95px">
<el-form-item label="质检员" prop="op_user_id">
<el-select v-model="attributeform.op_user_id" size="small" placeholder="请选择质检员" filterable clearable>
<el-option v-for="(e,i) in op_user_id_options" :key="i" :label="e.label" :value="e.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="报价师" >
<el-select v-model="attributeform.quote_user_id" size="small" placeholder="请选择报价师" filterable clearable>
<el-option v-for="(e,i) in quote_user_options" :key="i" :label="e.label" :value="e.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="ID锁" >
<el-select v-model="attributeform.fmi_lock" size="small" placeholder="请选择ID锁" filterable clearable>
<el-option v-for="(e,i) in id_options" :key="i" :label="e.label" :value="e.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="国别" >
<el-select v-model="attributeform.countries" size="small" placeholder="请选择国别" filterable clearable>
<el-option v-for="(e,i) in countries_options" :key="i" :label="e.label" :value="e.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="机器等级(成色)" >
<el-select v-model="attributeform.grade" size="small" placeholder="请选择机器等级(成色)" filterable clearable>
<el-option v-for="(e,i) in grade_options" :key="i" :label="e.label" :value="e.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="系统版本">
<el-input v-model="attributeform.sys_net_no" size="small" placeholder="请输入系统版本" clearable></el-input>
</el-form-item>
<el-form-item label="电池健康">
<el-input v-model="attributeform.battery_health" oninput="value=value.replace(/^(0+)|[^\d]+/g,'')" size="small" placeholder="请输入电池健康" clearable>
<span slot="suffix">%</span>
</el-input>
</el-form-item>
<el-form-item label="充电次数">
<el-input v-model="attributeform.recharge_num" size="small" oninput="value=value.replace(/^(0+)|[^\d]+/g,'')" placeholder="请输入充电次数" clearable></el-input>
</el-form-item>
<el-form-item label="网络制式" >
<el-select v-model="attributeform.network" size="small" placeholder="请选择网络制式" filterable clearable>
<el-option v-for="(e,i) in network_options" :key="i" :label="e.label" :value="e.value"></el-option>
</el-select>
</el-form-item>
</el-form>
</div>
<!-- 备注 -->
<div>
<h3 style="font-weight: bold;">备注</h3>
<div class="flex-b">
<div>
<el-input type="textarea" :rows="3" resize="none" placeholder="请输入备注" v-model="attributeform.remark"></el-input>
</div>
</div>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="handleClose()">取 消</el-button>
<el-button type="primary" @click="editinfo">确认</el-button>
</span>
</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,purchase_order_edit_phone,edit_drafts_box} from "@/api/Warehousing"; //获取客户信息接口
import { res_advanced_search } from "@/api/machineList"; //获取机器列表信息接口
import {pre_print} from "@/api/machineList"; //获取列表信息接口
import { op_order_details_code } from "@/api/Warehousing"; //获取二维码信息接口
import { mapGetters } from 'vuex'
export default {
name: "Warehousingprint",
data() {
return {
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:[],
customer_options:[],
quote_user_options:[],
grade_options:[],
network_options:[],
op_user_id_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 },]
};
},
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(){
let obj = JSON.parse(JSON.stringify(this.formLabelAlign))
for(let 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:{
'is_warranty_query':{
handler(val){
this.warranty_query=val
},deep:true,immediate:true
}
},
created(){
this.getcate()
// if(localStorage.getItem("setform")){
// let lastname = JSON.parse(localStorage.getItem("setform"));//读取
// this.formLabelAlign = lastname
// }
// console.log(this.formLabelAlign,'thisformLabelAlign')
},
props: {
editshow: {
type: Boolean,
default: () => {
return false;
},
},
tableData: {
type: Array,
default: () => {
return [];
},
},
attributeform: {
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: {
//是否查询状态改变
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_all().then(res=>{
this.cate_options=res.datas
})
res_advanced_search({p_user_id:this.attributeform.company_user_id}).then(e=>{
this.op_user_id_options=e.datas['op_user_id']
this.quote_user_options=e.datas['quote_user_id']
this.customer_options=e.datas['supplier_info']
this.grade_options=e.datas['grade_list']
this.network_options=e.datas['network']
})
},
editinfo(){
if (!!this.attributeform.res_id) {//采购单
purchase_order_edit_phone(this.attributeform).then(res=>{
this.$parent.getlist()
this.handleClose()
})
}else{
edit_drafts_box({...this.attributeform,client_type:2}).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=[]
}
}
},
romclick(e,v){
let target = e.target
if (target.nodeName === 'SPAN') {
target = e.target.parentNode
}
target.blur()
this.form.rom_id=v.value
},
colorclick(e,v){
let target = e.target
if (target.nodeName === 'SPAN') {
target = e.target.parentNode
}
target.blur()
this.form.color_id=v.value
},
toImg() { // 转图片打印
window.pageYoffset = 0;
document.documentElement.scrollTop = 0;
document.body.scrollTop = 0;
html2canvas(this.$refs.printTest, {
backgroundColor: false,
useCORS: true,
allowTaint: true,
}).then((canvas) => {
const url = canvas.toDataURL()
this.img = url
printJS({
printable: url,
type: 'image',
documentTitle: '打印'
})
// console.log(url)
})
},
handleClose() {
this.$emit("update:editshow", false);
},
share() { // 转发
op_order_details_code({order_op_id:this.id}).then((res) => {
this.$delete(this.formLabelAlign,'phone_list');
var list = JSON.stringify(this.formLabelAlign)
var host = window.location.host;
var http = window.location.protocol
// console.log(`${http}`+'//'+`${host}/#/share2?uuid=`+res.datas.uuid+'&formLabelAlign='+list)
new QRCode(this.$refs.qrCodeUrl, {
// text:'https://erpv2.aiguovip.com/#/share/share?uuid='+res.datas.uuid,
text:`${http}`+'//'+`${host}/#/share2?uuid=`+this.id+'&formLabelAlign='+list,
width: 120,
height: 110,
colorDark: "#333333", //二维码颜色
colorLight: "#ffffff", //二维码背景色
correctLevel: QRCode.CorrectLevel.L, //容错率L/M/H
});
})
},
//隐藏二维码
hide() {
this.$nextTick(function () {
this.$refs.qrCodeUrl.innerHTML = "";
});
},
},
};
</script>
<style lang="less" scoped>
// .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;
}
</style>