开票资料

src/views/hlwinvoice/HlwCompanyInvoiceInfoList.vue

@@ -0,0 +1,158 @@
+<template>
+  <a-card :bordered="false">
+    <!-- 查询区域 -->
+    <div class="table-page-search-wrapper">
+      <a-form layout="inline" @keyup.enter.native="searchQuery">
+        <a-row :gutter="24">
+
+        </a-row>
+      </a-form>
+    </div>
+    <!-- 查询区域-END -->
+
+    <!-- 操作按钮区域 -->
+
+    <div class="table-operator">
+          <a-button @click="handleAdd" type="primary" icon="plus" >新增开票资料</a-button>
+    </div>
+
+
+    <!-- table区域-begin -->
+    <div>
+
+      <a-table
+        ref="table"
+        size="middle"
+        bordered
+        rowKey="id"
+        :columns="columns"
+        :dataSource="dataSource"
+        :pagination="ipagination"
+        :loading="loading"
+        class="j-table-force-nowrap"
+        @change="handleTableChange">
+
+
+
+             <span slot="action" slot-scope="text, record">
+            <a @click="handleEdit(record)" >修改</a>
+           </span>
+
+      </a-table>
+    </div>
+
+<hlw-comapny-invoice-info-modal ref="modalForm" @ok="modalFormOk"></hlw-comapny-invoice-info-modal>
+  </a-card>
+</template>
+
+<script>
+
+  import { httpAction ,getAction,putAction} from '@/api/manage'
+  import '@/assets/less/TableExpand.less'
+  import { mixinDevice } from '@/utils/mixin'
+  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
+  import HlwComapnyInvoiceInfoModal from './modules/HlwComapnyInvoiceInfoModal'
+
+  export default {
+    name: "HlwCompanyInvoiceInfoList",
+    mixins:[JeecgListMixin, mixinDevice],
+    components: {
+      HlwComapnyInvoiceInfoModal
+
+    },
+    data () {
+      return {
+        queryParam: {},
+        selectedRowKeys: [],
+        selectedRows: [],
+        description: '开票资料列表',
+        // 表头
+        columns: [
+          {
+            title:'抬头',
+            align:"center",
+            dataIndex: 'invoiceTitle'
+          },
+          {
+            title:'纳税人识别号',
+            align:"center",
+            dataIndex: 'dutyParagraph',
+          },
+          {
+            title:'开户银行',
+            align:"center",
+            dataIndex: 'accountBank',
+          },
+          {
+            title:'开户账号',
+            align:"center",
+            dataIndex: 'account',
+            customRender:function (text) {
+              return text
+            }
+          },
+          {
+            title:'地址',
+            align:"center",
+            dataIndex: 'registerAddress'
+          },
+          {
+            title:'电话',
+            align:"center",
+            dataIndex: 'registerPhone'
+          },
+          {
+            title: '创建人',
+            dataIndex: 'createBy',
+            align: "center",
+          },
+          {
+            title: '创建时间',
+            dataIndex: 'createTime',
+            align: "center",
+          },
+          {
+            title: '更新人',
+            dataIndex: 'updateTime',
+            align: "center",
+          },
+          {
+            title: '更新时间',
+            dataIndex: 'updateBy',
+            align: "center",
+          },
+          {
+            title: '操作',
+            dataIndex: 'action',
+            align:"center",
+            fixed:"right",
+            width:147,
+            scopedSlots: { customRender: 'action' }
+          }
+        ],
+        url: {
+          list: "/saasmanager/hwPlatformCompany/companyInvoiceInfoList",
+        },
+        dictOptions:{},
+      }
+    },
+    computed: {
+      importExcelUrl: function(){
+        return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
+      },
+    },
+    methods: {
+      initDictConfig(){
+      },
+
+
+
+
+
+
+    }
+  }
+</script>
+<style scoped>
+  @import '~@assets/less/common.less';
+</style>

src/views/hlwinvoice/modules/HlwComapnyInvoiceInfoModal.vue

