1

src/views/firm.vue

@@ -1,64 +1,84 @@
 <template>
   <!-- 创业公司登记 -->
-    <div class="firm">
-      <div class="pAHeader">
-        <div class="pAHeader1">创业公司登记</div>
-      </div>
-      <hr>
-      
-      <div class="twoSelectInp">
-        <div class="selectTwo">
-            <div class="selectsBlock">
-                <el-input v-model="input" style="width:200px" @change="getData" placeholder="请输入"></el-input>
-                <!-- <el-button type="primary" class="btn2" @click="getData()">查询</el-button> -->
-            </div>
-        </div>
-        <div class="upFile">
-          <beUpload @getFile="getFile" :navName="'上传文件'" :accept="accept"> </beUpload>
+  <div class="firm">
+    <div class="pAHeader">
+      <div class="pAHeader1">创业公司登记</div>
+    </div>
+    <hr />
+
+    <div class="twoSelectInp">
+      <div class="selectTwo">
+        <div class="selectsBlock">
+          <el-input
+            v-model="input"
+            style="width: 200px"
+            @change="getData"
+            placeholder="请输入"
+          ></el-input>
+          <!-- <el-button type="primary" class="btn2" @click="getData()">查询</el-button> -->
         </div>
       </div>
-      
-      <div class="projectBlock">
-        <el-table
+      <div class="upFile">
+        <beUpload @getFile="getFile" :navName="'上传文件'" :accept="accept">
+        </beUpload>
+      </div>
+    </div>
+
+    <div class="projectBlock">
+      <el-table
         :data="tableData"
         tooltip-effect="dark"
         stripe
         class="fontSize"
-        :header-cell-style="{ background: '#f2f2f2',color:'#000' }"
-        >
-       
+        :header-cell-style="{ background: '#f2f2f2', color: '#000' }"
+      >
         <el-table-column
           prop="startFile.fileName"
           label="文件名称"
           align="center"
-          min-width="25%">
+          min-width="25%"
+        >
         </el-table-column>
 
         <el-table-column
           prop="create_at"
           label="上传时间"
           align="center"
-          min-width="25%">
+          min-width="25%"
+        >
         </el-table-column>
-        
+
         <el-table-column
           prop="startFile.size"
           label="文件大小"
           align="center"
-          min-width="20%">
+          min-width="20%"
+        >
         </el-table-column>
-       
+
         <el-table-column
           prop="operation"
           label="操作"
           align="center"
           min-width="30%"
-          >
+        >
           <template #default="scope">
-              <div class="operations">
-                      <el-button type="primary" class="bt1" size="mini" @click='checkFile(scope.row)'>查看信息</el-button>
-                      <el-button type="primary" class="bt1" size="mini" @click="del(scope.row.startupId)" >删除</el-button>
-              </div>
+            <div class="operations">
+              <el-button
+                type="primary"
+                class="bt1"
+                size="mini"
+                @click="checkFile(scope.row.startFile.url)"
+                >查看信息</el-button
+              >
+              <el-button
+                type="primary"
+                class="bt1"
+                size="mini"
+                @click="del(scope.row.startupId)"
+                >删除</el-button
+              >
+            </div>
           </template>
         </el-table-column>
       </el-table>
@@ -68,243 +88,266 @@
           @current-change="changePage"
           layout="prev, pager, next"
           :page-size="Page.lim"
-          :total="Page.total">
+          :total="Page.total"
+        >
         </el-pagination>
       </div>
-      </div>
-      
-<!-- 删除通知开始 -->
+    </div>
+
+    <!-- 删除通知开始 -->
     <el-dialog
       title="删除文件"
       :visible.sync="dialogVisible1"
       width="600px"
-      class="addDialog">
+      class="addDialog"
+    >
       <div class="addDialogLogo">LOGO</div>
       <span class="deleteContent">确定删除文件?</span>
       <span slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="commitDel" class="btn5">确认删除</el-button>
-        <el-button @click="dialogVisible1=false" class="btn5" >取消</el-button>
+        <el-button type="primary" @click="commitDel" class="btn5"
+          >确认删除</el-button
+        >
+        <el-button @click="dialogVisible1 = false" class="btn5">取消</el-button>
       </span>
     </el-dialog>
-<!-- 删除通知结束-->
+    <!-- 删除通知结束-->
 
-<!-- 展示文档开始 -->
-<el-dialog
-    title="展示文件"
-    :visible.sync="showFile"
-    width="80vw"
-    class="addDialog showDialog">
-    <div class="addDialogLogo">LOGO</div>
-    <div class="showFileArea">
+    <!-- 展示文档开始 -->
+    <el-dialog
+      title="展示文件"
+      :visible.sync="showFile"
+      width="80vw"
+      class="addDialog showDialog"
+    >
+      <div class="addDialogLogo">LOGO</div>
+      <div class="showFileArea">
         <!-- <vpdf v-if="/^\s*$/g.test(showFileUrl)&&showFileUrl.split('.')[showFileUrl.split('.').length-1]=='pdf'" :pdfUrl="showFileUrl"></vpdf> -->
