update

src/views/userCenter/menuParst/matterInfo.vue

@@ -6,29 +6,68 @@
           事项管理
         </el-col>
         <el-col :span="24" class="two">
-          <el-tabs v-model="active" type="card">
-            <el-tab-pane label="我的全部" name="first">
-              <data-table :fields="fields" :opera="opera" :data="allList" :total="allTotal" @query="search"></data-table>
+          <el-tabs v-model="active" type="card" @tab-click="tabChange">
+            <el-tab-pane label="我的全部" name="all">
+              <data-table
+                :fields="fields"
+                :opera="opera"
+                :data="listall"
+                :total="totalall"
+                @query="search"
+                @check="data => toStep(data, '1')"
+                @keep="toKeep"
+              ></data-table>
             </el-tab-pane>
-            <el-tab-pane label="我的洽谈" name="second">
-              <data-table :fields="fields" :opera="opera" :data="oneList" :total="oneTotal" @query="search"></data-table>
+            <el-tab-pane label="我的洽谈" name="0">
+              <data-table
+                :fields="fields"
+                :opera="opera"
+                :data="list0"
+                :total="total0"
+                @query="data => search(data, '0')"
+                @check="data => toStep(data, '1')"
+              ></data-table>
             </el-tab-pane>
-            <el-tab-pane label="我的意向" name="third">
-              <data-table :fields="fields" :opera="opera" :data="twoList" :total="twoTotal" @query="search"></data-table>
+            <el-tab-pane label="我的意向" name="1">
+              <data-table :fields="fields" :opera="opera" :data="list1" :total="total1" @query="data => search(data, '1')" @keep="toKeep"></data-table>
             </el-tab-pane>
-            <el-tab-pane label="我的交易" name="fourth">
-              <data-table :fields="fields" :opera="opera" :data="thrList" :total="thrTotal" @query="search"></data-table>
+            <el-tab-pane label="我的交易" name="2">
+              <data-table :fields="fields" :opera="[]" :data="list2" :total="total2" @query="data => search(data, '2')"></data-table>
             </el-tab-pane>
           </el-tabs>
         </el-col>
       </el-col>
     </el-row>
+    <el-dialog title="上传合同备案" :visible.sync="dialog" width="40%" @close="toClose" destroy-on-close>
+      <el-form>
+        <el-form-item label="合同图片" required>
+          <upload
+            :limit="1"
+            :data="keep.file_path"
+            type="file_path"
+            listType=""
+            :url="'/files/platform/transaction_pact/upload'"
+            @upload="uploadSuccess"
+            @delete="uploadDelete"
+          ></upload>
+        </el-form-item>
+        <el-form-item label="描述" required>
+          <el-input type="textarea" v-model="keep.desc" :autosize="{ minRows: 3, maxRows: 5 }"></el-input>
+        </el-form-item>
+      </el-form>
+      <div slot="footer">
+        <el-button @click="dialog = false">取 消</el-button>
+        <el-button type="primary" @click="stepKeep">确 定</el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
 <script>
+import upload from '@common/src/components/frame/upload.vue';
 import dataTable from '@common/src/components/frame/filter-page-table.vue';
 import { mapState, createNamespacedHelpers } from 'vuex';
