增加关键字查询和商机签约跳转

src/router/urlMap.js

@@ -58,6 +58,7 @@ import _views_brokerage_settle from '@/views/brokerage/sequence'
 import _views_brokerage_settle_detail from '@/views/brokerage/sequenceDetail'
 import _views_brokerage_deduction from '@/views/brokerage/deduction'
 import _views_market_team from '@/views/market/team/list'
+import _views_item_transfer from '@/views/item/transfer'
 export default {
   _views_set_menu,
   _view_department,
@@ -103,5 +104,6 @@ export default {
   _views_brokerage_settle,
   _views_brokerage_settle_detail,
   _views_brokerage_deduction,
-  _views_market_team
+  _views_market_team,
+  _views_item_transfer
 }

src/views/item/transfer.vue

@@ -0,0 +1,477 @@
+<template>
+  <div class="app-container">
+    <!-- <div class="title-container">
+      <breadcrumb id="breadcrumb-container" class="breadcrumb-container"/>
+    </div> -->
+    <y-detail-page-layout @save="handleCreate" :edit-status="true" v-loading="vLoading" element-loading-text="处理中。。。" >
+      <div style="padding-top: 30px;">
+        <el-tabs v-model="activeName">
+          <el-tab-pane label="商机签约" name="first">
+            <el-form ref="postForm" :model="postForm" class="form-container">
+              <div class="createPost-main-container">
+                <div class="postInfo-container">
+                  <div style="margin-bottom: 30px">
+                    <h3 class="title">
+                      <div class="avatar-wrapper icon-title">基</div>
+                      <div class="icon-info">基本信息</div>
+                    </h3>
+                  </div>
+                  <el-row>
+                    <el-col :xs="24" :sm="12" :lg="6" :span="6">
+                      <el-form-item
+                        label="项目名称："
+                        prop="name"
+                        :rules="{required: true, message: '请输入项目名称', trigger: 'blur'}"
+                        label-width="120px"
+                        class="postInfo-container-item"
+                      >
+                        <el-input v-model="postForm.name" class="filter-item" readonly disabled/>
+                      </el-form-item>
+                    </el-col>
+                    <el-col :xs="24" :sm="12" :lg="6" :span="6">
+                      <el-form-item
+                        label="归属单位："
+                        prop="belongTo"
+                        :rules="{required: true, message: '归属单位', trigger: 'blur'}"
+                        label-width="120px"
+                        class="postInfo-container-item"
+                      >
+                        <el-select
+                          v-model="postForm.belongTo"
+                          placeholder="请选择"
+                          clearable
+                          filterable
+                          class="filter-item"
+                          style=" width: 100%"
+                          @change="changePrefix"
+                        >
+                          <el-option key="1" label="大友" value="DY"/>
+                          <el-option key="2" label="泰济诚" value="TJC"/>
+                        </el-select>
+                      </el-form-item>
+                    </el-col>
+                    <el-col :xs="24" :sm="12" :lg="6" :span="6">
+                      <el-form-item
+                        label="项目编号："
+                        prop="oaNo"
+                        label-width="120px"
+                        class="postInfo-container-item"
+                      >
+                        <el-input v-model="postForm.oaNo" class="filter-item" :placeholder="tip" :disabled="oaNoDisable" :readonly="oaNoReadonly">
+                          <template slot="prepend">{{postForm.belongTo}}</template>
+                        </el-input>
+                      </el-form-item>
+                    </el-col>
+                    <el-col :xs="24" :sm="12" :lg="6" :span="6">
+                      <el-form-item
+                        label="事业部流水号："
+                        prop="businessNo"
+                        label-width="150px"
+                        class="postInfo-container-item"
+                      >
+                        <el-input :value="postForm.businessNo" class="filter-item" placeholder="系统自动生成" :disabled="true" readonly/>
+                      </el-form-item>
+                    </el-col>
+                  </el-row>
+                  <el-row>
+                    <el-col :xs="24" :sm="12" :lg="6" :span="6">
+                      <el-form-item
+                        label="项目类型："
+                        prop="cate"
+                        :rules="{required: true, message: '项目类型', trigger: 'blur'}"
+                        label-width="120px"
+                        class="postInfo-container-item"
+                      >
+                        <el-select
+                          v-model="postForm.cate"
+                          placeholder="请选择"
+                          clearable
+                          filterable
+                          class="filter-item"
+                          style=" width: 100%"
+                        >
+                          <el-option v-for="item in cateList" :key="item.id" :label="item.name" :value="item.id"/>
+                        </el-select>
+                      </el-form-item>
+                    </el-col>
+                    <el-col :xs="24" :sm="12" :lg="6" :span="6">
+                      <el-form-item
+                        label="客户名字："
+                        prop="customerId"
+                        label-width="120px"
+                        class="postInfo-container-item"
+                      >
+                        <el-select v-model="postForm.customerId" filterable class="filter-item" style="float: left;width: 100%;" placeholder="请选择">
+                          <el-option :label=postForm.customerName :value=postForm.customerId></el-option>
+                        </el-select>
+                      </el-form-item>
+                    </el-col>
+                    <el-col :xs="24" :sm="12" :lg="6" :span="6">
+                      <el-form-item
+                        label="委托单位："
+                        prop="clientUnit"
+                        label-width="120px"
+                        class="postInfo-container-item"
+                      >
+                        <el-input :value="postForm.clientUnit" class="filter-item" readonly disabled/>
+                      </el-form-item>
+                    </el-col>
+                    <el-col :xs="24" :sm="12" :lg="6" :span="6">
+                      <el-form-item
+                        label="联系方式："
+                        prop="mobile"
+                        label-width="120px"
+                        class="postInfo-container-item"
+                      >
+                        <el-input :value="postForm.mobile" class="filter-item" readonly disabled />
+                      </el-form-item>
+                    </el-col>
+                  </el-row>
+                  <el-row>
+                    <el-col :xs="24" :sm="12" :lg="6" :span="6">
+                      <el-form-item
+                        label="客户经理："
+                        prop="clientManager"
+                        label-width="120px"
+                        class="postInfo-container-item"
+                      >
+                        <el-input :value="postForm.clientManager" class="filter-item" readonly disabled/>
+                      </el-form-item>
+                    </el-col>
+                    <el-col :xs="24" :sm="12" :lg="6" :span="6">
+                      <el-form-item
+                        label="业务来源："
+                        prop="businessSource"
+                        :rules="{required: true, message: '请输入业务来源', trigger: 'blur'}"
+                        label-width="120px"
+                        class="postInfo-container-item"
+                      >
+                        <el-select
+                          v-model="postForm.businessSource"
+                          placeholder="请选择"
+                          clearable
+                          filterable
+                          class="filter-item"
+                          style=" width: 100%"
+                        >
+                          <el-option v-for="item in businessSourceList" :key="item.id" :label="item.name" :value="item.id"/>
+                        </el-select>
+                      </el-form-item>
+                    </el-col>
+                    <el-col :xs="24" :sm="12" :lg="6" :span="6">
+                      <el-form-item
+                        label="项目负责人："
+                        prop="skiller"
+                        :rules="{required: true, message: '请输入项目负责人', trigger: 'blur'}"
+                        label-width="120px"
+                        class="postInfo-container-item"
+                      >
+                        <el-input v-model="postForm.skiller" class="filter-item"/>
+                      </el-form-item>
+                    </el-col>
+                    <el-col :xs="24" :sm="12" :lg="6" :span="6">
+                      <el-form-item
+                        label="签订日期："
+                        prop="signDate"
+                        label-width="120px"
+                        class="postInfo-container-item"
+                      >
+                        <el-date-picker
+                          v-model="postForm.signDate"
+                          type="date"
+                          value-format="yyyy-MM-dd"
+                          style="width: 100%"
+                          placeholder="选择日期"
+                        />
+                      </el-form-item>
+                    </el-col>
+                  </el-row>
+                  <el-row>
+                    <el-col :xs="24" :sm="12" :lg="6" :span="6">
+                      <el-form-item
+                        label="付款类型："
+                        prop="paymentMethod"
+                        :rules="{required: true, message: '请输入付款方式', trigger: 'blur'}"
+                        label-width="120px"
+                        class="postInfo-container-item"
+                      >
+                        <el-select
+                          v-model="postForm.paymentMethod"
+                          placeholder="请选择"
+                          clearable
+                          filterable
+                          class="filter-item"
+                          style=" width: 100%"
+                        >
+                          <el-option key="1" label="一次性付款" value="一次性付款"/>
+                          <el-option key="2" label="分期付款" value="分期付款"/>
+                        </el-select>
+                      </el-form-item>
+                    </el-col>
+                    <el-col :xs="24" :sm="12" :lg="6" :span="6">
+                      <el-form-item
+                        label="合同金额："
+                        prop="amount"
+                        label-width="120px"
+                        class="postInfo-container-item"
+                      >
+                        <el-input v-model.number="postForm.amount" class="filter-item" type="number" readonly disabled>
+                          <i slot="suffix" style="font-size:normal;margin-right: 10px;line-height: 30px">元</i>
+                        </el-input>
+                      </el-form-item>
+                    </el-col>
+                    <el-col :xs="24" :sm="12" :lg="6" :span="6">
+                      <el-form-item
+                        label="所属部门："
+                        prop="departmentId"
+                        :rules="{required: true, message: '请选择所属部门', trigger: 'blur'}"
+                        label-width="120px"
+                        class="postInfo-container-item"
+                      >
+                        <el-select
+                          v-model="postForm.departmentId"
+                          placeholder="请选择"
+                          clearable
+                          filterable
+                          class="filter-item"
+                          style=" width: 100%"
+                        >
+                          <el-option
+                            v-for="item in departmentsOptions"
+                            :key="item.id"
+                            :label="item.name"
+                            :value="item.id"
+                          />
+                        </el-select>
+                      </el-form-item>
+                    </el-col>
+                    <el-col :xs="24" :sm="12" :lg="6" :span="6">
+                      <el-form-item   label-width="120px" v-model="postForm.contractUrl" style=" width: 100%">
+                        <el-upload
+                          action="/api/upload"
+                          :limit="1" :on-success="changeres" :on-exceed="handleExceed" :on-preview="handleAttachmentPreview"
+                          :file-list="fileList" :before-remove="beforeRemove">
+                          <el-button type="primary">上传电子合同<i class="el-icon-upload el-icon--right"></i></el-button>
+                        </el-upload>
+                      </el-form-item>
+                    </el-col>
+                  </el-row>
+                  <div style="margin-top:20px;width:100%;height:1px;background:rgba(242,242,242,1);"/>
+                  <div style="margin-bottom: 30px">
+                    <h3 class="title">
+                      <div class="avatar-wrapper icon-title" style="background:rgba(255,175,41,1)">人</div>
+                      <div class="icon-info">
+                        人员配置
+                        <span style="color: orangered">*</span>
+                      </div>
+                    </h3>
+                  </div>
+                </div>
+                <el-transfer
+                  filterable
+                  :filter-method="filterMethod"
+                  filter-placeholder="请输入姓名"
+                  v-model="userIds"
+                  :titles="['所有员工', '所选员工']"
+                  :data="users"
+                >
+                </el-transfer>
+              </div>
+            </el-form>
+          </el-tab-pane>
+        </el-tabs>
+      </div>
+    </y-detail-page-layout>
+  </div>
+</template>
+<script>
+  import Breadcrumb from '@/components/Breadcrumb'
+  import YDetailPageLayout from '@/components/YDetailPageLayout'
+
+  export default {
+    name: 'transfer',
+    components: {
+      Breadcrumb,
+      YDetailPageLayout,
+    },
+    data() {
+      return {
+        postForm: {
+          name:this.$route.query.opportunityName,
+          departmentId:'',
+          clientUnit:'',
+          mobile:'',
+          userId: this.$route.query.userId,
+          clientManager:this.$route.query.userName,
+          customerInfo:this.$route.query.customerName,
+          amount:this.$route.query.estimateAmount,
+          customerId:this.$route.query.customerId,
+          customerName:this.$route.query.customerName,
+          oaNo:''
+        },
+        activeName: 'first',
+        vLoading: false,
+        users:[],
+        userIds: [],
+        filterMethod(query, item) {
+          return item.label.indexOf(query) > -1;
+        },
+        departmentsOptions:[],
+        contractName:'',
+        fileList:[],
+        customerOptions:[],
+        tip:null,
+        oaNoDisable:false,
+        oaNoReadonly:false,
+        cateList:[],
+        businessSourceList:[]
+      }
+    },
+    created() {
+      this.getAllUser();
+      this.getDepartment();
+      this.getCateList();
+      this.getBusinessSourceList();
+      this.getCustomerDetail();
+    },
+    methods: {
+
+      getCateList(){
+        this.$api.dictData.simpleType("项目类型").then(res => {
+          this.cateList = res.data
+        })
+      },
+      getBusinessSourceList(){
+        this.$api.dictData.simpleType("业务来源").then(res => {
+          this.businessSourceList = res.data
+        })
+      },
+
+      getCustomerDetail(){
+        if (this.postForm.customerId){
+          this.$api.customer.detail(this.postForm.customerId).then(res =>{
+          this.postForm.clientUnit = res.data.department;
+          this.postForm.mobile = res.data.mobile;
+        })
+        }
+      },
+      handleAttachmentPreview(file){
+        window.open(file.url)
+      },
+      handleExceed(files, fileList) {
+        this.$message.warning(`当前限制选择 1个文件，本次选择了 ${files.length} 个文件`);
+      },
+      // 上传
+      changeres(res, file) {
+        if (res.code === 200){
+          this.postForm.contractUrl = res.data.url;
+          const arr = res.data.url.split("-");
+          this.contractName = arr[1];
+        }else {
+          this.$notify({
+            title: '错误',
+            message: '合同上传失败',
+            type: 'error',
+            duration: 2000
+          });
+          return;
+        }
+      },
+      changePrefix(e){
+        this.postForm.belongTo = e;
+        this.postForm.oaNo = '';
+        if (e === 'TJC'){
+          this.tip = '事业部流水号';
+          this.oaNoDisable = true;
+          this.oaNoReadonly = true;
+        }
+        if (e === 'DY'){
+          this.tip = null;
+          this.oaNoDisable = false;
+          this.oaNoReadonly = false;
+        }
+        this.postForm.oaNo = null;
+      },
+      getZero(num) {
+        // 单数前面加0
+        if (parseInt(num) < 10) {
+          num = '0' + num;
+        }
+        return num;
+      },
+      getAllUser() {
+        const that = this;
+        that.$api.user.simpleAll().then(data => {
+          if (data.code === 200) {
+            this.users = data.data.map((item) => {
+              return {
+                key: item.id,
+                label: item.name,
+              };
+            });
+          } else {
+            this.$message({
+              type: 'error',
+              message: data.msg
+            })
+          }
+        })
+      },
+      getDepartment(){
+        this.$api.department.simpleAll().then(res => {
+          this.departmentsOptions = res.data
+        })
+      },
+      handleCreate() {
+        if (this.userIds.length==0){
+          this.$notify({
+            title: '错误',
+            message: '人员配置不能为空',
+            type: 'error',
+            duration: 2000
+          });
+          return;
+        }
+        if (this.postForm.contractUrl){
+          const date = new Date();
+          this.postForm.uploadDate = date.getFullYear() + "-" + (this.getZero(date.getMonth() + 1)) + "-" + this.getZero((date.getDate()));
+        }else {
+          this.postForm.uploadDate = null;
+        }
+        this.$refs.postForm.validate(valid => {
+          if (valid) {
+              this.$api.item.add(Object.assign({}, this.postForm, {
+                userIds: this.userIds.map(item => { return item }),
+              })).then(res => {
+                if (res.code === 200) {
+                  this.$notify({
+                    title: '成功',
+                    message: '新增成功',
+                    type: 'success',
+                    duration: 2000
+                  });
+                  this.$router.push("/item/list/mine")
+                  this.vLoading = false
+                }
+              }).catch(() => {
+                this.vLoading = false
+              })
+          }
+        })
+      },
+      beforeRemove(file, fileList) {
+      this.$confirm(`确定移除 ${ file.name }？`, '警告', {
+          confirmButtonText: '确认',
+          cancelButtonText: '取消',
+          type: 'warning',
+        })
+          .then(async () => {
+            this.postForm.contractUrl = '';
+          })
+      }
+    }
+  }
+</script>
+<style lang="scss" scoped>
+
+</style>

src/views/market/business/list.vue

@@ -8,7 +8,7 @@
       <template slot="left">
         <PermissionButton menu-code="_views_market_business_add" class-name="filter-item" type="primary" name size="mini"
           :page-jump="true" round style="float: left" />
-        <el-input v-model="listQuery.customerName" placeholder="客户名字" clearable
+        <el-input v-model="listQuery.keyword" placeholder="客户名字/客户经理" clearable
           style="margin-left: 20px;width: 320px;float: left;">
         </el-input>
         <el-input v-model="listQuery.opportunityName" placeholder="商机名称" clearable
@@ -71,7 +71,7 @@
             <PermissionButton menu-code="_views_market_business_detail" class-name="filter-item" name="" type="primary"
               :page-jump="true" :page-query="{ id: row.id, listQuery: listQuery }" round size="mini" />
             <PermissionButton menu-code="_views_market_business_state" class-name="filter-item" name="" type="danger"
-              round size="mini" @click="handleState(row.id, row.opportunityName, row.state, row.offReason)" />
+              round size="mini" @click="handleState(row)" />
             <PermissionButton menu-code="_views_market_business_transfer" class-name="filter-item" name="" type="success"
               round size="mini" @click="openTransferDialog(row)" />
           </template>
@@ -185,15 +185,13 @@ export default {
         page: 1,
         size: 10,
         descs: 'id',
+        keyword: null
       },
       listQueryKey: 'keyword',
       importLoading: false,
       AllEnum: [],
       dialogFormVisible: false,
-      temp: {
-        state: '',
-        offReason: ''
-      },
+      temp: {},
       dialogFormVisibleX: false,
       detail: {},
       activeNames: ['1'],
@@ -219,13 +217,13 @@ export default {
     that.getList();
   },
   methods: {
-    handleState(businessId, businessName, state, offReason) {
-      const that = this;
-      that.temp.id = businessId;
-      that.temp.opportunityName = businessName;
-      that.temp.state = state;
-      that.temp.offReason = offReason;
-      that.dialogFormVisible = true;
+    handleState(row) {
+      this.temp = row;
+      // that.temp.id = row.businessId;
+      // that.temp.opportunityName = row.businessName;
+      // that.temp.state = row.state;
+      // that.temp.offReason = row.offReason;
+      this.dialogFormVisible = true;
     },
     updateState() {
       if (this.temp.id) {
@@ -239,7 +237,11 @@ export default {
               duration: 2000
             });
             this.dialogFormVisible = false;
-            this.getList();
+            if (this.temp.state === "签约") {
+              this.temp.id = null;
+              this.$router.push({ path: "/item/transfer", query: this.temp })
+            }
+
           }
         }).catch(() => {
           this.dialogFormVisible = false;
@@ -302,10 +304,8 @@ export default {
       const that = this
       this.listLoading = true
       // console.log(that.listQuery)
-      const key = {}
-      key[this.listQueryKey] = this.listQuery.description
       this.$api.business
-        .list(Object.assign({}, that.listQuery, key))
+        .list(Object.assign({}, that.listQuery))
         .then((res) => {
           that.pageData = res.data
           setTimeout(() => {

src/views/market/customer/list.vue

@@ -8,7 +8,7 @@
       <template slot="left">
         <PermissionButton menu-code="_views_market_customer_add" class-name="filter-item" type="primary" name size="mini"
           :page-jump="true" round style="float: left" />
-        <el-input v-model="listQuery.name" placeholder="客户名字" clearable
+        <el-input v-model="listQuery.keyword" placeholder="客户名字/市/县/单位/职位/科室" clearable
           style="margin-left: 20px;width: 320px;float: left;">
         </el-input>
         <el-select clearable style="margin-left: 20px;width: 200px;float: left;" v-model="listQuery.level"
@@ -187,6 +187,7 @@ export default {
         page: 1,
         size: 10,
         descs: 'id',
+        keyword:null
       },
       listQueryKey: 'keyword',
       importLoading: false,
@@ -280,11 +281,9 @@ export default {
     getList() {
       const that = this
       this.listLoading = true
-      // console.log(that.listQuery)
-      const key = {}
-      key[this.listQueryKey] = this.listQuery.description
+      console.log(that.listQuery)
       this.$api.customer
-        .list(Object.assign({}, that.listQuery, key))
+        .list(Object.assign({}, that.listQuery))
         .then((res) => {
           that.pageData = res.data
           setTimeout(() => {

src/views/market/payment/list.vue

@@ -1,151 +1,137 @@
 <template>
   <div class="app-container">
     <div class="title-container">
-      <breadcrumb id="breadcrumb-container" class="breadcrumb-container"/>
+      <breadcrumb id="breadcrumb-container" class="breadcrumb-container" />
     </div>
-
-    <y-page-list-layout :page-list="pageData" :page-para="listQuery" :get-page-list="getList">
-      <template slot="left">
-        <el-input
-          v-model="listQuery.itemName"
-          placeholder="项目名称"
-          clearable
-          style="margin-left: 20px;width: 320px;float: left;"
-        >
-        </el-input>
-        <el-button
-          class="filter-item"
-          style="margin-left: 10px;float: left;"
-          type="primary"
-          @click="searchList"
-          round
-        >搜索
-        </el-button>
-        <el-button
-          class="filter-item"
-          style="float: left;"
-          round
-          type="warning"
-          @click="resetSearch()"
-        >重置
-        </el-button>
-      </template>
-      <parentTable
-        v-loading="listLoading"
-        :data="pageData.records"
-        slot="table"
-        style="width: 100%;"
-      >
-        <el-table-column label="事业部流水号" align="center" width="160">
-          <template slot-scope="{row}">
-            <span>{{ row.businessNo }}</span>
-          </template>
-        </el-table-column>
-        <el-table-column label="项目编号" align="center" width="160">
-          <template slot-scope="{row}">
-            <span>{{ row.oaNo }}</span>
-          </template>
-        </el-table-column>
-        <el-table-column label="项目名称" align="center">
-          <template slot-scope="{row}">
-            <span>{{ row.name }}</span>
-          </template>
-        </el-table-column>
-        <el-table-column label="客户经理" align="center" width="160">
-          <template slot-scope="{row}">
-            <span>{{ row.clientManager }}</span>
-          </template>
-        </el-table-column>
-        <el-table-column label="委托单位" align="center" width="160">
-          <template slot-scope="{row}">
-            <span>{{ row.clientUnit}}</span>
+    <el-tabs v-model="activeName" @tab-click="handleClick" type="border-card" style="margin-top: 30px;">
+      <el-tab-pane label="项目回款" name="first">
+        <y-page-list-layout :page-list="pageData" :page-para="listQuery" :get-page-list="getList">
+          <template slot="left">
+            <el-input v-model="listQuery.itemName" placeholder="项目名称" clearable
+              style="margin-left: 20px;width: 320px;float: left;">
+            </el-input>
+            <el-button class="filter-item" style="margin-left: 10px;float: left;" type="primary" @click="searchList"
+              round>搜索
+            </el-button>
+            <el-button class="filter-item" style="float: left;" round type="warning" @click="resetSearch()">重置
+            </el-button>
           </template>
-        </el-table-column>
-        <el-table-column label="合同签订时间" align="center" width="160">
-          <template slot-scope="{row}">
-            <span>{{ row.signDate}}</span>
+          <parentTable v-loading="listLoading" :data="pageData.records" slot="table" style="width: 100%;">
+            <el-table-column label="事业部流水号" align="center" width="160">
+              <template slot-scope="{row}">
+                <span>{{ row.businessNo }}</span>
+              </template>
+            </el-table-column>
+            <el-table-column label="项目编号" align="center" width="160">
+              <template slot-scope="{row}">
+                <span>{{ row.oaNo }}</span>
+              </template>
+            </el-table-column>
+            <el-table-column label="项目名称" align="center">
+              <template slot-scope="{row}">
+                <span>{{ row.name }}</span>
+              </template>
+            </el-table-column>
+            <el-table-column label="客户经理" align="center" width="160">
+              <template slot-scope="{row}">
+                <span>{{ row.clientManager }}</span>
+              </template>
+            </el-table-column>
+            <el-table-column label="委托单位" align="center" width="160">
+              <template slot-scope="{row}">
+                <span>{{ row.clientUnit }}</span>
+              </template>
+            </el-table-column>
+            <el-table-column label="合同签订时间" align="center" width="160">
+              <template slot-scope="{row}">
+                <span>{{ row.signDate }}</span>
+              </template>
+            </el-table-column>
+            <el-table-column label="合同金额（元）" align="center" width="100">
+              <template slot-scope="{row}">
+                <span>{{ row.amount }}</span>
+              </template>
+            </el-table-column>
+            <el-table-column label="已收款金额（元）" align="center" width="100">
+              <template slot-scope="{row}">
+                <span style="color: green">{{ row.payedAmount }}</span>
+              </template>
+            </el-table-column>
+            <el-table-column label="未收款金额（元）" align="center" width="100">
+              <template slot-scope="{row}">
+                <span style="color: red">{{ row.notPayedAmount }}</span>
+              </template>
+            </el-table-column>
+            <el-table-column label="操作" align="center" width="250" fixed="right">
+              <template slot-scope="{row}">
+                <PermissionButton menu-code="_views_market_payment_detailList" class-name="filter-item" type="primary"
+                  :page-jump="true" :page-query="{ id: row.id }" round size="mini" />
+                <PermissionButton menu-code="_views_market_payment_add" class-name="filter-item" type="success" round
+                  size="mini" @click="handleAdd(row.id, row.name)" />
+              </template>
+            </el-table-column>
+          </parentTable>
+        </y-page-list-layout>
+      </el-tab-pane>
+      <el-tab-pane label="回款记录" name="sec">
+        <y-page-list-layout :page-list="pageXData" :page-para="listQuery" :get-page-list="getXList">
+          <template slot="left">
+            <el-input v-model="listQuery.name" placeholder="回款名称" clearable
+              style="margin-left: 20px;width: 320px;float: left;">
+            </el-input>
+            <el-button class="filter-item" style="margin-left: 10px;float: left;" type="primary" @click="searchXList"
+              round>搜索
+            </el-button>
+            <el-button class="filter-item" style="float: left;" round type="warning" @click="resetSearch()">重置
+            </el-button>
           </template>
-        </el-table-column>
-        <el-table-column label="合同金额（元）" align="center" width="160">
-          <template slot-scope="{row}">
-            <span>{{ row.amount}}</span>
-          </template>
-        </el-table-column>
-        <el-table-column label="已收款金额（元）" align="center" width="160">
-          <template slot-scope="{row}">
-            <span style="color: green">{{ row.payedAmount}}</span>
-          </template>
-        </el-table-column>
-        <el-table-column label="未收款金额（元）" align="center" width="160">
-          <template slot-scope="{row}">
-            <span style="color: red">{{ row.notPayedAmount}}</span>
-          </template>
-        </el-table-column>
-        <el-table-column label="操作" align="center" width="250"  fixed="right">
-          <template slot-scope="{row}">
-            <PermissionButton
-              menu-code="_views_market_payment_detailList"
-              class-name="filter-item"
-              type="primary"
-              :page-jump="true"
-              :page-query="{id: row.id}"
-              round
-              size="mini"
-            />
-            <PermissionButton
-              menu-code="_views_market_payment_add"
-              class-name="filter-item"
-              type="success"
-              round
-              size="mini"
-              @click="handleAdd(row.id,row.name)"
-            />
-          </template>
-        </el-table-column>
-      </parentTable>
-    </y-page-list-layout>
-    <el-dialog
-      width="600px"
-      title="新增回款"
-      :visible.sync="dialogFormVisible"
-      :close-on-click-modal="false"
-      custom-class="paymentDialog"
-    >
-      <el-form
-        ref="dataForm"
-        v-loading="dialogLoading"
-        :model="temp"
-        label-position="right"
-        label-width="110px"
-        style="width: 400px; margin-left:50px;"
-      >
+          <parentTable v-loading="listLoading" :data="pageXData.records" slot="table" style="width: 100%;">
+            <el-table-column label="项目名称" align="center" width="center">
+              <template slot-scope="{row}">
+                <span>{{ row.itemName }}</span>
+              </template>
+            </el-table-column>
+            <el-table-column label="回款名称" align="center" width="310">
+              <template slot-scope="{row}">
+                <span>{{ row.name }}</span>
+              </template>
+            </el-table-column>
+            <el-table-column label="回款金额" align="center" width="310">
+              <template slot-scope="{row}">
+                <span>{{ row.amount }}</span>
+              </template>
+            </el-table-column>
+            <el-table-column label="回款日期" align="center" width="310">
+              <template slot-scope="{row}">
+                <span>{{ row.paymentDate }}</span>
+              </template>
+            </el-table-column>
+          </parentTable>
+        </y-page-list-layout>
+      </el-tab-pane>
+    </el-tabs>
+
+    <el-dialog width="600px" title="新增回款" :visible.sync="dialogFormVisible" :close-on-click-modal="false"
+      custom-class="paymentDialog">
+      <el-form ref="dataForm" v-loading="dialogLoading" :model="temp" label-position="right" label-width="110px"
+        style="width: 400px; margin-left:50px;">
         <el-form-item label="项目名称：" prop="itemName">
-          <el-input v-model="temp.itemName" class="filter-item" readonly disabled/>
+          <el-input v-model="temp.itemName" class="filter-item" readonly disabled />
         </el-form-item>
 
-        <el-form-item label="回款名称：" prop="name" :rules="{required: true, message: '请填写回款名称', trigger: 'blur'}">
-          <el-input v-model="temp.name" class="filter-item"/>
+        <el-form-item label="回款名称：" prop="name" :rules="{ required: true, message: '请填写回款名称', trigger: 'blur' }">
+          <el-input v-model="temp.name" class="filter-item" />
         </el-form-item>
 
-        <el-form-item label="回款金额：" prop="amount" :rules="{required: true, message: '请填写回款金额', trigger: 'blur'}">
+        <el-form-item label="回款金额：" prop="amount" :rules="{ required: true, message: '请填写回款金额', trigger: 'blur' }">
           <el-input v-model.number="temp.amount" class="filter-item" type="number">
             <i slot="suffix" style="font-size:normal;margin-right: 10px;line-height: 30px">元</i>
           </el-input>
         </el-form-item>
-        <el-form-item
-          label="回款日期："
-          prop="paymentDate"
-          :rules="{required: true, message: '请选择日期', trigger: 'blur'}"
-          class="filter-item"
-        >
-          <el-date-picker
-            v-model="temp.paymentDate"
-            type="date"
-            value-format="yyyy-MM-dd"
-            style="width: 100%"
-            placeholder="选择日期"
-            class="filter-item"
-          />
+        <el-form-item label="回款日期：" prop="paymentDate" :rules="{ required: true, message: '请选择日期', trigger: 'blur' }"
+          class="filter-item">
+          <el-date-picker v-model="temp.paymentDate" type="date" value-format="yyyy-MM-dd" style="width: 100%"
+            placeholder="选择日期" class="filter-item" />
         </el-form-item>
         <el-form-item label="">
           <el-button @click="dialogFormVisible = false">
@@ -160,120 +146,146 @@
   </div>
 </template>
 <script>
-  import YPageListLayout from '@/components/YPageListLayout'
-  import Breadcrumb from '@/components/Breadcrumb'
-  import PermissionButton from '@/components/PermissionButton/PermissionButton'
+import YPageListLayout from '@/components/YPageListLayout'
+import Breadcrumb from '@/components/Breadcrumb'
+import PermissionButton from '@/components/PermissionButton/PermissionButton'
 
-  export default {
-    name: 'ViewsMarketPaymentList',
-    components: {
-      Breadcrumb,
-      YPageListLayout,
-      PermissionButton,
+export default {
+  name: 'ViewsMarketPaymentList',
+  components: {
+    Breadcrumb,
+    YPageListLayout,
+    PermissionButton,
+  },
+  filters: {
+    statusFilter(status) {
+      const statusMap = {
+        published: 'success',
+        draft: 'info',
+        deleted: 'danger',
+      }
+      return statusMap[status]
     },
-    filters: {
-      statusFilter(status) {
-        const statusMap = {
-          published: 'success',
-          draft: 'info',
-          deleted: 'danger',
-        }
-        return statusMap[status]
+  },
+  data() {
+    return {
+      isDisable: false,
+      tableKey: 0,
+      pageData: { records: [] },
+      total: 20,
+      listLoading: true,
+      dialogLoading: false,
+      dialogFormVisible: false,
+      listQuery: {
+        page: 1,
+        size: 10,
+        descs: 'id',
+        itemName: null
       },
-    },
-    data() {
-      return {
-        isDisable:false,
-        tableKey: 0,
-        pageData: { records: [] },
-        total: 20,
-        listLoading: true,
-        dialogLoading:false,
-        dialogFormVisible:false,
-        listQuery: {
-          page: 1,
-          size: 10,
-          // name: '',
-          // staffNo: '',
-          descs: 'id',
-          itemName:null
-        },
-        listQueryKey: 'keyword',
-        importLoading: false,
-        temp:{
-          name:'',
-          amount:'',
-          itemName:'',
-          itemId:''
-        }
+      listQueryKey: 'keyword',
+      importLoading: false,
+      temp: {
+        name: '',
+        amount: '',
+        itemName: '',
+        itemId: ''
+      },
+      activeName: 'first',
+      pageXData:{records:[]}
+    }
+  },
+  created() {
+    const that = this;
+    if (that.$route.query.current && !isNaN(that.$route.query.current)) {
+      that.listQuery.current = parseInt(that.$route.query.current);
+    }
+    that.getList();
+    that.getXList();
+  },
+  methods: {
+    save() {
+      if (this.temp.itemId) {
+        this.$refs.dataForm.validate(valid => {
+          if (valid) {
+            this.$api.payment.add(Object.assign({}, this.temp, {
+            })).then(res => {
+              if (res.code === 200) {
+                this.$notify({
+                  title: '成功',
+                  message: '新增成功',
+                  type: 'success',
+                  duration: 2000
+                });
+                this.getList();
+                this.temp.itemId = null;
+                this.temp.name = null;
+                this.temp.amount = null;
+                this.temp.paymentDate = null;
+                this.dialogFormVisible = false
+              }
+            }).catch(() => {
+              this.dialogFormVisible = false
+            })
+          }
+        })
       }
     },
-    created() {
+    handleAdd(itemId, itemName) {
       const that = this;
-      if (that.$route.query.current && !isNaN(that.$route.query.current)) {
-        that.listQuery.current = parseInt(that.$route.query.current);
+      that.temp.itemId = itemId;
+      that.temp.itemName = itemName;
+      that.dialogFormVisible = true;
+      this.$nextTick(() => {
+        this.$refs['dataForm'].clearValidate()
+      })
+    },
+    resetSearch() {
+      this.$router.push({ query: {} });
+      this.listQuery = {
+        current: 1,
+        size: 10,
+        descs: 'id',
+        me: false
       }
-      that.getList()
+      this.getList();
+      this.getXList();
     },
-    methods: {
-      save(){
-        if (this.temp.itemId){
-          this.$refs.dataForm.validate(valid => {
-            if (valid) {
-              this.$api.payment.add(Object.assign({}, this.temp, {
-              })).then(res => {
-                if (res.code === 200) {
-                  this.$notify({
-                    title: '成功',
-                    message: '新增成功',
-                    type: 'success',
-                    duration: 2000
-                  });
-                  this.getList();
-                  this.temp.itemId = null;
-                  this.temp.name = null;
-                  this.temp.amount = null;
-                  this.temp.paymentDate = null;
-                  this.dialogFormVisible = false
-                }
-              }).catch(() => {
-                this.dialogFormVisible = false
-              })
-            }
-          })
-        }
-      },
-      handleAdd(itemId, itemName) {
-        const that = this;
-        that.temp.itemId = itemId;
-        that.temp.itemName = itemName;
-        that.dialogFormVisible = true;
-        this.$nextTick(() => {
-          this.$refs['dataForm'].clearValidate()
+    searchList() {
+      // 重置分页
+      this.listQuery.page = 1
+      this.listQuery.size = 20
+      this.getList();
+    },
+    searchXList() {
+      // 重置分页
+      this.listQuery.page = 1
+      this.listQuery.size = 20
+      this.getXList();
+    },
+    getList() {
+      const that = this
+      this.listLoading = true
+      const key = {}
+      this.$api.payment.itemPayment(Object.assign({}, that.listQuery, key)).then((res) => {
+        that.pageData = res.data
+        setTimeout(() => {
+          that.listLoading = false
+        }, 200)
+      })
+        .catch(() => {
+          that.listLoading = false
         })
-      },
-      resetSearch() {
-        this.$router.push({ query: {} });
-        this.listQuery = {
-          current: 1,
-          size: 10,
-          descs: 'id',
-          me: false
-        }
-        this.getList()
-      },
-      searchList() {
-        // 重置分页
-        this.listQuery.page = 1
-        this.listQuery.size = 20
-        this.getList()
-      },
-      getList() {
-        const that = this
-        this.listLoading = true
+    },
+    getXList() {
+        const that = this;
+        this.listLoading = true;
+        // console.log(that.listQuery)
         const key = {}
-        this.$api.payment.itemPayment(Object.assign({}, that.listQuery, key)).then((res) => {
-            that.pageData = res.data
+        key[this.listQueryKey] = this.listQuery.description;
+        this.$api.payment
+          .list(Object.assign({}, that.listQuery, key))
+          .then((res) => {
+            that.pageXData = res.data
             setTimeout(() => {
               that.listLoading = false
             }, 200)
@@ -282,48 +294,49 @@
             that.listLoading = false
           })
       },
-    },
-  }
+  },
+}
 </script>
 <style lang="scss" scoped>
-  .right {
-    flex: 1;
+.right {
+  flex: 1;
 
-    .title {
-      font-size: 16px;
-      font-weight: 500;
-      color: rgba(51, 51, 51, 1);
-      line-height: 35px;
-      margin-bottom: 8px;
-    }
+  .title {
+    font-size: 16px;
+    font-weight: 500;
+    color: rgba(51, 51, 51, 1);
+    line-height: 35px;
+    margin-bottom: 8px;
+  }
 
-    .menu-2-box {
-      display: flex;
-      flex-wrap: wrap;
-      width: 100%;
-    }
+  .menu-2-box {
+    display: flex;
+    flex-wrap: wrap;
+    width: 100%;
+  }
 
-    .menu-2-item {
-      display: flex;
-      align-items: center;
-      color: #656565;
-      font-size: 12px;
-      width: 230px;
-      height: 101px;
-      background: rgb(255, 185, 129);
-      border-radius: 3px;
-      padding-left: 20px;
-      margin-right: 10px;
-      margin-bottom: 10px;
-      cursor: pointer;
-      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
+  .menu-2-item {
+    display: flex;
+    align-items: center;
+    color: #656565;
+    font-size: 12px;
+    width: 230px;
+    height: 101px;
+    background: rgb(255, 185, 129);
+    border-radius: 3px;
+    padding-left: 20px;
+    margin-right: 10px;
+    margin-bottom: 10px;
+    cursor: pointer;
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
 
-      .text {
-        margin-left: 16px;
-      }
+    .text {
+      margin-left: 16px;
     }
   }
-  /deep/.paymentDialog{
-    border-radius: 20px;
-  }
+}
+
+/deep/.paymentDialog {
+  border-radius: 20px;
+}
 </style>