改造单据中的序列号输入框,改为可以从弹出框中输入(增加默认输入格式提示)

This commit is contained in:
季圣华
2022-09-07 23:38:11 +08:00
parent 2237252e9e
commit 489040d104
5 changed files with 104 additions and 101 deletions

View File

@@ -1,98 +1,101 @@
<template> <template>
<a-popover trigger="contextmenu" v-model="visible" :placement="position"> <a-popover trigger="contextmenu" v-model="visible" :placement="position">
<!--"(node) => node.parentNode.parentNode"--> <!--"(node) => node.parentNode.parentNode"-->
<div slot="title"> <div slot="title">
<span>{{ title }}</span> <span>{{ title }}</span>
<span style="float: right" title="关闭"> <span style="float: right" title="关闭">
<a-icon type="close" @click="visible=false"/> <a-icon type="close" @click="visible=false"/>
</span> </span>
</div> </div>
<a-input :value="inputContent" @change="handleInputChange"> <a-input :value="inputContent" @change="handleInputChange" :placeholder="placeholder">
<a-icon slot="suffix" type="fullscreen" @click.stop="pop" /> <a-icon slot="suffix" type="fullscreen" @click.stop="pop" />
</a-input> </a-input>
<div slot="content"> <div slot="content">
<textarea :value="inputContent" @input="handleInputChange" :style="{ height: height + 'px', width: width + 'px' }"></textarea> <textarea :value="inputContent" @input="handleInputChange" :placeholder="placeholder" :style="{ height: height + 'px', width: width + 'px' }"></textarea>
</div> </div>
</a-popover> </a-popover>
</template> </template>
<script> <script>
export default { export default {
name: 'JInputPop', name: 'JInputPop',
props:{ props:{
title:{ title:{
type:String, type:String,
default:'', default:'',
required:false required:false
}, },
position:{ position:{
type:String, type:String,
default:'right', default:'right',
required:false required:false
}, },
height:{ height:{
type:Number, type:Number,
default:200, default:200,
required:false required:false
}, },
width:{ width:{
type:Number, type:Number,
default:150, default:150,
required:false required:false
}, },
value:{ value:{
type:String, type:String,
required:false required:false
}, },
popContainer:{ popContainer:{
type:String, type:String,
default:'', default:'',
required:false required:false
} },
placeholder:{
}, type:String,
data(){ required:false
return { },
visible:false, },
inputContent:'' data(){
return {
} visible:false,
}, inputContent:''
watch:{ }
value:{ },
immediate:true,
handler:function(){ watch:{
if(this.value && this.value.length>0){ value:{
this.inputContent = this.value; immediate:true,
} handler:function(){
} if(this.value && this.value.length>0){
}, this.inputContent = this.value;
}, }
model: { }
prop: 'value', },
event: 'change' },
}, model: {
methods:{ prop: 'value',
handleInputChange(event){ event: 'change'
this.inputContent = event.target.value },
this.$emit('change',this.inputContent) methods:{
}, handleInputChange(event){
pop(){ this.inputContent = event.target.value
this.visible=true this.$emit('change',this.inputContent)
}, },
getPopupContainer(node){ pop(){
if(!this.popContainer){ this.visible=true
return node.parentNode },
}else{ getPopupContainer(node){
return document.getElementById(this.popContainer) if(!this.popContainer){
} return node.parentNode
}else{
} return document.getElementById(this.popContainer)
} }
}
</script> }
}
<style scoped> }
</script>
<style scoped>
</style> </style>

View File

@@ -172,7 +172,7 @@
{ title: '扩展信息', key: 'materialOther', width: '5%', type: FormTypes.normal }, { title: '扩展信息', key: 'materialOther', width: '5%', type: FormTypes.normal },
{ title: '库存', key: 'stock', width: '5%', type: FormTypes.normal }, { title: '库存', key: 'stock', width: '5%', type: FormTypes.normal },
{ title: '单位', key: 'unit', width: '4%', type: FormTypes.normal }, { title: '单位', key: 'unit', width: '4%', type: FormTypes.normal },
{ title: '序列号', key: 'snList', width: '12%', type: FormTypes.input, placeholder: '多个序列号用逗号隔开', { title: '序列号', key: 'snList', width: '12%', type: FormTypes.input, placeholder: '多个序列号用逗号隔开',
validateRules: [{ pattern: /^\S{1,100}$/, message: '请小于100位字符' }] validateRules: [{ pattern: /^\S{1,100}$/, message: '请小于100位字符' }]
}, },
{ title: '批号', key: 'batchNumber', width: '5%', type: FormTypes.input }, { title: '批号', key: 'batchNumber', width: '5%', type: FormTypes.input },