@@ -0,0 +1,181 @@
+<template>
+  <a-modal
+    :title="title"
+    :width="width"
+    :visible="visible"
+    :bodyStyle="bodyStyle"
+    :confirmLoading="confirmLoading"
+    @ok="handleOk"
+    :maskClosable="false"
+    @cancel="handleCancel"
+    cancelText="关闭">
+    <a-spin :spinning="confirmLoading">
+      <a-form :form="form">
+
+
+        <a-form-item label="发票抬头" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <a-input v-decorator="[ 'invoiceTitle', validatorRules.invoiceTitle]" placeholder="请输入发票抬头"></a-input>
+        </a-form-item>
+
+        <a-form-item label="纳税人识别号" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <a-input v-decorator="[ 'dutyParagraph', validatorRules.dutyParagraph]" placeholder="请输入纳税人识别号"></a-input>
+        </a-form-item>
+
+        <a-form-item label="开户银行" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <a-input v-decorator="[ 'accountBank', validatorRules.accountBank]" placeholder="请输入身份证号"></a-input>
+        </a-form-item>
+
+
+        <a-form-item label="开户账户" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <a-input v-decorator="[ 'account', validatorRules.account]"  placeholder="请输入开户账户" ></a-input>
+        </a-form-item>
+
+
+        <a-form-item label="地址" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <a-input v-decorator="[ 'registerAddress', validatorRules.registerAddress]" placeholder="请输入地址"></a-input>
+        </a-form-item>
+
+        <a-form-item label="电话" :labelCol="labelCol" :wrapperCol="wrapperCol">
+          <a-input v-decorator="[ 'registerPhone', validatorRules.registerPhone]" placeholder="请输入电话"></a-input>
+        </a-form-item>
+
+      </a-form>
+    </a-spin>
+
+  </a-modal>
+</template>
+
+<script>
+
+  import { httpAction } from '@/api/manage'
+  import pick from 'lodash.pick'
+  import JDate from '@/components/jeecg/JDate'
+  import Vue from 'vue'
+  import { ACCESS_TOKEN } from '@/store/mutation-types'
+
+  export default {
+    name: "HlwComapnyInvoiceInfoModal",
+    components: {
+      JDate,
+    },
+    data () {
+      return {
+        form: this.$form.createForm(this),
+        title:"操作",
+        width:800,
+        bodyStyle: {
+          paddingTop: '20px',
+          paddingBottom:'20px',
+          maxHeight: (window.innerHeight * 0.62) + 'px',
+          'overflow-y': 'auto'
+        },
+        visible: false,
+        model: {},
+        labelCol: {
+          xs: { span: 24 },
+          sm: { span: 5 },
+        },
+        wrapperCol: {
+          xs: { span: 24 },
+          sm: { span: 16 },
+        },
+        headers: {},
+        uploadLoading: false,
+        confirmLoading: false,
+        validatorRules:{
+          invoiceTitle:{rules: [{ required: true, message: '请输入发票抬头!' }]},
+          dutyParagraph:{rules: [{ required: true, message: '请输入纳税人识别号!' }]},
+          accountBank:{},
+          account:{},
+          registerAddress:{},
+          registerPhone:{},
+        },
+        url: {
+          add: "/wisdom/hwPlatformCompany/companyInvoiceInfoAdd",
+          edit: "/wisdom/hwPlatformCompany/companyInvoiceInfoEdit",
+        }
+
+      }
+    },
+    created () {
+
+    },
+    computed: {
+
+    },
+    methods: {
+      add () {
+        this.edit({});
+      },
+      edit (record) {
+        this.form.resetFields();
+        this.model = Object.assign({}, record);
+        this.visible = true;
+        this.$nextTick(() => {
+          this.form.setFieldsValue(pick(this.model,'invoiceTitle','dutyParagraph','accountBank','account','registerAddress','registerPhone'))
+        })
+      },
+      close () {
+        this.$emit('close');
+        this.visible = false;
+      },
+      handleOk () {
+        const that = this;
+        // 触发表单验证
+        this.form.validateFields((err, values) => {
+          if (!err) {
+            that.confirmLoading = true;
+            let httpurl = '';
+            let method = '';
+            if(!this.model.id){
+              httpurl+=this.url.add;
+              method = 'post';
+            }else{
+              httpurl+=this.url.edit;
+               method = 'put';
+            }
+            let formData = Object.assign(this.model, values);
+            console.log("表单提交数据",formData)
+            httpAction(httpurl,formData,method).then((res)=>{
+              if(res.success){
+                that.$message.success(res.message);
+                that.$emit('ok');
+              }else{
+                that.$message.warning(res.message);
+              }
+            }).finally(() => {
+              that.confirmLoading = false;
+              that.close();
+            })
+          }
+
+        })
+      },
+      handleCancel () {
+        this.close()
+      },
+
+
+
+
+
+
+    }
+  }
+</script>
+<style lang="less" scoped>
+  .avatar-uploader > .ant-upload {
+    width: 104px;
+    height: 104px;
+  }
+
+  .ant-upload-select-picture-card i {
+    font-size: 49px;
+    color: #999;
+  }
+
+  .ant-upload-select-picture-card .ant-upload-text {
+    margin-top: 8px;
+    color: #666;
+  }
+</style>