From a8ca0e26f96bcb7045a2a6d4ac0c7c6213ec0084 Mon Sep 17 00:00:00 2001 From: zhangxiaoxu123 <819527061@qq.com> Date: 星期四, 29 十二月 2022 17:17:59 +0800 Subject: [PATCH] 发票页面样式 --- src/components/page/invoice/index.vue | 29 +++++++++++++++++++++-------- 1 files changed, 21 insertions(+), 8 deletions(-) diff --git a/src/components/page/invoice/index.vue b/src/components/page/invoice/index.vue index 6042394..0af4b3e 100644 --- a/src/components/page/invoice/index.vue +++ b/src/components/page/invoice/index.vue @@ -2,6 +2,7 @@ <div class="invoice-wrap"> <div class="invoice-main"> <img class="logoPhone" src="@/assets/images/logoImg.png" alt=""> + <h1>鍙戠エ鏌ヨ</h1> </div> <div class="invoice-main2"> <el-form @@ -13,15 +14,15 @@ prop="carNo" class="carNum" label="杞︾墝鍙�:" - label-width="100px"> + label-width="80px"> <el-input v-model="form.carNo" placeholder="杈撳叆杞︾墝鍙�"></el-input> </el-form-item> <el-form-item - prop="mobile" + prop="phone" class="carNum" label="鎵嬫満鍙�:" - label-width="100px"> - <el-input v-model="form.mobile" placeholder="杈撳叆鎵嬫満鍙�"></el-input> + label-width="80px"> + <el-input v-model="form.phone" placeholder="杈撳叆鎵嬫満鍙�"></el-input> </el-form-item> <el-form-item class="invoice-btn"> <el-button @@ -53,13 +54,13 @@ return { form: { carNo:'', - mobile:'' + phone:'' }, rules:{ carNo: [ {required: true, message: '杞︾墝鍙风爜涓嶈兘涓虹┖',trigger: 'blur'} ], - mobile: [ + phone: [ { required: true, message: '鎵嬫満鍙蜂笉鑳戒负绌�' }, {validator: validateMobile, trigger: 'blur'} ] @@ -74,7 +75,7 @@ path: '/invoiceForm', query: { carNo: this.form.carNo, - //mobile: this.form.mobile + phone: this.form.phone } }) } @@ -86,9 +87,14 @@ </script> <style lang="scss" scoped> + *{ + font-family: '鑻规柟'; + color: #626262; + } ::v-deep{ .el-form{ width: 88%; + padding-right: 2.67vw /* 20/7.5 */; } .el-form-item__content{ display: flex; @@ -103,8 +109,15 @@ .invoice-main{ width: 100%; display: flex; + flex-direction: column; justify-content: center; + align-items: center; margin-top: 10vw; + h1{ + font-size: 3.73vw /* 28/7.5 */; + line-height: 2; + margin-top: 2.67vw /* 20/7.5 */; + } } .logoPhone{ margin-top: 10vw; @@ -116,7 +129,7 @@ display: flex; justify-content: center; margin-top: 10vw; - height: calc(100% - 50vw); + height: calc(100% - 60vw); position: relative; } .jiaofei-btn{ -- Gitblit v1.9.1