ソースを参照

申请融信页面样式调整

zhanglb 4 年 前
コミット
ddaba56e3e

+ 21 - 10
front-vue/src/App.vue

@@ -126,9 +126,11 @@ export default {
     color: #333333;
     background-color: #ffffff;
 }
-.el-form-item__label-wrap .el-form-item__label{
+
+.el-form-item__label-wrap .el-form-item__label {
     font-weight: normal;
 }
+
 .zap-title__prefix {
     display: inline-block;
     margin-right: 10px;
@@ -137,9 +139,8 @@ export default {
     background-color: #4280f2;
 }
 
-
 .zap-form {
-    padding: 0 25px;
+    padding: 20px;
     background-color: #ffffff;
 }
 
@@ -149,6 +150,7 @@ export default {
 
 .zap-accounts-receivable {
     height: 36px;
+
     .label {
         font-size: 12px;
         color: #999999;
@@ -170,11 +172,17 @@ export default {
     background-color: #F6F9FF;
 }
 
-.zap-warmtips{
-    line-height: 40px;
-    font-size: 14px;
-    color: #999999;
+.zap-warmtips {
+    margin-top: 20px;
+    p {
+        padding: 0;
+        margin: 0;
+        line-height: 42px;
+        font-size: 14px;
+        color: #999999;
+    }
 }
+
 .el-tabs__item {
     width: 105px;
     height: 55px;
@@ -184,7 +192,8 @@ export default {
     font-size: 14px;
     color: #999999;
 }
-.zap-form-text{
+
+.zap-form-text {
     display: flex;
     align-items: center;
     height: 36px;
@@ -192,12 +201,14 @@ export default {
     font-size: 14px;
     color: #333333;
 }
-.zap-form-text__label{
+
+.zap-form-text__label {
     width: 112px;
     margin-right: 16px;
     text-align: right;
 }
-.zap-form-text__file{
+
+.zap-form-text__file {
     display: flex;
     align-items: center;
     width: 264px;

+ 3 - 3
front-vue/src/components/ContentTotal/index.vue

@@ -29,12 +29,12 @@ export default {
 }
 .zap-content-total__label{
     margin-left: 24px;
-    font-size: 12px;
+    font-size: 14px;
     color: #999999;
 }
 .zap-content-total__value{
-    font-size: 14px;
+    font-size: 18px;
     color: #FF2F2F;
 }
 
-</style>
+</style>

+ 7 - 0
front-vue/src/main.js

@@ -25,9 +25,14 @@ import RightToolbar from "@/components/RightToolbar"
 import ZapTip from "@/components/ZapTip"
 // 表格标题
 import ContentTitle from "@/components/ContentTitle"
+// 表格合计额
+import ContentTotal from "@/components/ContentTotal"
+// 表格顶部搜索栏
+import SearchBar from "@/components/SearchBar"
 // 日期过滤器
 import "@/filters/date.js"
 
+
 // 全局方法挂载
 Vue.prototype.getDicts = getDicts
 Vue.prototype.getConfigKey = getConfigKey
@@ -56,6 +61,8 @@ Vue.component('Pagination', Pagination)
 Vue.component('RightToolbar', RightToolbar)
 Vue.component('ZapTip', ZapTip)
 Vue.component('ContentTitle', ContentTitle)
+Vue.component('ContentTotal', ContentTotal)
+Vue.component('SearchBar', SearchBar)
 
 Vue.use(permission)
 

+ 47 - 59
front-vue/src/views/service/credit/creditApply.vue

@@ -1,8 +1,9 @@
 <template>
 <div class="app-container zap-main">
     <el-form ref="form" :model="form" :rules="rules" label-width="auto">
-        <div class="zap-title">资产信息</div>
         <el-row class="zap-form">
+            <content-title title="资产信息"></content-title>
+            <zap-tip class="pt12"></zap-tip>
             <el-row type="flex" justify="end" align="middle">
                 <el-col :span="12" style="margin-bottom: 22px;">
                     <el-button type="success" @click="openTicket">选择</el-button>
@@ -10,13 +11,8 @@
                     <el-button @click="deleteTicekt">清空全部</el-button>
                 </el-col>
                 <el-col :span="12">
-                    <el-row type="flex" justify="end" align="middle">
-                        <el-form-item label="合计金额:" style="margin-right: 40px;">
-                            <span>{{checkTotalAmt}}</span>
-                        </el-form-item>
-                        <el-form-item label="金额大写:">
-                            <span>{{checkTotalBigAmt}}</span>
-                        </el-form-item>
+                    <el-row type="flex" justify="end">
+                        <content-total :amount="checkTotalAmt" :words="checkTotalBigAmt"></content-total>
                     </el-row>
                 </el-col>
             </el-row>
@@ -53,11 +49,9 @@
                     </el-form-item>
                 </el-col>
             </el-row>
-            <p>请知悉,资产信息仅能接受指定的销售方与购买方的往来账款(含账款基本信息、贸易合同与贸易发票等);如须使用系统尚未维护的往来账款,请点击新增应付账款
-            </p>
         </el-row>
     </el-form>
-    <div class="contain">
+    <div class="zap-warmtips">
         <p>友情提醒:
         </p>
         <p>
@@ -81,18 +75,28 @@
     </el-row>
     <!-- 应收账款信息 -->
     <el-dialog :title="payTitle" :visible.sync="open" width="1120px" append-to-body destroy-on-close>
-        <el-form :model="queryParamsPay" ref="formQuery" :inline="true" label-width="68px" style="margin-bottom: -21px">
-            <el-form-item label="账款名称" prop="zbiName">
-                <el-input v-model="queryParamsPay.zbiName" placeholder="请输入账款名称" clearable size="small" maxlength="11" @keyup.enter.native="handleQuerys" />
-            </el-form-item>
-            <el-form-item label="应付企业" prop="payName">
-                <el-input v-model="queryParamsPay.payName" placeholder="请输入应付企业" clearable size="small" maxlength="11" @keyup.enter.native="handleQuerys" />
-            </el-form-item>
-            <el-form-item>
-                <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuerys">搜索</el-button>
-                <el-button icon="el-icon-refresh" size="mini" @click="resetQuerys">重置</el-button>
-            </el-form-item>
-        </el-form>
+        <search-bar :hiddenSetting="true" @query="handleQuerys" @reset="resetQuerys">
+            <el-form :model="queryParamsPay" ref="formQuery" :inline="true" label-width="68px" style="margin-bottom: -21px">
+                <el-form-item label="账款名称" prop="zbiName">
+                    <el-input
+                        v-model="queryParamsPay.zbiName"
+                        placeholder="请输入账款名称"
+                        clearable
+                        size="small"
+                        maxlength="11"
+                        @keyup.enter.native="handleQuerys" />
+                </el-form-item>
+                <el-form-item label="应付企业" prop="payName">
+                    <el-input
+                        v-model="queryParamsPay.payName"
+                        placeholder="请输入应付企业"
+                        clearable
+                        size="small"
+                        maxlength="11"
+                        @keyup.enter.native="handleQuerys" />
+                </el-form-item>
+            </el-form>
+        </search-bar>
         <el-table :data="payList" ref="tablePay" class="single-select-table" @selection-change="handleSelectionChange" :row-key="rowkey">
             <el-table-column type="selection" :reserve-selection="true" width="50" align="center" />
             <el-table-column label="序号" type="index" width="50" align="center">
@@ -108,8 +112,8 @@
         </el-table>
         <pagination v-show="total > 0" :total="total" :page.sync="queryParamsPay.pageNum" :limit.sync="queryParamsPay.pageSize" @pagination="getAccountsCollection" />
         <span slot="footer" class="dialog-footer">
-            <el-button size="mini" @click="cancelTicket">取消</el-button>
-            <el-button size="mini" type="primary" @click="closeTicket">确认</el-button>
+            <el-button type="primary" @click="closeTicket">确认</el-button>
+            <el-button @click="cancelTicket">取消</el-button>
         </span>
     </el-dialog>
 
@@ -149,7 +153,9 @@ import {
 import {
     getToken
 } from "@/utils/auth";
-import { getBill} from "@/api/service/bill/bill";
+import {
+    getBill
+} from "@/api/service/bill/bill";
 import AddBill from "@/views/service/bill/addBill";
 import DetailBill from "@/views/service/credit/billDetail";
 import EditBill from "@/views/service/bill/editBill";
@@ -240,18 +246,18 @@ export default {
     methods: {
         //列表格式化金额
         moneyFormat(row, column, cellValue) {
-        if (cellValue == null || cellValue == undefined || cellValue == "") {
-            cellValue = "0.00";
-        }
-        cellValue += "";
-        if (!cellValue.includes(".")) {
-            cellValue += ".00";
-        }
-        return cellValue
-            .replace(/(\d)(?=(\d{3})+\.)/g, function($0, $1) {
-            return $1 + ",";
-            })
-            .replace(/\.$/, "");
+            if (cellValue == null || cellValue == undefined || cellValue == "") {
+                cellValue = "0.00";
+            }
+            cellValue += "";
+            if (!cellValue.includes(".")) {
+                cellValue += ".00";
+            }
+            return cellValue
+                .replace(/(\d)(?=(\d{3})+\.)/g, function ($0, $1) {
+                    return $1 + ",";
+                })
+                .replace(/\.$/, "");
         },
         // 取消按钮
         cancel() {
@@ -313,7 +319,7 @@ export default {
                 this.$refs.tablePay.clearSelection();
                 changeSelectionTemp.forEach((item) => {
                     var f = true;
-                    for (var i=0; i < this.payList.length; i++) {
+                    for (var i = 0; i < this.payList.length; i++) {
                         var row = this.payList[i];
                         if (row.zbiId == item.zbiId) {
                             this.$refs.tablePay && this.$refs.tablePay.toggleRowSelection(row, true);
@@ -769,13 +775,13 @@ export default {
         emitEditClick(val) {
             var self = this
             getBill(val).then((response) => {
-                for (var i = 0; i < this.ticketList.length; i ++) {
+                for (var i = 0; i < this.ticketList.length; i++) {
                     if (response.data.zbiId == this.ticketList[i].zbiId) {
                         this.$set(this.ticketList, i, response.data)
                         break;
                     }
                 }
-                for (var i = 0; i < this.ticketList.length; i ++) {
+                for (var i = 0; i < this.ticketList.length; i++) {
                     if (response.data.zbiId == this.ticketList[i].zbiId) {
                         this.$set(this.chooseTicket, i, response.data)
                         break;
@@ -814,22 +820,4 @@ table th.star div::before {
     height: 40px;
     margin-bottom: 22px;
 }
-
-.zap-title {
-    padding: 20px 25px;
-    font-size: 16px;
-    color: #333333;
-    background-color: #ffffff;
-}
-
-.zap-form {
-    padding: 10px 25px 8px;
-    background-color: #ffffff;
-    box-sizing: border-box;
-}
-
-.zap-form--clear {
-    padding-left: 0;
-    padding-right: 0;
-}
 </style>