费用

src/main/vue/src/components/fee/BackBill.vue

@@ -9,16 +9,8 @@
             style="padding-right: 130px;"
             class="fee"
         >
-            <el-form-item prop="paymentDate" label="支付日期">
-                <el-date-picker
-                    v-model="form.paymentDate"
-                    type="date"
-                    value-format="yyyy-MM-dd"
-                    placeholder="选择日期"
-                    style="width: 100%;"
-                >
-                </el-date-picker>
-                 <el-radio-group v-model="form.reviewRequire">
+            <el-form-item prop="invoiceReturn" label="是否有发票回传">
+                <el-radio-group v-model="form.invoiceReturn">
                     <el-radio :label="true">
                         是
                     </el-radio>
@@ -27,11 +19,8 @@
                     </el-radio>
                 </el-radio-group>
             </el-form-item>
-            <el-form-item prop="remark" label="备注">
-                <el-input v-model="form.remark"></el-input>
-            </el-form-item>
-            <el-form-item label="付款图片" prop="payment">
-                <attachment-upload v-model="form.payment"></attachment-upload>
+            <el-form-item label="发票图片" prop="invoice" v-if="form.invoiceReturn">
+                <attachment-upload v-model="form.invoice"></attachment-upload>
             </el-form-item>
 
             <el-form-item>
