|
|
@@ -0,0 +1,569 @@
|
|
|
+<template>
|
|
|
+ <div class="borderless">
|
|
|
+ <div class="customer-head">
|
|
|
+ <div class="customer-back">
|
|
|
+ <el-button type="danger" style="border: none;background: none;color: red" icon="el-icon-arrow-left"
|
|
|
+ @click="backToList">返回列表
|
|
|
+ </el-button>
|
|
|
+ </div>
|
|
|
+ <el-button
|
|
|
+ class="el-button--small-yh add-customer-btn"
|
|
|
+ type="primary"
|
|
|
+ :disabled="disabled"
|
|
|
+ @click="editCustomer"
|
|
|
+ >{{form.id?'确认修改':'确认新增'}}
|
|
|
+ </el-button>
|
|
|
+ </div>
|
|
|
+ <div style="margin-top: 60px">
|
|
|
+ <el-form :model="form" ref="form" label-width="130px">
|
|
|
+ <containerTitle title="基础信息"></containerTitle>
|
|
|
+ <basic-container style="margin-bottom: 10px">
|
|
|
+ <el-row>
|
|
|
+ <el-col v-for="(item, index) in basicData.column" :span="item.span?item.span:8" :key="index">
|
|
|
+ <el-form-item :label="item.label" :prop="item.prop" :rules="item.rules">
|
|
|
+ <el-date-picker v-if="item.type === 'datetime'" style="width: 100%;" v-model="form[item.prop]" size="small" type="datetime" placeholder="选择日期" value-format="yyyy-MM-dd HH:mm:ss"/>
|
|
|
+ <el-select v-else-if="item.type === 'select'" style="width: 100%" size="small" placeholder="请选择" clearable filterable></el-select>
|
|
|
+ <el-input type="age" v-else v-model="form[item.prop]" size="small" autocomplete="off" placeholder="请输入"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </basic-container>
|
|
|
+<!-- 商品明细-->
|
|
|
+ <containerTitle title="商品明细"></containerTitle>
|
|
|
+ <basic-container style="margin-bottom: 10px">
|
|
|
+ <avue-crud
|
|
|
+ :option="importInventory"
|
|
|
+ v-model="importInventoryForm"
|
|
|
+ :data="importInventoryData"
|
|
|
+ ref="importInventory"
|
|
|
+ @click="openDetailed"
|
|
|
+ >
|
|
|
+ <template slot="menuLeft" slot-scope="{size}">
|
|
|
+ <el-button type="primary"
|
|
|
+ icon="el-icon-plus"
|
|
|
+ size="small"
|
|
|
+ >新增明细</el-button>
|
|
|
+ </template>
|
|
|
+ </avue-crud>
|
|
|
+ </basic-container>
|
|
|
+<!-- 其他费用-->
|
|
|
+ <containerTitle title="其他费用"></containerTitle>
|
|
|
+ <basic-container style="margin-bottom: 40px">
|
|
|
+ <avue-crud
|
|
|
+ :option="advantageProject"
|
|
|
+ v-model="advantageProjectForm"
|
|
|
+ :data="advantageProjectData"
|
|
|
+ ref="crudProject"
|
|
|
+ @row-save="rowSaveProject"
|
|
|
+ @row-update="rowUpdateProject"
|
|
|
+ @row-del="rowDelProject"
|
|
|
+ >
|
|
|
+ <template slot="code" slot-scope="{row,index}">
|
|
|
+ <span style="float: left;padding-top: 2px">{{row.code}}</span><el-button type="text" size="mini" style="float: right" @click="choice(row)">选择</el-button>
|
|
|
+ </template>
|
|
|
+ <template slot-scope="{row,index}" slot="menu">
|
|
|
+ <el-button
|
|
|
+ type="text"
|
|
|
+ size="small"
|
|
|
+ @click="rowCellTwo(row,index)"
|
|
|
+ >{{row.$cellEdit?'保存':'修改'}}</el-button>
|
|
|
+ </template>
|
|
|
+ <template slot="menuLeft" slot-scope="{size}">
|
|
|
+ <el-button type="primary"
|
|
|
+ icon="el-icon-plus"
|
|
|
+ size="small"
|
|
|
+ @click="costIncrease"
|
|
|
+ >新增</el-button>
|
|
|
+ </template>
|
|
|
+ </avue-crud>
|
|
|
+ </basic-container>
|
|
|
+ <!-- 合同上传-->
|
|
|
+ <containerTitle title="合同附件"></containerTitle>
|
|
|
+ <basic-container style="margin-bottom: 40px">
|
|
|
+ <avue-crud
|
|
|
+ :option="uploadList"
|
|
|
+ v-model="bankOfDepositForm"
|
|
|
+ :data="bankOfDepositData"
|
|
|
+ @row-save="rowSaveBankOfDeposit"
|
|
|
+ @row-update="rowUpdateBankOfDeposit"
|
|
|
+ @row-del="rowDelBankOfDeposit"
|
|
|
+ ></avue-crud>
|
|
|
+ </basic-container>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+
|
|
|
+<!-- 导入库存-->
|
|
|
+ <el-dialog
|
|
|
+ title="导入库存"
|
|
|
+ append-to-body
|
|
|
+ :visible.sync="dialogStock"
|
|
|
+ width="80%"
|
|
|
+ :close-on-click-modal="false"
|
|
|
+ :destroy-on-close="true"
|
|
|
+ :close-on-press-escape="false"
|
|
|
+ ></el-dialog>
|
|
|
+<!-- 导入其他费用-->
|
|
|
+ <el-dialog
|
|
|
+ title="导入费用"
|
|
|
+ append-to-body
|
|
|
+ class="el-dialogDeep"
|
|
|
+ :visible.sync="dialogCost"
|
|
|
+ width="80%"
|
|
|
+ :close-on-click-modal="false"
|
|
|
+ :destroy-on-close="true"
|
|
|
+ :close-on-press-escape="false">
|
|
|
+ <el-row style="height: 0;">
|
|
|
+ <el-col :span="5">
|
|
|
+ <div>
|
|
|
+ <el-scrollbar>
|
|
|
+ <basic-container>
|
|
|
+ <avue-tree :option="treeOptionCost" :data="treeData" @node-click="nodeClickCost"/>
|
|
|
+ </basic-container>
|
|
|
+ </el-scrollbar>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="19">
|
|
|
+ <basic-container>
|
|
|
+ <avue-crud :option="optionTwoCost"
|
|
|
+ :table-loading="loadingCost"
|
|
|
+ :data="dataCost"
|
|
|
+ ref="crud"
|
|
|
+ @refresh-change="refreshChangeCost"
|
|
|
+ @selection-change="selectionChangeCost"
|
|
|
+ :page.sync="pageCost"
|
|
|
+ @on-load="onLoadCost">
|
|
|
+ </avue-crud>
|
|
|
+ </basic-container>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="dialogCost = false">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="importCost" v-if="choiceData !== true">导入</el-button>
|
|
|
+ <el-button type="primary" @click="choiceCost" v-if="choiceData === true" :disabled="tableDataCost.length !== 1">导入</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import importInventory from './config/importInventory.json';
|
|
|
+import uploadList from './config/uploadList.json';
|
|
|
+import advantageProject from "./config/advantageProject.json";
|
|
|
+import optionTwoCost from "./config/mainListCost.json";
|
|
|
+import {getDeptLazyTree,customerList} from "@/api/basicData/basicFeesDesc";
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: "detailsPage",
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ disabled: false,
|
|
|
+ form: {},
|
|
|
+ // 基础信息
|
|
|
+ basicData: {
|
|
|
+ column: [
|
|
|
+ {
|
|
|
+ label: '系统编号',
|
|
|
+ prop: 'orderNo',
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ required: false,
|
|
|
+ message: ' ',
|
|
|
+ trigger: 'blur'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }, {
|
|
|
+ label: '合同号',
|
|
|
+ prop: 'orderNo',
|
|
|
+ type:'datetime',
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: ' ',
|
|
|
+ trigger: 'blur'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }, {
|
|
|
+ label: '合同日期',
|
|
|
+ prop: 'orderNo',
|
|
|
+ type:'datetime',
|
|
|
+ data: [],
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: ' ',
|
|
|
+ trigger: 'blur'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }, {
|
|
|
+ label: '业务员',
|
|
|
+ prop: 'orderNo',
|
|
|
+ type:'select',
|
|
|
+ data: [],
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: ' ',
|
|
|
+ trigger: 'blur'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }, {
|
|
|
+ label: '销售公司',
|
|
|
+ prop: 'orderNo',
|
|
|
+ type:'select',
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: ' ',
|
|
|
+ trigger: 'blur'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }, {
|
|
|
+ label: '工厂/贸易商名称',
|
|
|
+ prop: 'orderNo',
|
|
|
+ type:'select',
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: ' ',
|
|
|
+ trigger: 'blur'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }, {
|
|
|
+ label: '提成标准',
|
|
|
+ prop: 'orderNo',
|
|
|
+ data: [],
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: ' ',
|
|
|
+ trigger: 'blur'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }, {
|
|
|
+ label: '销售单价',
|
|
|
+ prop: 'orderNo',
|
|
|
+ data: [],
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: ' ',
|
|
|
+ trigger: 'blur'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }, {
|
|
|
+ label: '发票重量',
|
|
|
+ prop: 'orderNo',
|
|
|
+ data: [],
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: ' ',
|
|
|
+ trigger: 'blur'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }, {
|
|
|
+ label: '码单重量',
|
|
|
+ prop: 'orderNo',
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: ' ',
|
|
|
+ trigger: 'blur'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }, {
|
|
|
+ label: '币别',
|
|
|
+ prop: 'orderNo',
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: ' ',
|
|
|
+ trigger: 'blur'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }, {
|
|
|
+ label: '汇率',
|
|
|
+ prop: 'orderNo',
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: ' ',
|
|
|
+ trigger: 'blur'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }, {
|
|
|
+ label: '预收金额',
|
|
|
+ prop: 'orderNo',
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: ' ',
|
|
|
+ trigger: 'blur'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }, {
|
|
|
+ label: '合同金额',
|
|
|
+ prop: 'orderNo',
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: ' ',
|
|
|
+ trigger: 'blur'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }, {
|
|
|
+ label: '收款金额',
|
|
|
+ prop: 'orderNo',
|
|
|
+ rules: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: ' ',
|
|
|
+ trigger: 'blur'
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }, {
|
|
|
+ label: "备注",
|
|
|
+ span: 24,
|
|
|
+ prop: "orderRemark",
|
|
|
+ mock: {
|
|
|
+ type: 'county'
|
|
|
+ }
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ // 导入库存配置
|
|
|
+ importInventory: importInventory,
|
|
|
+ importInventoryForm: {},
|
|
|
+ importInventoryData: [],
|
|
|
+ dialogStock: false,
|
|
|
+ // 其他费用
|
|
|
+ advantageProject: advantageProject,
|
|
|
+ advantageProjectData: [],
|
|
|
+ advantageProjectForm: {},
|
|
|
+ dialogCost: false,
|
|
|
+ choiceData: false,
|
|
|
+ treeOptionCost:{
|
|
|
+ nodeKey: 'id',
|
|
|
+ lazy: true,
|
|
|
+ treeLoad: function (node, resolve) {
|
|
|
+ const parentId = (node.level === 0) ? 0 : node.data.id;
|
|
|
+ getDeptLazyTree(parentId).then(res => {
|
|
|
+ resolve(res.data.data.map(item => {
|
|
|
+ return {
|
|
|
+ ...item,
|
|
|
+ leaf: !item.hasChildren
|
|
|
+ }
|
|
|
+ }))
|
|
|
+ });
|
|
|
+ },
|
|
|
+ addBtn: false,
|
|
|
+ menu: false,
|
|
|
+ size: 'small',
|
|
|
+ props: {
|
|
|
+ labelText: '标题',
|
|
|
+ label: 'title',
|
|
|
+ value: 'value',
|
|
|
+ children: 'children'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 导入其他费用配置
|
|
|
+ optionTwoCost: optionTwoCost,
|
|
|
+ loadingCost: false,
|
|
|
+ dataCost:[],
|
|
|
+ pageCost:{
|
|
|
+ pageSize: 10,
|
|
|
+ currentPage: 1,
|
|
|
+ total: 0
|
|
|
+ },
|
|
|
+ tableDataCost: [],
|
|
|
+ treeDeptIdCost: '',
|
|
|
+ choiceIndex: '',
|
|
|
+ // 合同上传数据
|
|
|
+ uploadList: uploadList,
|
|
|
+ // 合同数据
|
|
|
+ bankOfDepositData: [],
|
|
|
+ bankOfDepositForm: {},
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 导入库存新增明细
|
|
|
+ openDetailed() {},
|
|
|
+ //其他费用编辑
|
|
|
+ rowCellTwo(row, index) {
|
|
|
+ console.log(row)
|
|
|
+ this.$refs.crudProject.rowCell(row, index)
|
|
|
+ },
|
|
|
+ //其他费用新增触发
|
|
|
+ costIncrease(){
|
|
|
+ this.dialogCost = !this.dialogCost
|
|
|
+ this.choiceData = false
|
|
|
+ },
|
|
|
+ //费用查询
|
|
|
+ onLoadCost(page, params = {}) {
|
|
|
+ this.loadingCost = true;
|
|
|
+ let queryParams = Object.assign({}, params, {pageSize: page.pageSize, pageNum: page.currentPage,parentId:0,feesTypeId:this.treeDeptIdCost})
|
|
|
+ customerList(queryParams).then(res => {
|
|
|
+ console.log(res)
|
|
|
+ const data = res.data.data;
|
|
|
+ this.pageCost.total = data.total;
|
|
|
+ this.dataCost = data.records;
|
|
|
+ this.loadingCost = false;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //点击费用明细选择触发
|
|
|
+ choice(row){
|
|
|
+ this.dialogCost = !this.dialogCost
|
|
|
+ this.choiceData = true
|
|
|
+ this.choiceIndex = row.$index
|
|
|
+ },
|
|
|
+ nodeClickCost(data){
|
|
|
+ this.treeDeptIdCost = data.id;
|
|
|
+ this.pageCost.currentPage = 1;
|
|
|
+ this.onLoadCost(this.pageCost);
|
|
|
+ },
|
|
|
+ //费用刷新触发
|
|
|
+ refreshChangeCost() {
|
|
|
+ this.treeDeptIdCost = '';
|
|
|
+ this.pageCost.currentPage = 1;
|
|
|
+ this.onLoadCost(this.pageCost);
|
|
|
+ },
|
|
|
+ //费用选中触发
|
|
|
+ selectionChangeCost(list){
|
|
|
+ this.tableDataCost = list
|
|
|
+ },
|
|
|
+ //费用导入触发
|
|
|
+ importCost(){
|
|
|
+ // this.advantageProjectForm = this.advantageProjectForm.concat(this.tableDataCost)
|
|
|
+ if (this.tableDataCost.length>0){
|
|
|
+ for(let item in this.tableDataCost){
|
|
|
+ console.log(this.tableDataCost[item])
|
|
|
+ this.tableDataCost[item].itemId = this.tableDataCost[item].id
|
|
|
+ this.tableDataCost[item].feeName = this.tableDataCost[item].cname
|
|
|
+ delete this.tableDataCost[item].id
|
|
|
+ this.$refs.crudProject.rowCellAdd(this.tableDataCost[item]);
|
|
|
+ this.$refs.crudProject.rowCell(this.tableDataCost[item], this.advantageProjectForm.length-1)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.tableDataCost = []
|
|
|
+ this.dialogCost = false
|
|
|
+ },
|
|
|
+ //费用编辑导入触发
|
|
|
+ choiceCost(){
|
|
|
+ if (this.tableDataCost.length === 1){
|
|
|
+ this.advantageProjectData[this.choiceIndex].feeName = this.tableDataCost[0].cname
|
|
|
+ this.advantageProjectData[this.choiceIndex].itemId = this.tableDataCost[0].id
|
|
|
+ this.advantageProjectData[this.choiceIndex].code = this.tableDataCost[0].code
|
|
|
+ }
|
|
|
+ this.dialogCost = !this.dialogCost
|
|
|
+ this.choiceData = false
|
|
|
+ },
|
|
|
+ //新增附件上传保存触发
|
|
|
+ rowSaveBankOfDeposit(row, done, loading){
|
|
|
+ this.bankOfDepositData.push(row)
|
|
|
+ done()
|
|
|
+ },
|
|
|
+ //修改附件上传触发
|
|
|
+ rowUpdateBankOfDeposit(row, index, done, loading) {
|
|
|
+ done(row);
|
|
|
+ },
|
|
|
+ //删除附件上传触发
|
|
|
+ rowDelBankOfDeposit(row, index, donerowDel) {
|
|
|
+ this.$confirm("确定将选择数据删除?", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning"
|
|
|
+ }).then(() => {
|
|
|
+ if (row.id){
|
|
|
+ corpsbank(row.id).then(res=>{
|
|
|
+ this.$message({
|
|
|
+ type: "success",
|
|
|
+ message: "操作成功!"
|
|
|
+ });
|
|
|
+ this.bankOfDepositData.splice(index, 1);
|
|
|
+ })
|
|
|
+ }else {
|
|
|
+ this.$message({
|
|
|
+ type: "success",
|
|
|
+ message: "操作成功!"
|
|
|
+ });
|
|
|
+ this.bankOfDepositData.splice(index, 1);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //新增明细保存触发
|
|
|
+ rowSaveProject(row, done, loading){
|
|
|
+ // this.advantageProjectData.push(row)
|
|
|
+ done()
|
|
|
+ },
|
|
|
+ //修改明细触发
|
|
|
+ rowUpdateProject(row, index, done, loading) {
|
|
|
+ done(row);
|
|
|
+ },
|
|
|
+ //删除明细触发
|
|
|
+ rowDelProject(row, index, donerowDel) {
|
|
|
+ this.$confirm("确定将选择数据删除?", {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning"
|
|
|
+ }).then(() => {
|
|
|
+ if (row.id){
|
|
|
+ // corpsitem(row.id).then(res=>{
|
|
|
+ // this.$message({
|
|
|
+ // type: "success",
|
|
|
+ // message: "操作成功!"
|
|
|
+ // });
|
|
|
+ // this.detailedData.splice(index, 1);
|
|
|
+ // })
|
|
|
+ }else {
|
|
|
+ this.$message({
|
|
|
+ type: "success",
|
|
|
+ message: "操作成功!"
|
|
|
+ });
|
|
|
+ this.advantageProjectData.splice(index, 1);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ backToList() {
|
|
|
+ this.$router.$avueRouter.closeTag();
|
|
|
+ this.$router.push({
|
|
|
+ path: '/salesManagement/salesContract/index',
|
|
|
+ query: {}
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="scss">
|
|
|
+.customer-head {
|
|
|
+ position: fixed;
|
|
|
+ top: 105px;
|
|
|
+ width: 100%;
|
|
|
+ margin-left: -10px;
|
|
|
+ height: 62px;
|
|
|
+ background: #ffffff;
|
|
|
+ box-shadow: 0 4px 12px 0px rgba(232, 232, 235, 1);
|
|
|
+ z-index: 999;
|
|
|
+ /* display: flex;
|
|
|
+ justify-content: left; */
|
|
|
+}
|
|
|
+
|
|
|
+.customer-back {
|
|
|
+ cursor: pointer;
|
|
|
+ line-height: 62px;
|
|
|
+ font-size: 16px;
|
|
|
+ color: #323233;
|
|
|
+ font-weight: 400;
|
|
|
+}
|
|
|
+
|
|
|
+.add-customer-btn {
|
|
|
+ position: fixed;
|
|
|
+ right: 36px;
|
|
|
+ top: 115px;
|
|
|
+}
|
|
|
+
|
|
|
+::v-deep .el-form-item {
|
|
|
+ margin-bottom: 0;
|
|
|
+}
|
|
|
+
|
|
|
+</style>
|
caojunjie