11.29 Part Import

1 year ago · de14d933ce
3 changed files with 251 additions and 2 deletions
--- a/src/api/part/external.js
+++ b/src/api/part/external.js
@ -13,3 +13,12 @@ export const selectExternalPartAndCustomerPage = (data) => createAPI(`/part/cust

 export const selectExternalPartAndManufacturerPage = (data) => createAPI(`/part/manufacturer1/${data.no}/${data.size}`, 'post', data)

+export const queryFileId = data => createAPI(`/part/upload/queryFileId`,'post',data)
+
+export const downLoadObjectFile = data => createAPI(`part/upload/downLoadObjectFile?id=`+data.id,'post',777)
+
+export const savePartInfoByExcel = data => createAPI(`/part/savePartInfoByExcel`,'post',data)
+
+export const provisionalDataAlterHandle = data => createAPI(`/part/provisionalDataAlterHandle/${data.type}`,'post',data)
+
+export const getProvisionalDataList = data => createAPI(`/part/getProvisionalDataList`,'post',data)
--- a/src/utils/httpRequest.js
+++ b/src/utils/httpRequest.js
@ -111,16 +111,55 @@ instance.interceptors.response.use(response => {
  return Promise.reject(error)
 })

+// ============================= 下载功能的请求 =============================
+const instance2 = axios.create({
+  baseURL: (process.env.NODE_ENV !== 'production' && process.env.OPEN_PROXY ? '/proxyApi/' : window.SITE_CONFIG.baseUrl),
+  timeout: 10000 * 30,
+  withCredentials: true,
+  responseType: 'blob',
+  headers: {
+    'Content-Type': 'application/json; charset=utf-8'
+  }
+})
+
+/**
+ * 请求拦截
+ */
+instance2.interceptors.request.use(config => {
+  config.headers['token'] = Vue.cookie.get('token') // 请求头带上token
+  return config
+}, error => {
+  return Promise.reject(error)
+})

+/**
+ * 响应拦截
+ */
+instance2.interceptors.response.use(response => {
+  if (response.data && response.data.code === 401) { // 401, token失效
+    clearLoginInfo()
+    router.push({name: 'login'})
+  }
+  return response
+}, error => {
+  return Promise.reject(error)
+})


-export const createAPI = (url, method, data) => {
+export const createAPI = (url, method, data, type) => {
  let config = {}
  if (method === 'get') {
    config.params = data
  } else {
    config.data = data
  }
+  if (data === 777 || type === 'download'){ // 下载功能的请求
+    return instance2({
+      url,
+      method,
+      ...config
+    })
+  }
  return instance({
    url,
    method,
--- a/src/views/modules/part/external.vue
+++ b/src/views/modules/part/external.vue
@ -1,7 +1,9 @@
 <script>
 import {
+  downLoadObjectFile, getProvisionalDataList, provisionalDataAlterHandle,
+  queryFileId,
  removeExternalPart,
-  saveExternalPart,
+  saveExternalPart, savePartInfoByExcel,
  selectExternalPartList, selectExternalPartPage,
  selectUnitList,
  updateExternalPart
@ -62,6 +64,14 @@ export default {
      exportHeader: ['Part Info'],
      exportFooter: [],
      resultList: [],
+      // 导入
+      visible: false,
+      fileList: [],
+      provisionalDataVisible: false,
+      provisionalDataList: [],
+      isLoading: false,
+      isLoading2: false,
+      isLoading3: false,
      no: 1,
      size: 50,
      total: 0,
@ -851,6 +861,7 @@ export default {
      let params = {
        ...this.part,
        site: this.$store.state.user.site,
+        provisionalData: 'N',
      }
      selectExternalPartList(params).then(({data}) => {
        if (data && data.code === 0) {
@ -1152,6 +1163,7 @@ export default {
        site: this.$store.state.user.site,
        no: this.no,
        size: this.size,
+        provisionalData: 'N',
      }
      selectExternalPartPage(params).then(({data}) => {
        if (data && data.code === 0) {
@ -1231,6 +1243,144 @@ export default {
      let s = eval('(' + json + ')')
      return s
    },
+
+    partUpload () {
+      this.visible = true
+    },
+
+    // 关闭modal
+    closeUploadDialog () {
+      this.fileList = []
+      // 清空文件上传记录
+      this.$refs.uploadFile.clearFiles()
+      // 关闭当前的页面
+      this.visible = false
+    },
+
+    // 保修当前的数据
+    saveUploadFile () {
+      // 判断文件是否上传
+      if (null == this.fileList || 0 === this.fileList.length) {
+        this.$message.error("请先上传文件!")
+        return false
+      }
+      this.isLoading = true
+      const formData = new FormData()
+      formData.append("file", this.fileList[0].raw)
+      formData.append("createBy", this.$store.state.user.name)
+      formData.append("site", this.$store.state.user.site.toString())
+      savePartInfoByExcel(formData).then(({data}) => {
+        if (data.code === 0) {
+          // 关闭窗口并刷新页面
+          this.provisionalDataDialogHandle()
+        } else {
+          this.isLoading = false
+          this.$message.warning(data.msg)
+        }
+      })
+    },
+
+    provisionalDataDialogHandle () {
+      getProvisionalDataList().then(({data}) => {
+        if (data.code === 0) {
+          this.provisionalDataList = data.rows
+          this.isLoading = false
+          this.provisionalDataVisible = true
+        } else {
+          this.isLoading = false
+          this.$message.warning(data.msg)
+        }
+      })
+    },
+
+    // 上传之前
+    beforeUploadHandle (file) {
+      let extName = file[0].name.substring(file[0].name.lastIndexOf('.')).toLowerCase()
+      if (!(extName === '.xlsx' || extName === '.xls')) {
+        this.$message.error('数据导入失败，请选择正确的xlsx模板文件')
+        return false
+      }
+    },
+
+    // 选择上传文件时
+    onChange (file) {
+      this.fileList.push(file)
+    },
+
+    // 下载
+    async downloadFile () {
+      let file = {
+        id: 0,
+        fileName: ''
+      }
+      let tempData = {
+        orderRef1: 'partInfo',
+        orderRef2: 'partInfoFormat'
+      }
+      await queryFileId(tempData).then(({data}) => {
+        if (data && data.code === 0) {
+          file.id = data.data.id
+          file.fileName = data.data.fileName
+        } else {
+          this.$alert(data.msg, '错误', {
+            confirmButtonText: '确定'
+          })
+        }
+      })
+      await downLoadObjectFile(file).then(({data}) => {
+        // 不限制文件下载类型
+        const blob = new Blob([data], {type: "application/octet-stream"})
+        // 下载文件名称
+        const fileName = file.fileName
+        // a标签下载
+        const linkNode = document.createElement('a')
+        // a标签的download属性规定下载文件的名称
+        linkNode.download = fileName
+        linkNode.style.display = 'none'
+        // 生成一个Blob URL
+        linkNode.href = URL.createObjectURL(blob)
+        document.body.appendChild(linkNode)
+        // 模拟在按钮上的一次鼠标单击
+        linkNode.click()
+        // 释放URL 对象
+        URL.revokeObjectURL(linkNode.href)
+        document.body.removeChild(linkNode)
+      })
+    },
+
+    provisionalDataAlterHandle (type) {
+      if (type === 1){
+        this.isLoading2 = true
+      } else if (type === 2){
+        this.isLoading3 = true
+      }
+      let inData={
+        provisionalDataList: this.provisionalDataList,
+        type: type
+      }
+      provisionalDataAlterHandle(inData).then(({data}) => {
+        if (data.code === 0) {
+          if (type === 1) {
+            this.$message.success(data.msg)
+            this.provisionalDataVisible = false
+            this.visible = false
+            this.handleSelectExternalPartPage()
+            this.isLoading2 = false
+          } else if (type === 2) {
+            this.$message.warning('Import cancelled!')
+            this.provisionalDataVisible = false
+            this.isLoading3 = false
+          }
+        } else {
+          this.$message.warning(data.msg)
+          if (type === 1) {
+            this.isLoading2 = false
+          } else if (type === 2) {
+            this.isLoading3 = false
+          }
+        }
+      })
+    },
  },
  computed: {},
  activated () {
@ -1241,6 +1391,7 @@ export default {
    }
  },
  created () {
+    this.provisionalDataAlterHandle(3)
    this.selectUnitList()
    this.getCategoryList()
    // this.getCountryList();
@ -1282,6 +1433,7 @@ export default {
        <el-button type="primary" @click="handleSave" v-if="!ofComponents">New</el-button>
        <!--     <el-button type="primary" @click="selectExternalPartList">Query</el-button>-->
        <el-button type="primary" @click="handleSelectExternalPartPage">Query</el-button>
+        <el-button type="primary" icon="el-icon-upload" v-if="this.$store.state.user.userType !== 'Common Users'" @click="partUpload()">Import Part Info</el-button>
        <download-excel
          :fields="fields()"
          :data="exportData"
@ -1491,6 +1643,55 @@ export default {
      </div>
    </el-dialog>

+    <el-dialog title="File Import" @close="closeUploadDialog" :close-on-click-modal="false" :visible.sync="visible" width="390px" style="height: 520px;" class="customer-dialog">
+      <el-form :inline="true" label-position="top" label-width="80px">
+        <el-form-item label="Site">
+          <el-input v-model="this.$store.state.user.site" disabled></el-input>
+        </el-form-item>
+        <el-form-item label=" ">
+          <el-button type="primary" @click="downloadFile()">Download file template</el-button>
+        </el-form-item>
+        <el-row>
+          <el-col :span="24">
+            <el-upload class="customer-upload" drag action="javascript:void(0);" ref="uploadFile" :limit="1" accept=".xlsx,.xls"
+                       :before-upload="beforeUploadHandle" :on-change="onChange" :auto-upload="false" style="text-align: left;">
+              <i class="el-icon-upload"></i>
+              <div class="el-upload__text">Drag the file here，or<em> click to upload</em></div>
+            </el-upload>
+          </el-col>
+        </el-row>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="saveUploadFile">{{ isLoading ? 'Saving...' : 'Save' }} </el-button>
+        <el-button type="primary" @click="closeUploadDialog">Cancel</el-button>
+      </span>
+    </el-dialog>
+
+    <el-dialog title="Import Info View" @close="provisionalDataAlterHandle(3)" :close-on-click-modal="false" :visible.sync="provisionalDataVisible" width="1100px">
+      <el-table :data="provisionalDataList" :height="height + 200" border style="width: 100%;margin-top: 5px">
+        <el-table-column
+          v-for="(item,index) in columnList" :key="index"
+          :sortable="item.columnSortable"
+          :prop="item.columnProp"
+          :header-align="item.headerAlign"
+          :show-overflow-tooltip="item.showOverflowTooltip"
+          :align="item.align"
+          :fixed="item.fixed==''?false:item.fixed"
+          :min-width="item.columnWidth"
+          :label="item.columnLabel">
+          <template slot-scope="scope">
+            <span v-if="!item.columnHidden"> {{ scope.row[item.columnProp] }}</span>
+            <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]"
+                                               style="width: 100px; height: 80px"/></span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="provisionalDataAlterHandle(1)">{{ isLoading2 ? 'Saving...' : 'Confirm Import'}}</el-button>
+        <el-button type="primary" @click="provisionalDataAlterHandle(2)">{{ isLoading3 ? 'Canceling...' : 'Cancel'}}</el-button>
+      </span>
+    </el-dialog>
+
    <div v-show="false">
      <img :src="item" v-for="(item,index) in base64List" :key="index" style="display: none">
    </div>