@@ -58,15 +47,14 @@ export default {
             show: false,
             saving: false,
             form: {
-                payment: { fileName: '', url: '', remark: '', size: '' }
+                invoice: { fileName: '', url: '', remark: '', size: '' }
             },
             rules: {
-                paymentDate: { required: true, message: '请选择支付日期', trigger: 'blur' },
-                remark: { required: true, message: '请输入备注', trigger: 'blur' },
-                payment: {
+                invoiceReturn: { required: true, message: '请选择是否回传发票', trigger: 'change' },
+                invoice: {
                     validator: (rule, value, callback) => {
                         if (!value.url) {
-                            callback(new Error('请上传付款图片'));
+                            callback(new Error('请上传发票图片'));
                         } else {
                             callback();
                         }
@@ -106,7 +94,11 @@ export default {
     methods: {
         init() {
             this.$nextTick(() => {
-                this.form = { ...this.info, payment: { fileName: '', url: '', remark: '', size: '' } };
+                this.form = {
+                    ...this.info,
+                    invoice: { fileName: '', url: '', remark: '', size: '' },
+                    invoiceReturn: true
+                };
                 this.show = true;
             });
         },
@@ -121,10 +113,9 @@ export default {
         },
         submit() {
             let data = { ...this.form };
-            delete data.payment;
-            data.paymentImg = this.form.payment.url;
-            data.paymentRemark = this.form.payment.remark;
-            data.status = 'PAID';
+            delete data.invoice;
+            data.invoiceImg = this.form.invoice.url;
+            data.invoiceRemark = this.form.invoice.remark;
             this.saving = true;
             this.$http
                 .post('/fee/save', data, { body: 'json' })

src/main/vue/src/components/fee/FeeAdd.vue

@@ -87,11 +87,11 @@
                 >
                 </el-date-picker>
             </el-form-item>
-            <el-form-item prop="remark" label="账单">
-                <el-input v-model="form.remark"></el-input>
+            <el-form-item prop="bill" label="账单">
+                <el-input v-model="form.bill"></el-input>
             </el-form-item>
-            <el-form-item label="账单图片" prop="bill">
-                <attachment-upload v-model="form.bill"></attachment-upload>
+            <el-form-item label="账单图片" prop="billInfo">
+                <attachment-upload v-model="form.billInfo"></attachment-upload>
             </el-form-item>
 
             <el-form-item>
@@ -171,7 +171,7 @@ export default {
             show: false,
             saving: false,
             form: {
-                bill: { fileName: '', url: '', remark: '', size: '' },
+                billInfo: { fileName: '', url: '', remark: '', size: '' },
                 currencyMaintenanceId: 35,
                 patentPartnerId: '',
                 payPartnerId: ''
@@ -190,8 +190,8 @@ export default {
                 payPartnerId: { required: true, message: '请选择支付对象', trigger: 'blur' },
                 amount: { required: true, message: '请输入支付金额', trigger: 'blur' },
                 paymentDeadline: { required: true, message: '请选择支付期限', trigger: 'blur' },
-                remark: { required: true, message: '请输入账单', trigger: 'blur' },
-                bill: {
+                bill: { required: true, message: '请输入账单', trigger: 'blur' },
+                billInfo: {
                     validator: (rule, value, callback) => {
                         if (!value.url) {
                             callback(new Error('请上传账单图片'));
@@ -252,9 +252,9 @@ export default {
         },
         submit() {
             let data = { ...this.form };
-            delete data.bill;
-            data.billImg = this.form.bill.url;
-            data.billRemark = this.form.bill.remark;
+            delete data.billInfo;
+            data.billImg = this.form.billInfo.url;
+            data.billRemark = this.form.billInfo.remark;
             data.status = 'UNPAID';
             data.userId = this.$store.state.userInfo.id;
             data.patentId = this.logoPatentInfo.id;

src/main/vue/src/components/fee/FeeList.vue

@@ -24,9 +24,9 @@
             <el-table-column prop="payPartnerId" label="支付对象" min-width="120px"> </el-table-column>
             <el-table-column prop="amount" label="金额" min-width="120px"> </el-table-column>
             <el-table-column prop="currencyMaintenanceId" label="币种" min-width="100px"> </el-table-column>
-            <el-table-column prop="paymentDeadline" label="支付期限" min-width="80px"> </el-table-column>
-            <el-table-column prop="remark" label="账单"> </el-table-column>
-            <el-table-column prop="billImg" label="账单图片">
+            <el-table-column prop="paymentDeadline" label="支付期限" min-width="100px"> </el-table-column>
+            <el-table-column prop="bill" label="账单" min-width="100px"> </el-table-column>
+            <el-table-column prop="billImg" label="账单图片" min-width="100px">
                 <template slot-scope="{ row }">
                     <el-image
                         style="width: 36px; height: 36px;"
@@ -36,36 +36,79 @@
                     ></el-image>
                 </template>
             </el-table-column>
-            <el-table-column prop="paymentDate" label="支付日期" min-width="80px">
+            <el-table-column prop="paymentDate" label="支付日期" min-width="100px">
                 <template slot-scope="{ row }">
                     <span v-if="row.status === 'UNPAID'" class="warning">未支付</span>
 
                     <span v-else>{{ row.paymentDate }}</span>
                 </template>
             </el-table-column>
-            <el-table-column prop="invoiceReturn" label="是否发票回传">
+            <el-table-column prop="paymentImg" label="付款图片" min-width="100px">
                 <template slot-scope="{ row }">
-                    <el-tag v-if="row.invoiceReturn" :type="row.invoiceReturn ? '' : 'info'">{{
-                        row.invoiceReturn
+                    <span v-if="row.status === 'UNPAID'" class="warning">未支付</span>
+
+                    <el-image
+                        v-else
+                        style="width: 36px; height: 36px;"
+                        :src="row.paymentImg"
+                        fit="cover"
+                        :preview-src-list="[row.paymentImg]"
+                    ></el-image>
+                </template>
+            </el-table-column>
+            <el-table-column prop="invoiceReturn" label="是否发票回传" min-width="120px">
+                <template slot-scope="{ row }">
+                    <span v-if="!row.invoiceReturn && row.invoiceReturn !== false" class="warning">未操作</span>
+                    <el-tag v-else :type="row.invoiceReturn ? '' : 'info'">{{
+                        row.invoiceReturn ? '是' : '否'
                     }}</el-tag>
                 </template>
             </el-table-column>
+            <el-table-column prop="paymentImg" label="发票图片" min-width="100px">
+                <template slot-scope="{ row }">
+                    <span v-if="!row.invoiceReturn" class="warning">未回传</span>
+
+                    <el-image
+                        v-else
+                        style="width: 36px; height: 36px;"
+                        :src="row.invoiceImg"
+                        fit="cover"
+                        :preview-src-list="[row.invoiceImg]"
+                    ></el-image>
+                </template>
+            </el-table-column>
             <!-- <el-table-column prop="userId" label="userId"> </el-table-column> -->
             <el-table-column label="操作" align="center" fixed="right" min-width="150px">
                 <template slot-scope="{ row }">
-                    <el-button @click="editRow(row)" type="primary" size="mini" plain>支付费用</el-button>
-                    <el-button type="danger" size="mini" plain>编辑</el-button>
+                    <div class="table-btn-list">
+                        <el-button v-if="row.status === 'UNPAID'" @click="payRow(row)" type="primary" size="mini" plain>
+                            支付费用
+                        </el-button>
+                        <el-button
+                            v-else-if="!row.invoiceReturn && row.invoiceReturn !== false"
+                            @click="returnRow(row)"
+                            type="primary"
+                            size="mini"
+                            plain
+                        >
+                            发票回传
+                        </el-button>
+                        <el-button type="danger" size="mini" plain>编辑</el-button>
+                    </div>
                 </template>
             </el-table-column>
         </el-table>
 
-        <pay ref="pay" :info="editPayInfo"></pay>
+        <pay ref="pay" @refreash="getData" :info="editPayInfo"></pay>
+
+        <back-bill ref="backBill" @refreash="getData" :info="editPayInfo"></back-bill>
     </div>
 </template>
 <script>
 import { mapState } from 'vuex';
 import pageableTable from '@/mixins/pageableTable';
 import Pay from './Pay.vue';
+import BackBill from './BackBill.vue';
 
 export default {
     name: 'FeeList',
@@ -129,10 +172,16 @@ export default {
         addRow() {
             this.$refs.feeAdd.show = true;
         },
-        editRow(row) {
+        payRow(row) {
+            console.log(row);
             this.editPayInfo = row;
             this.$refs.pay.init();
         },
+        returnRow(row) {
+            this.editPayInfo = row;
+            this.$refs.backBill.init();
+        },
+        editRow(row) {},
         download() {
             this.downloading = true;
             this.$axios
@@ -183,7 +232,8 @@ export default {
         }
     },
     components: {
-        Pay
+        Pay,
+        BackBill
     }
 };
 </script>
@@ -192,4 +242,8 @@ export default {
     flex-grow: 1;
     padding: 20px 0;
 }
+.warning {
+    color: @prim;
+    font-size: 12px;
+}
 </style>

src/main/vue/src/components/fee/Pay.vue

@@ -42,7 +42,7 @@ export default {
             default: () => {
                 return {};
             }
-        },
+        }
     },
     created() {},
     data() {
@@ -97,8 +97,10 @@ export default {
     },
     methods: {
         init() {
-            this.form = { ...this.info, payment: { fileName: '', url: '', remark: '', size: '' } };
-            this.show = true;
+            this.$nextTick(() => {
+                this.form = { ...this.info, payment: { fileName: '', url: '', remark: '', size: '' } };
+                this.show = true;
+            });
         },
         onSave() {
             this.$refs.form.validate(valid => {
@@ -114,6 +116,7 @@ export default {
             delete data.payment;
             data.paymentImg = this.form.payment.url;
             data.paymentRemark = this.form.payment.remark;
+            data.status = 'PAID';
             this.saving = true;
             this.$http
                 .post('/fee/save', data, { body: 'json' })

src/main/vue/src/styles/app.less

@@ -500,3 +500,8 @@ li {
         z-index: 20;
     }
 }
+
+.table-btn-list {
+    display: flex;
+    justify-content: flex-end;
+}

src/main/vue/src/styles/element_theme/index.css

@@ -9522,14 +9522,14 @@
     border-left-color: #fff;
 }
 .el-tag {
-    background-color: #fbf7ec;
-    border-color: #f7eed9;
+    background-color: #369DD112;
+    border-color: #369DD112;
     display: inline-block;
     height: 32px;
     padding: 0 10px;
     line-height: 30px;
     font-size: 12px;
-    color: #d7ab41;
+    color: #369DD1;
     border-width: 1px;
     border-style: solid;
     border-radius: 4px;