-        <vword  :pdfUrl="showFileUrl"></vword>
-    </div>
-</el-dialog>
-<!-- 展示文档结束 -->
-    </div>
-  </template>
+        <vword v-if="showFileType == 0" :pdfUrl="showFileUrl"></vword>
+        <vpdf v-else :pdfUrl="showFileUrl"></vpdf>
+      </div>
+    </el-dialog>
+    <!-- 展示文档结束 -->
+  </div>
+</template>
   
   <script>
-  import beUpload from '@/components/tool/beUpload.vue';
-  import vpdf from "@/components/vpdf.vue"
-  import vword from '@/components/vword.vue'
-      export default {
-        components:{beUpload,vpdf,vword},
-        data() {
-          return {
-            accept:"*",
-            showFile:false,
-            dialogVisible1:false,
-            delId:"",
-            input:'',
-            tableData:[],
-            showFileUrl:"",
-            Page:{
-              nowPage:1,
-              total:0,
-              lim:8,
-            }
+import beUpload from "@/components/tool/beUpload.vue";
+import vpdf from "@/components/vpdf.vue";
+import vword from "@/components/vword.vue";
+export default {
+  components: { beUpload, vpdf, vword },
+  data() {
+    return {
+      accept: "*",
+      showFile: false,
+      showFileType: 0,
+      dialogVisible1: false,
+      delId: "",
+      input: "",
+      tableData: [],
+      showFileUrl: "",
+      Page: {
+        nowPage: 1,
+        total: 0,
+        lim: 8,
+      },
+    };
+  },
+  methods: {
+    //展示文件
+    checkFile(url) {
+      if (
+        url.split(".")[f.split(".").length - 1].toLocaleUpperCase() == "PDF"
+      ) {
+        this.showFileUrl = url;
+        this.showFileType = 1;
+      } else {
+        this.showFileUrl =
+          "https://view.officeapps.live.com/op/view.aspx?src=" + url;
+        this.showFileType = 0;
+      }
+      this.showFile = true;
+    },
+    del(Id) {
+      this.delId = Id;
+      this.dialogVisible1 = true;
+    },
+    commitDel() {
+      this.ajax
+        .post(this.$store.state.api + "/UpdateFirmFileState", {
+          uid: this.$store.state.userInfo.userid,
+          sid: this.delId,
+          st: 1,
+        })
+        .then((res) => {
+          if (res.data == 1) {
+            this.$message.success("删除成功");
+          } else {
+            this.$message.error("删除失败");
           }
-        },
-        methods:{
-          //展示文件
-          checkFile(row){
-            console.log(row)
-            this.showFileUrl = row.startFile.url;
-            this.showFile = true;
-          },
-          del(Id){
-            this.delId = Id;
-            this.dialogVisible1=true;
-          },
-          commitDel(){
-            this.ajax.post(this.$store.state.api+"/UpdateFirmFileState",{
-              uid:this.$store.state.userInfo.userid,
-              sid:this.delId,
-              st:1
-            }).then(res=>{
-              if(res.data==1){
-                this.$message.success("删除成功");
-              }else{
-                this.$message.error("删除失败");
-              }
-              this.getData();
-              this.dialogVisible1 = false;
-              this.delId="";
-            }).catch(err=>{
-              console.log(err);
-            })
-          },
-          changePage(newPage){
-            this.Page.nowPage = newPage;
-            this.getData();
-          },
-          getFile(val){
-            this.ajax.post(this.$store.state.api+"/UploadFirmFile",{
-              uid:this.$store.state.userInfo.userid,
-              file:JSON.stringify(val)
-            }).then(res=>{
-              if(res.data==1){
-                this.$message.success("上传成功")
-              }else{
-                this.$message.error("上传失败")
-              }
-              this.getData();
-            })
-          },
-          getData(){
-            this.tableData = []
-            this.ajax.get(this.$store.state.api+"/GetFirmFile",{
-              uid:this.$store.state.userInfo.userid,
-              tit:this.input,
-              page:this.Page.nowPage,
-              lim:this.Page.lim,
-            }).then(res=>{
-              res.data[0].forEach(item=>{
-                item["startFile"] = JSON.parse(item['startFile']);
-                this.tableData.push(item)
-              })
-              this.Page.total = res.data[1][0]['total']
-            }).catch(err=>{
-              console.log(err)
-            })
-          },
-        },
-        mounted(){
           this.getData();
-        }
-      }
-  </script>
+          this.dialogVisible1 = false;
+          this.delId = "";
+        })
+        .catch((err) => {
+          console.log(err);
+        });
+    },
+    changePage(newPage) {
+      this.Page.nowPage = newPage;
+      this.getData();
+    },
+    getFile(val) {
+      this.ajax
+        .post(this.$store.state.api + "/UploadFirmFile", {
+          uid: this.$store.state.userInfo.userid,
+          file: JSON.stringify(val),
+        })
+        .then((res) => {
+          if (res.data == 1) {
+            this.$message.success("上传成功");
+          } else {
+            this.$message.error("上传失败");
+          }
+          this.getData();
+        });
+    },
+    getData() {
+      this.tableData = [];
+      this.ajax
+        .get(this.$store.state.api + "/GetFirmFile", {
+          uid: this.$store.state.userInfo.userid,
+          tit: this.input,
+          page: this.Page.nowPage,
+          lim: this.Page.lim,
+        })
+        .then((res) => {
+          res.data[0].forEach((item) => {
+            item["startFile"] = JSON.parse(item["startFile"]);
+            this.tableData.push(item);
+          });
+          this.Page.total = res.data[1][0]["total"];
+        })
+        .catch((err) => {
+          console.log(err);
+        });
+    },
+  },
+  mounted() {
+    this.getData();
+  },
+};
+</script>
   
   <style lang="less">
-  .firm{
+.firm {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  .pAHeader {
     width: 100%;
-    height: 100%;
-    position: relative;
-    .pAHeader{
+    display: flex;
+    justify-content: space-between;
+    .pAHeader1 {
+      width: 150px;
+      font-weight: 600;
+      flex-shrink: 0;
+      font-size: 22px;
+    }
+    .pAHeader2 {
+      height: 35px;
+      line-height: 5px;
+      background: #477edd;
+    }
+  }
+
+  .addDialog {
+    font-size: 18px;
+    .el-dialog {
+      border-radius: 5px;
+      overflow: hidden;
+    }
+    .deleteContent {
       width: 100%;
+      margin: 30px 0;
+      font-size: 22px;
+      color: #000;
+    }
+    .addDialogLogo {
+      width: 60px;
+      height: 30px;
+      line-height: 30px;
+      background: #f2f2f2;
+      position: absolute;
+      left: 20px;
+      top: 15px;
+    }
+    .el-dialog__header {
       display: flex;
-      justify-content: space-between;
-      .pAHeader1{
-        width: 150px;
-        font-weight: 600;
-        flex-shrink: 0;
-        font-size: 22px;
+      justify-content: center;
+      background: #32455b;
+    }
+    .el-dialog__title {
+      color: #fff;
+      font-size: 22px;
+    }
+    .addDialogMid {
+      box-sizing: border-box;
+      padding: 0 60px 0 10px;
+      .addDialogTit {
+        display: flex;
+        span {
+          width: 80px;
+          font-size: 16px;
+          line-height: 40px;
+          text-align: left;
+        }
       }
-      .pAHeader2{
-        height: 35px;
-        line-height: 5px;
-        background: #477edd;
+      .addDialogTit1 {
+        display: flex;
+        justify-content: space-between;
+        margin-bottom: 15px;
       }
-    }
-
-.addDialog{
-  font-size: 18px;
-  .el-dialog{
-    border-radius: 5px;
-    overflow: hidden;
-  }
-  .deleteContent{
-    width: 100%;
-    margin: 30px 0;
-    font-size: 22px;
-    color: #000;
-  }
-  .addDialogLogo{
-    width: 60px;
-    height: 30px;
-    line-height: 30px;
-    background: #f2f2f2;
-    position: absolute;
-    left: 20px; top: 15px; 
-  }
-  .el-dialog__header{
-    display: flex;
-    justify-content: center;
-  background: #32455b;
-  }
-  .el-dialog__title{
-    color:#fff;
-    font-size: 22px;
-  }
-  .addDialogMid{
-    box-sizing: border-box;
-    padding:0 60px 0 10px;
-    .addDialogTit{
-      display: flex;
-      span{
-        width: 80px;
+      .addDialogTit2 {
+        margin-top: 10px;
         font-size: 16px;
-        line-height: 40px;
-        text-align: left;
-        
+        color: #000;
+        text-indent: 2em;
+      }
+      .addDialogCon {
+        margin-top: 20px;
       }
     }
-    .addDialogTit1{
+    .dialog-footer {
       display: flex;
-      justify-content: space-between;
-      margin-bottom: 15px;
-    }
-    .addDialogTit2{
-      margin-top: 10px;
-      font-size: 16px;
-      color: #000;
-      text-indent: 2em;
-    }
-    .addDialogCon{
-      margin-top: 20px;
+      justify-content: center;
+      box-sizing: border-box;
+      .btn5 {
+        font-size: 16px;
+      }
     }
   }
-  .dialog-footer{
-    display: flex;
-    justify-content: center;
-    box-sizing: border-box;
-    .btn5{
-      font-size: 16px;
-    }
+
+  .btn {
+    //上传文件
+    width: 100px;
+    height: 35px;
+    font-size: 16px;
+    background: #477edd;
   }
 }
-    
-      
-    .btn{   //上传文件
-      width: 100px;
-      height: 35px;
-      font-size: 16px;
-      background: #477edd;
-    }
-}
-.upFile{
+.upFile {
   height: 40px !important;
 }
-#footerPage{
+#footerPage {
   width: 100%;
   position: absolute;
   bottom: 0;
   display: flex;
   justify-content: flex-end;
 }
-.showFileArea{
+.showFileArea {
   width: 100%;
   height: 65vh;
 }
-  </style>
+</style>