purovps/jshERP
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化零售出库和退货的页面样式

Browse Source
This commit is contained in:
季圣华
2021-12-15 23:29:49 +08:00
parent 94313bb177
commit 0591041f83
2 changed files with 123 additions and 94 deletions
Download Patch File Download Diff File Expand all files Collapse all files

104
jshERP-web/src/views/bill/modules/RetailBackModal.vue
View File

@@ -88,56 +88,62 @@
</a-row> </a-row>
</template> </template>
</j-editable-table> </j-editable-table>
</a-col>
<a-col :lg="6" :md="12" :sm="24">
<a-row class="form-row" :gutter="24"> <a-row class="form-row" :gutter="24">
<a-col :lg="24" :md="6" :sm="6"><br/><br/></a-col> <a-col :lg="24" :md="24" :sm="24">
<a-col :lg="24" :md="6" :sm="6"> <a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label="">
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据金额"> <a-textarea :rows="1" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/>
<a-input v-decorator.trim="[ 'changeAmount' ]" :style="{color:'purple'}" :readOnly="true"/>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :lg="24" :md="6" :sm="6"> </a-row>
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="付款金额"> <a-row class="form-row" :gutter="24">
<a-input v-decorator.trim="[ 'getAmount' ]" :style="{color:'red'}" defaultValue="0" @keyup="onKeyUpGetAmount"/> <a-col :lg="6" :md="12" :sm="24">
</a-form-item> <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="附件">
</a-col> <j-upload v-model="fileList" bizPath="bill"></j-upload>
<a-col :lg="24" :md="6" :sm="6">
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="找零">
<a-input v-decorator.trim="[ 'backAmount' ]" :style="{color:'green'}" :readOnly="true" defaultValue="0"/>
</a-form-item>
</a-col>
<a-col :lg="24" :md="6" :sm="6">
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="付款账户">
<a-select placeholder="选择付款账户" v-decorator="[ 'accountId', validatorRules.accountId ]" :dropdownMatchSelectWidth="false">
<div slot="dropdownRender" slot-scope="menu">
<v-nodes :vnodes="menu" />
<a-divider style="margin: 4px 0;" />
<div v-if="isTenant" style="padding: 4px 8px; cursor: pointer;"
@mousedown="e => e.preventDefault()" @click="addAccount"><a-icon type="plus" /> 新增结算账户</div>
</div>
<a-select-option v-for="(item,index) in accountList" :key="index" :value="item.id">
{{ item.name }}
</a-select-option>
</a-select>
</a-form-item> </a-form-item>
</a-col> </a-col>
</a-row> </a-row>
</a-col> </a-col>
</a-row> <div class="sign">
<a-row class="form-row" :gutter="24"> <a-col :lg="6" :md="12" :sm="24">
<a-col :lg="24" :md="24" :sm="24"> <a-row class="form-row" :gutter="24">
<a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label=""> <a-col :lg="24" :md="6" :sm="6"><br/><br/></a-col>
<a-textarea :rows="1" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/> <a-col :lg="24" :md="6" :sm="6">
</a-form-item> <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol">
</a-col> <span slot="label" style="font-size: 24px;line-height:24px">单据金额</span>
</a-row> <a-input v-decorator.trim="[ 'changeAmount' ]" :style="{color:'purple'}" :readOnly="true"/>
<a-row class="form-row" :gutter="24"> </a-form-item>
<a-col :lg="6" :md="12" :sm="24"> </a-col>
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="附件"> <a-col :lg="24" :md="6" :sm="6">
<j-upload v-model="fileList" bizPath="bill"></j-upload> <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol">
</a-form-item> <span slot="label" style="font-size: 24px;line-height:24px">付款金额</span>
</a-col> <a-input v-decorator.trim="[ 'getAmount' ]" :style="{color:'red'}" defaultValue="0" @keyup="onKeyUpGetAmount"/>
</a-form-item>
</a-col>
<a-col :lg="24" :md="6" :sm="6">
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol">
<span slot="label" style="font-size: 24px;line-height:24px">找零</span>
<a-input v-decorator.trim="[ 'backAmount' ]" :style="{color:'green'}" :readOnly="true" defaultValue="0"/>
</a-form-item>
</a-col>
<a-col :lg="24" :md="6" :sm="6">
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol">
<span slot="label" style="font-size: 24px;line-height:24px">付款账户</span>
<a-select placeholder="选择付款账户" style="font-size:20px;" v-decorator="[ 'accountId', validatorRules.accountId ]" :dropdownMatchSelectWidth="false">
<div slot="dropdownRender" slot-scope="menu">
<v-nodes :vnodes="menu" />
<a-divider style="margin: 4px 0;" />
<div v-if="isTenant" style="padding: 4px 8px; cursor: pointer;"
@mousedown="e => e.preventDefault()" @click="addAccount"><a-icon type="plus" /> 新增结算账户</div>
</div>
<a-select-option v-for="(item,index) in accountList" :key="index" :value="item.id">
{{ item.name }}
</a-select-option>
</a-select>
</a-form-item>
</a-col>
</a-row>
</a-col>
</div>
</a-row> </a-row>
</a-form> </a-form>
</a-spin> </a-spin>
@@ -265,6 +271,9 @@
if (this.action === 'add') { if (this.action === 'add') {
this.addInit(this.prefixNo) this.addInit(this.prefixNo)
this.fileList = [] this.fileList = []
this.$nextTick(() => {
this.form.setFieldsValue({'getAmount':0, 'backAmount':0})
})
} else { } else {
this.model.operTime = this.model.operTimeStr this.model.operTime = this.model.operTimeStr
if(this.model.backAmount) { if(this.model.backAmount) {
@@ -391,5 +400,12 @@
} }
</script> </script>
<style scoped> <style scoped>
.sign .ant-input{
font-size: 30px;
font-weight:bolder;
text-align:center;
border-left-width:0px!important;
border-top-width:0px!important;
border-right-width:0px!important;
}
</style> </style>

113
jshERP-web/src/views/bill/modules/RetailOutModal.vue
View File

@@ -98,61 +98,67 @@
</a-row> </a-row>
</template> </template>
</j-editable-table> </j-editable-table>
</a-col>
<a-col :lg="6" :md="12" :sm="24">
<a-row class="form-row" :gutter="24"> <a-row class="form-row" :gutter="24">
<a-col :lg="24" :md="6" :sm="6"><br/><br/></a-col> <a-col :lg="24" :md="24" :sm="24">
<a-col :lg="24" :md="6" :sm="6"> <a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label="">
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="单据金额" data-step="5" data-title="单据金额" <a-textarea :rows="1" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/>
data-intro="单据金额等于左侧商品的总金额">
<a-input v-decorator.trim="[ 'changeAmount' ]" :style="{color:'purple'}" :readOnly="true"/>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :lg="24" :md="6" :sm="6"> </a-row>
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="收款金额" data-step="6" data-title="收款金额" <a-row class="form-row" :gutter="24">
data-intro="收款金额为收银员收取用户的实际金额"> <a-col :lg="6" :md="12" :sm="24">
<a-input v-decorator.trim="[ 'getAmount' ]" :style="{color:'red'}" defaultValue="0" @keyup="onKeyUpGetAmount"/> <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="附件" data-step="9" data-title="附件"
</a-form-item> data-intro="可以上传与单据相关的图片、文档，支持多个文件">
</a-col> <j-upload v-model="fileList" bizPath="bill"></j-upload>
<a-col :lg="24" :md="6" :sm="6">
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="找零" data-step="7" data-title="找零"
data-intro="找零等于收款金额减去实收金额">
<a-input v-decorator.trim="[ 'backAmount' ]" :style="{color:'green'}" :readOnly="true" defaultValue="0"/>
</a-form-item>
</a-col>
<a-col :lg="24" :md="6" :sm="6">
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="收款账户" data-step="8" data-title="收款账户"
data-intro="收款账户的信息来自基本资料菜单下的【结算账户】">
<a-select placeholder="选择收款账户" v-decorator="[ 'accountId', validatorRules.accountId ]" :dropdownMatchSelectWidth="false">
<div slot="dropdownRender" slot-scope="menu">
<v-nodes :vnodes="menu" />
<a-divider style="margin: 4px 0;" />
<div v-if="isTenant" style="padding: 4px 8px; cursor: pointer;"
@mousedown="e => e.preventDefault()" @click="addAccount"><a-icon type="plus" /> 新增结算账户</div>
</div>
<a-select-option v-for="(item,index) in accountList" :key="index" :value="item.id">
{{ item.name }}
</a-select-option>
</a-select>
</a-form-item> </a-form-item>
</a-col> </a-col>
</a-row> </a-row>
</a-col> </a-col>
</a-row> <div class="sign">
<a-row class="form-row" :gutter="24"> <a-col :lg="6" :md="12" :sm="24">
<a-col :lg="24" :md="24" :sm="24"> <a-row class="form-row" :gutter="24">
<a-form-item :labelCol="labelCol" :wrapperCol="{xs: { span: 24 },sm: { span: 24 }}" label=""> <a-col :lg="24" :md="6" :sm="6"><br/><br/></a-col>
<a-textarea :rows="1" placeholder="请输入备注" v-decorator="[ 'remark' ]" style="margin-top:8px;"/> <a-col :lg="24" :md="6" :sm="6">
</a-form-item> <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" data-step="5" data-title="单据金额"
</a-col> data-intro="单据金额等于左侧商品的总金额">
</a-row> <span slot="label" style="font-size: 24px;line-height:24px">单据金额</span>
<a-row class="form-row" :gutter="24"> <a-input v-decorator.trim="[ 'changeAmount' ]" :style="{color:'purple'}" :readOnly="true"/>
<a-col :lg="6" :md="12" :sm="24"> </a-form-item>
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="附件" data-step="9" data-title="附件" </a-col>
data-intro="可以上传与单据相关的图片、文档，支持多个文件"> <a-col :lg="24" :md="6" :sm="6">
<j-upload v-model="fileList" bizPath="bill"></j-upload> <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" data-step="6" data-title="收款金额"
</a-form-item> data-intro="收款金额为收银员收取用户的实际金额">
</a-col> <span slot="label" style="font-size: 24px;line-height:24px">收款金额</span>
<a-input v-decorator.trim="[ 'getAmount' ]" :style="{color:'red'}" defaultValue="0" @keyup="onKeyUpGetAmount"/>
</a-form-item>
</a-col>
<a-col :lg="24" :md="6" :sm="6">
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" data-step="7" data-title="找零"
data-intro="找零等于收款金额减去实收金额">
<span slot="label" style="font-size: 24px;line-height:24px">找零</span>
<a-input v-decorator.trim="[ 'backAmount' ]" :style="{color:'green'}" :readOnly="true" defaultValue="0"/>
</a-form-item>
</a-col>
<a-col :lg="24" :md="6" :sm="6">
<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" data-step="8" data-title="收款账户"
data-intro="收款账户的信息来自基本资料菜单下的【结算账户】">
<span slot="label" style="font-size: 24px;line-height:24px">收款账户</span>
<a-select placeholder="选择收款账户" style="font-size:20px;" v-decorator="[ 'accountId', validatorRules.accountId ]" :dropdownMatchSelectWidth="false">
<div slot="dropdownRender" slot-scope="menu">
<v-nodes :vnodes="menu" />
<a-divider style="margin: 4px 0;" />
<div v-if="isTenant" style="padding: 4px 8px; cursor: pointer;"
@mousedown="e => e.preventDefault()" @click="addAccount"><a-icon type="plus" /> 新增结算账户</div>
</div>
<a-select-option v-for="(item,index) in accountList" :key="index" :value="item.id">
{{ item.name }}
</a-select-option>
</a-select>
</a-form-item>
</a-col>
</a-row>
</a-col>
</div>
</a-row> </a-row>
</a-form> </a-form>
</a-spin> </a-spin>
@@ -281,7 +287,7 @@
handleIntroJs('retailOut', 1) handleIntroJs('retailOut', 1)
}) })
this.$nextTick(() => { this.$nextTick(() => {
this.form.setFieldsValue({'payType': '现付'}) this.form.setFieldsValue({'payType': '现付', 'getAmount':0, 'backAmount':0})
}) })
} else { } else {
this.model.operTime = this.model.operTimeStr this.model.operTime = this.model.operTimeStr
@@ -390,5 +396,12 @@
} }
</script> </script>
<style scoped> <style scoped>
.sign .ant-input{
font-size: 30px;
font-weight:bolder;
text-align:center;
border-left-width:0px!important;
border-top-width:0px!important;
border-right-width:0px!important;
}
</style> </style>