1

src/components/upload/uploadFile.vue

@@ -0,0 +1,122 @@
+<template>
+  <div id="upload">
+    <el-upload
+      v-if="url"
+      ref="upload"
+      :action="url"
+      :list-type="listType"
+      :file-list="fileList"
+      :limit="limit"
+      :on-exceed="outLimit"
+      :on-preview="handlePictureCardPreview"
+      :before-remove="handleRemove"
+      :on-success="onSuccess"
+      :before-upload="beforeUpload"
+      :show-file-list="showList"
+      :accept="accept"
+    >
+      <el-button size="small" type="primary" v-if="isBtn">点击上传</el-button>
+      <template v-else-if="uploadBtn">
+        <el-button type="danger">选择文件</el-button>
+      </template>
+      <template v-else>
+        <el-button type="primary" size="mini">选择文件</el-button>
+      </template>
+      <template #tip v-if="tip">
+        {{ tip }}
+      </template>
+    </el-upload>
+    <el-dialog :visible.sync="dialogVisible">
+      <img width="100%" :src="dialogImageUrl" alt="" />
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import _ from 'lodash';
+export default {
+  name: 'upload',
+  props: {
+    url: { type: null },
+    limit: { type: Number },
+    data: { type: null },
+    type: { type: String },
+    isBtn: { type: Boolean, default: false },
+    uploadBtn: { type: Boolean, default: false },
+    showList: { type: Boolean, default: true },
+    accept: { type: String, default: '' },
+    tip: { type: String, default: undefined },
+    listType: { type: String, default: 'picture-card' },
+  },
+  components: {},
+  data: () => ({
+    dialogVisible: false,
+    dialogImageUrl: '',
+    fileList: [],
+  }),
+  created() {
+    if (this.data) {
+      this.defalutProcess(this.data);
+    }
+  },
+  watch: {
+    data: {
+      handler(val) {
+        this.defalutProcess(val);
+      },
+    },
+  },
+  computed: {},
+  methods: {
+    handlePictureCardPreview(file) {
+      this.dialogImageUrl = file.url;
+      this.dialogVisible = false;
+    },
+    handleRemove(file, fileList) {
+      console.log(file.url, fileList);
+      // let index = fileList.findIndex(f => _.isEqual(f, file));
+      this.$emit('delete', file.url);
+      // return true;
+    },
+    outLimit() {
+      this.$message.error(`只允许上传${this.limit}个文件`);
+    },
+    onSuccess(response, file, fileList) {
+      //将文件整理好传回父组件
+      this.$emit('upload', { type: this.type, data: { ...response, name: file.name } });
+    },
+    beforeUpload(file) {
+      const sizeLimit = file.size / 1024 / 1024 < 100;
+      if (sizeLimit) return true;
+      else {
+        this.$message.error('文件超出10M！');
+        return false;
+      }
+    },
+    defalutProcess(val) {
+      if (_.isArray(val)) {
+        console.log('1');
+        let newArr = val.map(item => {
+          let object = {};
+          object.name = item.name;
+          object.url = item.url;
+          return object;
+        });
+        this.$set(this, `fileList`, newArr);
+      } else if (_.isObject(val)) {
+        console.log('2');
+        let object = {};
+        if (_.get(val, `url`)) {
+          object.name = val.name;
+          object.url = val.url;
+          this.$set(this, `fileList`, [object]);
+        }
+      } else if (typeof val === 'string') {
+        this.$set(this, `fileList`, [{ name: '附件', url: val }]);
+      }
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped></style>

src/store/index.js

@@ -51,8 +51,8 @@ import liveTechnicalNews from './live/liveTechnicalNews';
 // 网上调查
 import survey from './market/survey';
 // e专利
-import patent from './market/patent';
-import util from './market/util';
+import patent from './patent/patent';
+import patentImport from './patent/import';
 
 Vue.use(Vuex);
 
@@ -109,6 +109,6 @@ export default new Vuex.Store({
     survey,
     // e专利
     patent,
-    util,
+    patentImport,
   },
 });

src/store/patent/import.js

@@ -0,0 +1,43 @@
+import Vue from 'vue';
+import Vuex from 'vuex';
+import _ from 'lodash';
+Vue.use(Vuex);
+const api = {
+  importInfo: `/api/market/patent/import`,
+};
+const state = () => ({});
+const mutations = {};
+
+const actions = {
+  async query({ commit }, { skip = 0, limit, ...info } = {}) {
+    const res = await this.$axios.$get(`${api.importInfo}`, {
+      skip,
+      limit,
+      ...info,
+    });
+    return res;
+  },
+  async create({ commit }, payload) {
+    const res = await this.$axios.$post(`${api.importInfo}`, payload);
+    return res;
+  },
+  async fetch({ commit }, payload) {
+    const res = await this.$axios.$get(`${api.importInfo}/${payload}`);
+    return res;
+  },
+  async update({ commit }, { id, ...data }) {
+    const res = await this.$axios.$post(`${api.importInfo}/update/${id}`, data);
+    return res;
+  },
+
+  async delete({ commit }, payload) {
+    const res = await this.$axios.$delete(`${api.importInfo}/${payload}`);
+    return res;
+  },
+};
+export default {
+  namespaced: true,
+  state,
+  mutations,
+  actions,
+};

src/views/market/list/patent.vue

@@ -7,12 +7,12 @@
             <span>|</span> <span>{{ column_name }}</span>
           </el-col>
           <el-col :span="12" class="search">
-            <el-input placeholder="请输入名称" v-model="infoName" class="input-with-select">
-              <el-button slot="append" icon="el-icon-search" @click="searchData()"></el-button>
+            <el-input placeholder="请输入名称" v-model="name" class="input-with-select">
+              <el-button slot="append" icon="el-icon-search" @click="search"></el-button>
             </el-input>
           </el-col>
         </el-col>
-        <el-col :span="24" class="list" v-for="(item, index) in list" :key="index">
+        <el-col :span="24" class="list" v-for="(item, index) in patentList" :key="index">
           <el-col :span="15" class="name textOver" @click.native="clickDetail(item.id)">{{ item.name }} </el-col>
           <el-col :span="6" class="type textOver"> 专利有限性：{{ item.term }} </el-col>
           <el-col :span="3" class="date"> {{ item.success_date }} </el-col>
@@ -22,69 +22,48 @@
         </el-col>
       </el-col>
       <el-col :span="24" class="page">
-        <el-pagination
-          @current-change="handleCurrentChange"
-          :current-page="currentPage"
-          layout="total, prev, pager, next, jumper"
-          :total="total"
-          :page-size="pageSize"
-        >
-        </el-pagination>
+        <page :total="total" :limit="limit" @query="search" position="center"></page>
       </el-col>
     </el-row>
   </div>
 </template>
 
 <script>
+import page from '@/components/pagination.vue';
+const { mapActions: patents } = createNamespacedHelpers('patent');
 import { mapState, createNamespacedHelpers } from 'vuex';
 export default {
   name: 'roadshow',
   props: {
-    patentList: { type: Array },
-    total: { type: Number },
     column_name: null,
   },
-  components: {},
+  components: {
+    page,
+  },
   data: function() {
     return {
-      infoName: '',
-      list: [],
-      currentPage: 1, //默认数据1
-      pageSize: 6, //每页显示数据数量
-      origin: [], //分割数据
+      patentList: [],
+      total: 0,
+      limit: 6,
+      name: '',
     };
   },
-  created() {},
+  async created() {
+    await this.search();
+  },
   methods: {
-    searchPage(page = 1) {
-      this.$set(this, `list`, this.origin[page - 1]);
+    ...patents({ patentQuery: 'query', patentFetch: 'fetch' }),
+    async search({ skip = 0, limit = 6, ...info } = {}) {
+      if (this.name) info.name = this.name;
+      let res = await this.patentQuery({ skip, limit, ...info });
+      if (this.$checkRes(res)) this.$set(this, `patentList`, res.data);
+      this.$set(this, `total`, res.total);
     },
-    handleCurrentChange(currentPage) {
-      this.searchPage(currentPage);
-    },
-    // 详情
     clickDetail(id) {
       this.$emit('clickDetail', { column_name: 'e专利', id: id });
     },
-    // 查询
-    searchData() {
-      this.$emit('searchData', { name: this.infoName, columnName: 'e专利' });
-    },
-  },
-  watch: {
-    patentList: {
-      immediate: true,
-      deep: true,
-      handler(val) {
-        if (val && val.length > 0) {
-          this.$set(this, `origin`, _.chunk(val, this.pageSize));
-          this.searchPage();
-        } else {
-          this.$set(this, `list`, []);
-        }
-      },
-    },
   },
+  watch: {},
   computed: {
     ...mapState(['user']),
     pageTitle() {
@@ -120,7 +99,7 @@ export default {
   }
   .list {
     border-bottom: 1px dashed #ccc;
-    padding: 10px 0;
+    padding: 12px 0;
     .name {
       font-size: 18px;
       font-weight: bold;
@@ -154,9 +133,4 @@ export default {
     }
   }
 }
-.page {
-  text-align: center;
-  height: 40px;
-  padding: 5px 0;
-}
 </style>

src/views/market/marketlists.vue

@@ -276,9 +276,7 @@ export default {
         this.$set(this, `achieveList`, res.data);
         this.$set(this, `achieveTotal`, res.total);
       } else if (columnName == 'e专利') {
-        let res = await this.patentQuery({ skip, limit, ...info });
-        if (this.$checkRes(res)) this.$set(this, `patentList`, res.data);
-        this.$set(this, `patentTotal`, res.total);
+        console.log('e专利');
       } else if (columnName == '商务服务') {
         let res = await this.productList({ skip, type: '2', status: '1', ...info });
         if (this.$checkRes(res)) this.$set(this, `businessList`, res.data);

src/views/superAdminCenter/patent/index.vue

@@ -5,12 +5,15 @@
         <span v-if="display == 'list'">
           <el-col :span="24" class="top">
             <el-button type="primary" size="mini" @click="add">添加信息</el-button>
+            <el-button type="primary" size="mini" @click="importBtn">导入数据</el-button>
+            <el-button type="primary" size="mini" @click="importOut">导出数据</el-button>
+            <el-button type="info" size="mini"> <el-link :underline="false" style="color:#fff" href="/数据模板.xlsx">数据模板下载</el-link></el-button>
           </el-col>
           <el-col :span="24" class="list">
             <data-table :fields="fields" :opera="opera" :data="list" :total="total" @edit="toEdit" @delete="toDelete" @query="search"></data-table>
           </el-col>
         </span>
-        <span v-else>
+        <span v-else-if="display == 'detail'">
           <el-col :span="24" class="top">
             <el-button type="primary" size="mini" @click="back">返回</el-button>
           </el-col>
@@ -24,6 +27,32 @@
             </data-form>
           </el-col>
         </span>
+        <span v-else>
+          <el-col :span="24" class="top">
+            <el-button type="primary" size="mini" @click="back">返回</el-button>
+          </el-col>
+          <el-col :span="24" class="import">
+            <uploadFile :limit="1" :data="fileForm.uri" listType="" type="uri" :url="'/files/uri/upload'" @upload="importSuccess"></uploadFile>
+            <el-col :span="24" class="btn">
+              <el-button type="primary" size="mini" @click="importSubmit">确定导入</el-button>
+            </el-col>
+            <el-col :span="24" class="error" v-if="errorList.length > 0">
+              <el-col :span="24" class="title">
+                错误列表
+              </el-col>
+              <el-col :span="24" class="errorList">
+                <p>
+                  <span>序号</span>
+                  <span>错误信息</span>
+                </p>
+                <p v-for="(item, index) in errorList" :key="index">
+                  <span>{{ index + 1 }}</span>
+                  <span>{{ item }}</span>
+                </p>
+              </el-col>
+            </el-col>
+          </el-col>
+        </span>
       </el-col>
     </el-row>
   </div>
@@ -33,8 +62,10 @@
 import dataTable from '@/components/data-table.vue';
 import dataForm from '@/components/form.vue';
 import upload from '@/components/uploadone.vue';
+import uploadFile from '@/components/upload/uploadFile.vue';
 import { mapState, createNamespacedHelpers } from 'vuex';
 const { mapActions: patent } = createNamespacedHelpers('patent');
+const { mapActions: patentImport } = createNamespacedHelpers('patentImport');
 export default {
   metaInfo() {
     return { title: this.$route.meta.title };
@@ -45,6 +76,7 @@ export default {
     dataTable,
     dataForm,
     upload,
+    uploadFile,
   },
   data: function() {
     return {
@@ -106,6 +138,9 @@ export default {
         agent: [{ required: false, message: '代理机构', trigger: 'blur' }],
         abstract: [{ required: false, message: '摘要', trigger: 'blur' }],
       },
+      fileForm: {},
+      // 错误信息
+      errorList: [],
     };
   },
   async created() {
@@ -113,6 +148,7 @@ export default {
   },
   methods: {
     ...patent(['query', 'fetch', 'update', 'create', 'delete']),
+    ...patentImport({ importCreate: 'create' }),
     // 查询列表
     async search({ skip = 0, limit = 10, ...info } = {}) {
       let res = await this.query({ skip, limit, ...info });
@@ -173,6 +209,9 @@ export default {
     },
     // 返回
     back() {
+      this.form = {};
+      this.fileForm = {};
+      this.errorList = [];
       this.display = 'list';
       this.search();
     },
@@ -180,6 +219,34 @@ export default {
     uploadSuccess({ type, data }) {
       this.$set(this.form, `${type}`, data.uri);
     },
+    // 导入数据
+    importBtn() {
+      this.display = 'import';
+    },
+    importSuccess({ type, data }) {
+      if (data.uri) this.$set(this.fileForm, `uri`, data.uri);
+    },
+    async importSubmit() {
+      let data = this.fileForm;
+      let res = await this.importCreate(data);
+      if (res.data) {
+        this.$set(this, 'errorList', res.data);
+        this.$message({
+          message: '信息错误，请重新编辑数据！',
+          type: 'error',
+        });
+      } else {
+        this.$message({
+          message: '修改信息成功',
+          type: 'success',
+        });
+        this.back();
+      }
+    },
+    // 导出书卷
+    importOut() {
+      alert('导出数据');
+    },
   },
   computed: {
     ...mapState(['user']),
@@ -195,5 +262,40 @@ export default {
     text-align: right;
     margin: 0 0 10px 0;
   }
+  .import {
+    .btn {
+      padding: 20px 0;
+      text-align: center;
+    }
+    .error {
+      .title {
+        font-size: 20px;
+        font-weight: bold;
+        padding: 0 0 10px 0;
+        color: #ff0000;
+      }
+      .errorList {
+        p {
+          float: left;
+          width: 100%;
+          border: 1px solid #ccc;
+          height: 30px;
+          line-height: 30px;
+          font-size: 16px;
+          span:nth-child(1) {
+            float: left;
+            width: 9%;
+            text-align: center;
+            border-right: 2px solid #ccc;
+          }
+          span:nth-child(2) {
+            float: left;
+            width: 90%;
+            text-align: center;
+          }
+        }
+      }
+    }
+  }
 }
 </style>