update

src/components/assetsman/BulkImport.vue

+<template>
+  <div class="assetsList">
+    <div class="routerTitle"
+      style="text-align:right;border-bottom:1px solid #E2E4EB;padding-bottom:10px"
+    >
+      <span class="pageTitle">批量导入</span>
+      <span style="float:left" @click="backTo('assetsList')" class="backTo">返回</span>
+      <span style="margin-left:20px" class="chaxunSpan"
+        ><a style="padding:4px 9px;" target="_blank" :href="downList">导入模板下载</a></span
+      >
+      <span @click="outerVisible=true" style="margin-left:20px" class="addSpan">
+        导入</span>
+        <span @click="ImportSee" style="margin-left:20px" class="addSpan">提交</span>
+    </div>
+    <div class="padContent">
+      <vxe-table
+          ref="xTable"
+          resizable
+          show-overflow
+          :data="tableData"
+          :edit-config="{trigger: 'manual', mode: 'row'}">
+          <vxe-table-column field="Id" title="ID"></vxe-table-column>
+          <vxe-table-column field="Name" title="资产名称" :edit-render="{name: 'input', attrs: {type: 'text'}}"></vxe-table-column>
+          <vxe-table-column field="CategoryName" title="分类名称" :edit-render="{name: 'input', attrs: {type: 'text'}}"></vxe-table-column>
+          <vxe-table-column field="BrandName" title="品牌" :edit-render="{name: 'input', attrs: {type: 'text'}}"></vxe-table-column>
+          <vxe-table-column field="Units" title="单位" :edit-render="{name: 'input', attrs: {type: 'text'}}"></vxe-table-column>
+          <vxe-table-column field="SerialNumber" title="序列号" :edit-render="{name: 'input', attrs: {type: 'text'}}"></vxe-table-column>
+          <vxe-table-column field="EmName" title="领用人" :edit-render="{name: 'input', attrs: {type: 'text'}}"></vxe-table-column>
+          <vxe-table-column field="StartTime" title="领用时间" :edit-render="{name: 'input', attrs: {type: 'text'}}"></vxe-table-column>
+          <vxe-table-column field="EndTime" title="购置日期" :edit-render="{name: 'input', attrs: {type: 'text'}}"></vxe-table-column>
+          <vxe-table-column field="Money" title="金额" :edit-render="{name: 'input', attrs: {type: 'number'}}"></vxe-table-column>
+          <vxe-table-column field="UseMonths" title="使用月份期限" :edit-render="{name: 'input', attrs: {type: 'number'}}"></vxe-table-column>
+          <vxe-table-column field="BranchName" title="所属公司" :edit-render="{name: 'input', attrs: {type: 'text'}}"></vxe-table-column>
+          <vxe-table-column field="SupplierName" title="供应商" :edit-render="{name: 'input', attrs: {type: 'text'}}"></vxe-table-column>
+
+          <vxe-table-column title="操作">
+            <template v-slot="{ row ,rowIndex}">
+              <template v-if="$refs.xTable.isActiveByRow(row)">
+                <el-tooltip
+                  class="item"
+                  effect="dark"
+                  content="保存"
+                  placement="top"
+                >
+                  <img
+                    @click="saveRowEvent(row)"
+                    style="width:24px;height:24px"
+                    src="../../assets/img/huifu.png"
+                    alt=""
+                  />
+                </el-tooltip>
+                <!-- <vxe-button @click="saveRowEvent(row)">保存</vxe-button> -->
+              </template>
+              <template v-else>
+                <el-tooltip
+                  class="item"
+                  effect="dark"
+                  content="编辑"
+                  placement="top"
+                >
+                  <img
+                    @click="editRowEvent(row)"
+                    style="width:24px;height:24px"
+                    src="../../assets/img/edit.png"
+                    alt=""
+                  />
+                </el-tooltip>
+                <!-- $refs.xTable.remove(tableData[rowIndex]) -->
+                <el-tooltip
+                  class="item"
+                  effect="dark"
+                  content="删除"
+                  placement="top"
+                >
+                  <img
+                    @click="Delete(rowIndex)"
+                    style="width:24px;height:24px"
+                    src="../../assets/img/delete.png"
+                    alt=""
+                  />
+                </el-tooltip>
+                <!-- <vxe-button >编辑</vxe-button> -->
+              </template>
+            </template>
+          </vxe-table-column>
+        </vxe-table>
+    </div>
+    <el-dialog top="0" width="600px" title="导入" :visible.sync="outerVisible" center>
+        <el-upload :show-file-list="false" style="text-align: center;margin:20px 0" drag class="upload-demo" :action="importFileUrl2" :on-success="handleAvatarSuccess"
+            :before-upload="beforeAvatarUpload">
+            <i class="el-icon-upload"></i>
+            <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
+            <!-- <div slot="tip" class="el-upload__tip">只能上传Excel文件</div> -->
+        </el-upload>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+export default {
+  name: "assetsList",
+  components: {
+    Treeselect
+  },
+  data() {
+    return {
+      outerVisible:false,
+      downList:"",
+      queryLoad:false,
+      morequery: false,
+      dateList: [],
+      currentPage: 1,
+      tableData: [],
+      loading: false,
+      total: 0,
+      baseformItem:false,
+      importFileUrl2:"",
+      msg:{},
+    };
+  },
+  created(){
+    let userInfo = this.getLocalStorage();
+            this.importFileUrl2=this.domainManager().DomainUrl +
+          "/api/file/LocalFileUploadImport";
+    this.downList =this.domainManager().LocalTemplateFileDownLoadUrl +"/ExportFile/资产导入模板.xls";
+  },
+  mounted() {
+
+  },
+  methods: {
+    ImportSee(){
+      this.apiJavaPost(
+            "/api/property/SetPropertyInfoBatchImport",
+            this.tableData,
+            res => {
+              if (res.data.resultCode === 1) {
+                this.tableData=[];
+                this.Success(res.data.message);
+              } else {
+                this.Error(res.data.message);
+              }
+            },
+            null
+          );
+    },
+    editRowEvent (row) {
+      this.$refs.xTable.setActiveRow(row)
+    },
+    saveRowEvent (row) {
+      this.$refs.xTable.clearActived().then(() => {
+        console.log("this.tableData",this.tableData)
+      })
+    },
+    Delete(rowIndex){
+      this.tableData.splice(rowIndex, 1)
+    },
+    beforeAvatarUpload(file) {             
+        return;
+        const isJPG = file.type === "application/x-msdownload";
+        if (!isJPG) {
+        this.Error("上传文件只能是 excel 格式!");
+        }
+        return isJPG && isLt2M;
+    },
+    //上传
+    handleAvatarSuccess(res, file) {
+        if (res.resultCode == 1) {
+          this.tableData=res.data;
+          this.outerVisible = false;
+        }else{
+            this.Error(res.message);
+
+        }
+    },
+    backTo(path){
+        this.$router.push({
+            path: "/" + path,
+            query: { 
+            }
+        });
+    },
+    DeleteImg(item, index) {
+      this.addMsg.ImageList.splice(index, 1);
+    },
+    uploadFileBtn(file) {
+      //上传
+      if (file.file.size > 1024 * 1024 * 10) {
+        this.$message.warning("文件大小不能超过10M！");
+        return;
+      }
+      //  1 文档  2 数据 3 图片
+      let typeArr = [{ stringArr: "GIF|JPG|JPEG|PNG|BMP", type: 3 }];
+      let ft = file.file.name
+        .substring(file.file.name.lastIndexOf(".") + 1, file.file.name.length)
+        .toUpperCase();
+      let fileTypeNumber = 2;
+      let typeOk = false;
+      typeArr.forEach(x => {
+        if (x.stringArr.indexOf(ft) != "-1") {
+          fileTypeNumber = x.type;
+          typeOk = true;
+        }
+      });
+      if (!typeOk) return this.$message.error("请上传图片！");
+      let newArr = [];
+      newArr.push(file.file);
+      let path = "/Upload/Temporary";
+      this.$message.info("上传中...");
+      this.UploadSelfFileT(path, newArr, x => {
+        let fileSize =
+          file.file.size < 1024
+            ? file.file.size
+            : (file.file.size / 1024).toFixed(0);
+        this.addMsg.ImageList.push(
+          this.domainManager().ViittoFileUrl + x.data.FilePath
+        );
+        this.Success("上传成功");
+      });
+    },
+ 
+
+  }
+};
+</script>
+
+<style>
+.assetsList a{
+    color:#fff;
+    text-decoration: none;
+}
+.assetsList .MyEditForm .baseform .el-form-item:nth-child(4n) {
+  margin-right: 0;
+}
+.assetsList .zczt1 {
+  background: #ffe4d5;
+  color: #ffa87c;
+}
+.assetsList .zczt2 {
+  background: #beeff0;
+  color: #089bab;
+}
+.assetsList .zczt3 {
+  background: #ffd6d5;
+  color: #ff7874;
+}
+.assetsList .zczt4 {
+  background: #d7d6ff;
+  color: #7b78ff;
+}
+.assetsList .Commonzczt {
+  display: inline-block;
+  width: 24px;
+  height: 24px;
+  line-height: 24px;
+  text-align: center;
+  border-radius: 50%;
+  font-size: 12px;
+  font-family: "宋体";
+}
+.assetsList {
+  width: 100%;
+  height: 100%;
+}
+</style>