View File

@@ -269,7 +269,7 @@
{ title: '扩展信息', key: 'materialOther', width: '5%', type: FormTypes.normal }, { title: '扩展信息', key: 'materialOther', width: '5%', type: FormTypes.normal },
{ title: '库存', key: 'stock', width: '5%', type: FormTypes.normal }, { title: '库存', key: 'stock', width: '5%', type: FormTypes.normal },
{ title: '单位', key: 'unit', width: '4%', type: FormTypes.normal }, { title: '单位', key: 'unit', width: '4%', type: FormTypes.normal },
{ title: '序列号', key: 'snList', width: '12%', type: FormTypes.input, placeholder: '多个序列号用逗号隔开', { title: '序列号', key: 'snList', width: '12%', type: FormTypes.input, placeholder: '多个序列号用逗号隔开',
validateRules: [{ pattern: /^\S{1,100}$/, message: '请小于100位字符' }] validateRules: [{ pattern: /^\S{1,100}$/, message: '请小于100位字符' }]
}, },
{ title: '批号', key: 'batchNumber', width: '5%', type: FormTypes.input }, { title: '批号', key: 'batchNumber', width: '5%', type: FormTypes.input },

View File

@@ -231,7 +231,7 @@
{ title: '扩展信息', key: 'materialOther', width: '7%', type: FormTypes.normal }, { title: '扩展信息', key: 'materialOther', width: '7%', type: FormTypes.normal },
{ title: '库存', key: 'stock', width: '5%', type: FormTypes.normal }, { title: '库存', key: 'stock', width: '5%', type: FormTypes.normal },
{ title: '单位', key: 'unit', width: '5%', type: FormTypes.normal }, { title: '单位', key: 'unit', width: '5%', type: FormTypes.normal },
{ title: '序列号', key: 'snList', width: '12%', type: FormTypes.input, placeholder: '多个序列号用逗号隔开', { title: '序列号', key: 'snList', width: '12%', type: FormTypes.input, placeholder: '多个序列号用逗号隔开',
validateRules: [{ pattern: /^\S{1,100}$/, message: '请小于100位字符' }] validateRules: [{ pattern: /^\S{1,100}$/, message: '请小于100位字符' }]
}, },
{ title: '批号', key: 'batchNumber', width: '7%', type: FormTypes.input }, { title: '批号', key: 'batchNumber', width: '7%', type: FormTypes.input },

View File

@@ -247,7 +247,7 @@
{ title: '扩展信息', key: 'materialOther', width: '5%', type: FormTypes.normal }, { title: '扩展信息', key: 'materialOther', width: '5%', type: FormTypes.normal },
{ title: '库存', key: 'stock', width: '5%', type: FormTypes.normal }, { title: '库存', key: 'stock', width: '5%', type: FormTypes.normal },
{ title: '单位', key: 'unit', width: '4%', type: FormTypes.normal }, { title: '单位', key: 'unit', width: '4%', type: FormTypes.normal },
{ title: '序列号', key: 'snList', width: '12%', type: FormTypes.input, placeholder: '多个序列号用逗号隔开', { title: '序列号', key: 'snList', width: '12%', type: FormTypes.input, placeholder: '多个序列号用逗号隔开',
validateRules: [{ pattern: /^\S{1,100}$/, message: '请小于100位字符' }] validateRules: [{ pattern: /^\S{1,100}$/, message: '请小于100位字符' }]
}, },
{ title: '批号', key: 'batchNumber', width: '5%', type: FormTypes.input }, { title: '批号', key: 'batchNumber', width: '5%', type: FormTypes.input },