+const { mapActions: transaction } = createNamespacedHelpers('transaction');
 export default {
   metaInfo() {
     return { title: this.$route.meta.title };
@@ -37,23 +76,24 @@ export default {
   props: {},
   components: {
     dataTable,
+    upload,
   },
   data: function() {
     return {
-      active: 'first',
+      active: 'all',
       opera: [
         {
           label: '意向',
           method: 'check',
           display: item => {
-            return item.status == '0' ? true : false;
+            return item.status == '0';
           },
         },
         {
           label: '备案',
           method: 'keep',
           display: item => {
-            return item.status == '1' ? true : false;
+            return item.status == '1';
           },
         },
       ],
@@ -72,61 +112,91 @@ export default {
         },
       ],
       // 我的全部
-      allList: [
-        {
-          product: '产品名称产品名称产品名称',
-          s_name: '长春市福瑞科技有限公司',
-          s_phone: '17319450324',
-          d_name: '长春市福瑞科技有限公司',
-          d_phone: '17319450324',
-          status: '0',
-        },
-      ],
-      allTotal: 0,
+      listall: [],
+      totalall: 0,
       // 我的洽谈
-      oneList: [
-        {
-          product: '产品名称',
-          s_name: '供给者姓名',
-          s_phone: '供给者联系电话',
-          d_name: '需求者姓名',
-          d_phone: '需求者联系电话',
-          status: '0',
-        },
-      ],
-      oneTotal: 0,
+      list0: [],
+      total0: 0,
       // 我的意向
-      twoList: [
-        {
-          product: '产品名称',
-          s_name: '供给者姓名',
-          s_phone: '供给者联系电话',
-          d_name: '需求者姓名',
-          d_phone: '需求者联系电话',
-          status: '1',
-        },
-      ],
-      twoTotal: 0,
+      list1: [],
+      total1: 0,
       // 交易完成
-      thrList: [
-        {
-          product: '产品名称',
-          s_name: '供给者姓名',
-          s_phone: '供给者联系电话',
-          d_name: '需求者姓名',
-          d_phone: '需求者联系电话',
-          status: '3',
-        },
-      ],
-      thrTotal: 0,
+      list2: [],
+      total2: 0,
+      dialog: false,
+      keep: {},
     };
   },
   async created() {
     await this.search();
   },
   methods: {
-    search({ skip = 0, limit = 10, ...info }) {
-      console.log('查询列表');
+    ...transaction(['query', 'step']),
+    async search({ skip = 0, limit = 10, ...info } = {}, status = 'all') {
+      const query = { skip, limit, user_id: this.user.id };
+      if (status != 'all') query.status = status == '2' ? '2,3' : status;
+      const res = await this.query(query);
+      if (this.$checkRes(res)) {
+        this.$set(this, `list${status}`, res.data);
+        this.$set(this, `total${status}`, res.total);
+      }
+    },
+    async toStep({ data }, status) {
+      console.log(status);
+      this.$confirm('您确定双方已达成意向?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(async () => {
+          const { id } = data;
+          const res = await this.step({ id, status });
+          if (this.$checkRes(res, '达成意向!', res.errmsg || '操作失败')) this.research();
+        })
+        .catch(() => {});
+    },
+    async toKeep({ data }) {
+      this.keep = _.cloneDeep(data);
+      this.keep.status = '2';
+      this.dialog = true;
+    },
+    async stepKeep() {
+      const { id, file_path, desc } = this.keep;
+      if (!(id && file_path && desc)) {
+        this.$message.error('需要上传合同图片及填写描述内容');
+        return;
+      }
+      const dup = { id, pact: { file_path, desc }, status: '2' };
+      const res = await this.step(dup);
+      if (this.$checkRes(res, '备案成功,请等待审核', res.errmsg || '备案失败')) this.research();
+    },
+    tabChange(tab) {
+      const status = _.get(tab, 'name', 0);
+      if (this[`list${status}`].length <= 0) {
+        this.search({}, status);
+      }
+    },
+    toClose() {
+      this.keep = {};
+    },
+    research() {
+      this.search();
+      if (this.active !== 'all') this.search({}, this.active);
+      this.dialog = false;
+    },
+    uploadSuccess({ type, data }) {
+      this.$set(this.keep, `${type}`, data.uri);
+      this.$message({
+        message: '上传成功',
+        type: 'success',
+      });
+    },
+    uploadDelete(index) {
+      this.$set(this.keep, `file_path`, null);
+      this.$message({
+        message: '删除成功',
+        type: 'success',
+      });
     },
   },
   computed: {