up

src/components/base-button.vue

@@ -1,6 +1,6 @@
 <template>
   <div :class="type === '1' ? 'btn' : 'btn1'" :style='`width:${width}px`' class="flex flex-center mr-5 font-12 pointer">
-    <el-icon color="white" size="16px">
+    <el-icon :color="type === '1' ? 'white' : '#E9A856'" size="16px">
       <component :is="icon"></component>
     </el-icon>
     <div class="ml-5 nowrap"> {{ title }}</div>
@@ -41,7 +41,7 @@ export default {
 .btn {
   border-radius: 6px;
   padding: 8px 16px;
-  height: 20px;
+  height: 18px;
   font-size: 14px;
   background-color: #AB7630;
   color: white;
@@ -50,7 +50,7 @@ export default {
 .btn1 {
   border-radius: 6px;
   padding: 8px 16px;
-  height: 20px;
+  height: 18px;
   font-size: 14px;
   background-color: white;
   color: #AB7630;

src/components/uploads.vue

@@ -16,6 +16,7 @@
                :on-progress="progress"
                :on-remove="remove"
                :on-success="success"
+               :before-upload="beforeUp"
                :show-file-list="showList"
                style='width: 100%;'>
       <div v-if="drag">
@@ -23,7 +24,7 @@
         <div class="el-upload__text">将文件/图片拖到此处，或<em>点击上传</em></div>
       </div>
       <div v-else class='flex flex-justify-start'>
-        <el-button v-if="showBtn" :loading="loading" icon="el-icon-upload2" plain size="mini"
+        <el-button v-if="showBtn" :loading="loading" icon="el-icon-upload" plain size="mini"
                    type="primary">{{ btnText }}
         </el-button>
       </div>
@@ -33,7 +34,6 @@
 </template>
 
 <script>
-import {ref} from "vue";
 import {Base64} from 'js-base64'
 import {getToken} from '../utils/auth.js'
 import website from '@/config/website'
@@ -168,6 +168,9 @@ export default {
     },
     onError() {
       this.$message.error('服务器异常，请联系管理员！')
+    },
+    beforeUp(tmpFileList) {
+      console.log(tmpFileList)
     }
   }
 }

src/views/home/component/dash.vue

@@ -125,24 +125,7 @@
         <img src="../../../assets/img/import.png" style="width: 196px;height: 154px"/>
         <div class="flex flex-center full-width flex-justify-start">
           <span class="bold mr-20">文件上传</span>
-          <el-upload
-              v-model:file-list="fileList"
-              class="upload-demo"
-              action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
-              multiple
-              :on-preview="handlePreview"
-              :on-remove="handleRemove"
-              :before-remove="beforeRemove"
-              :limit="3"
-              :on-exceed="handleExceed"
-          >
-            <el-button type="primary">Click to upload</el-button>
-            <template #tip>
-              <div class="el-upload__tip">
-                jpg/png files with a size less than 500KB.
-              </div>
-            </template>
-          </el-upload>
+          <uploads ref='upload' max="9" btn-text="点击进行文件上传" @success="upload" accept=".xls,.xlsx"/>
         </div>
         <div class="flex flex-justify-start full-width">
           <span class="font-12 mt-10"
@@ -151,12 +134,12 @@
       </div>
       <el-divider/>
       <div class="hide-scrollbar full-width" style="height: 20vh;overflow-x: scroll">
-        <!--        <div v-if='attaches.length === 0' class='full-width flex flex-center '>-->
-        <!--          <el-empty image-size='100'/>-->
-        <!--        </div>-->
-        <div class="flex flex-justify-between flex-center">
-          <span class="blue font-12">文件名</span>
-          <el-icon color="#DCAE64" size="16px">
+        <div v-if='attaches.length === 0' class='full-width flex flex-center '>
+          <el-empty image-size='100'/>
+        </div>
+        <div class="flex flex-justify-between flex-center mt-5" v-for="(item,index) in attaches" :key="item">
+          <span class="blue">{{ item.response.data.originalFileName }}</span>
+          <el-icon color="#DCAE64" size="16px" @click="removeFile(index)">
             <CircleCloseFilled/>
           </el-icon>
         </div>
@@ -169,10 +152,11 @@
 import BaseButton from '../../../components/base-button.vue'
 import permissionStore from '@/store/permission.js'
 import {vaildData} from '@/utils/tools.js'
+import uploads from "@/components/uploads.vue";
 
 export default {
   name: 'dash',
-  components: {BaseButton},
+  components: {BaseButton, uploads},
   setup() {
     const permissions = permissionStore()
     return {permissions}
@@ -439,6 +423,10 @@ export default {
     },
     upload(res) {
       console.log(res)
+      this.attaches = res.fileList
+    },
+    removeFile() {
+
     }
   }
 }

src/views/home/component/owner_serach.vue

@@ -1,36 +1,101 @@
 <template>
-  <div class="flex flex-col flex-justify-between padding white-bg">
-    <el-form v-model="form" class="lab mt-20" label-width="120px">
-      <div class="flex flex-center">
-        <el-form-item class="full-width" label="项目名称">
-          <el-input
-              v-model="form.projectName"
-              clearable
-              placeholder="输入项目关键字"
-              prefix-icon="Search"
-          />
-        </el-form-item>
-        <el-form-item class="full-width" label="分类筛选">
-          <el-select
-              v-model="form.projectType"
-              clearable
-              placeholder="选择项目分类"
-              style="width: 100%">
-            <el-option
-                v-for="item in typeList"
-                :key="item.id"
-                :label="item.name"
-                :value="item.id"
+  <div class="flex flex-center padding white-bg ">
+    <el-form v-model="form" class="lab mt-20 full-width" label-width="120px">
+      <div class="flex">
+        <div class="flex flex-col mr-15">
+          <el-form-item class="full-width" label="项目名称">
+            <el-input
+                v-model="form.projectName"
+                clearable
+                placeholder="输入项目关键字"
+                prefix-icon="Search"
             />
-          </el-select>
-        </el-form-item>
-        <div class="flex flex-center flex-justify-end"
-             style="margin-bottom: 18px;width: 82%;margin-left: 120px">
+          </el-form-item>
           <div class="flex flex-center">
-            <base-button class="pointer mr-20" icon="Delete" title="清空" type="0" @click="clear"/>
-            <base-button class="pointer" @click="sure"/>
+            <el-form-item class="full-width" label="是否开工">
+              <el-select
+                  v-model="form.projectType"
+                  clearable
+                  placeholder="选择项目分类"
+                  style="width: 100%">
+                <el-option
+                    v-for="item in typeList"
+                    :key="item.id"
+                    :label="item.name"
+                    :value="item.id"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item class="full-width" label="是否入库">
+              <el-select
+                  v-model="form.projectType"
+                  clearable
+                  placeholder="选择项目分类"
+                  style="width: 100%">
+                <el-option
+                    v-for="item in typeList"
+                    :key="item.id"
+                    :label="item.name"
+                    :value="item.id"
+                />
+              </el-select>
+            </el-form-item>
           </div>
         </div>
+        <div class="flex flex-col ml-20 mr-15">
+          <el-form-item class="full-width" label="分类筛选">
+            <el-select
+                v-model="form.projectType"
+                clearable
+                placeholder="选择项目分类"
+                style="width: 100%">
+              <el-option
+                  v-for="item in typeList"
+                  :key="item.id"
+                  :label="item.name"
+                  :value="item.id"
+              />
+            </el-select>
+          </el-form-item>
+          <div class="flex flex-center">
+            <el-form-item class="full-width" label="总投资额">
+              <el-select
+                  v-model="form.projectType"
+                  clearable
+                  placeholder="选择项目分类"
+                  style="width: 100%">
+                <el-option
+                    v-for="item in typeList"
+                    :key="item.id"
+                    :label="item.name"
+                    :value="item.id"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item class="full-width" label="股（科）室">
+              <el-select
+                  v-model="form.projectType"
+                  clearable
+                  placeholder="选择项目分类"
+                  style="width: 100%">
+                <el-option
+                    v-for="item in typeList"
+                    :key="item.id"
+                    :label="item.name"
+                    :value="item.id"
+                />
+              </el-select>
+            </el-form-item>
+          </div>
+          <div class="flex flex-center flex-justify-end"
+               style="width: 70%;margin-left: 120px">
+          </div>
+        </div>
+        <div class="flex flex-center ml-20" style="margin-top: 28px">
+          <base-button class="pointer mr-20" icon="Delete" title="清空" type="0" width="130" @click="clear"/>
+          <base-button class="pointer" width="130" @click="sure"/>
+        </div>
+
       </div>
     </el-form>
   </div>
@@ -41,8 +106,8 @@ import baseButton from '../../../components/base-button.vue'
 
 export default {
   name: 'owner_serach',
-  components: { baseButton },
-  data () {
+  components: {baseButton},
+  data() {
     return {
       form: {
         projectName: '', // 项目名称
@@ -51,19 +116,19 @@ export default {
       typeList: []
     }
   },
-  created () {
+  created() {
     this.getTypeList()
   },
   methods: {
-    getTypeList () {
+    getTypeList() {
       this.$api.project.typeList().then(res => {
         this.typeList = res.data.records
       })
     },
-    sure () {
+    sure() {
       this.$bus.emit('serach', this.form)
     },
-    clear () {
+    clear() {
       this.form.projectType = ''
       this.form.name = ''
       this.$bus.emit('serach', this.form)

src/views/home/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="flex flex-col full-height">
+  <div class="flex flex-col full-height full-width">
     <top-serach v-if="type === 0"/>
     <owner-serach v-else-if="type === 1"/>
     <div class="full-width full-height mt-10">
@@ -19,28 +19,28 @@ name: '项目库',
 import topSerach from './component/top_serach.vue'
 import ownerSerach from './component/owner_serach.vue'
 import dash from './component/dash.vue'
-import { useStore } from '@/store/user.js'
+import {useStore} from '@/store/user.js'
 
 import tokenStore from '../../store/token.js'
 
 export default {
-  components: { topSerach, dash, ownerSerach },
-  setup () {
+  components: {topSerach, dash, ownerSerach},
+  setup() {
     const store = useStore()
     const token = tokenStore()
-    return { store, token }
+    return {store, token}
   },
-  data () {
+  data() {
     return {
       type: 1
     }
   },
-  created () {
+  created() {
 
   },
   methods: {
-    push () {
-      this.$router.push({ path: '/setting', query: { id: 12, type: 'test' } })
+    push() {
+      this.$router.push({path: '/setting', query: {id: 12, type: 'test'}})
     }
   }
 }