From dcf9c9e0410fe1186239e3f8d6f7bdc789c08010 Mon Sep 17 00:00:00 2001
From: lzhe <lzhe@example.com>
Date: 星期三, 05 六月 2024 18:00:39 +0800
Subject: [PATCH] 1
---
src/layout/components/importTable.vue | 123 +++++++++++++++++++++++++++++++---------
1 files changed, 95 insertions(+), 28 deletions(-)
diff --git a/src/layout/components/importTable.vue b/src/layout/components/importTable.vue
index 2b2ffe0..791d1a5 100644
--- a/src/layout/components/importTable.vue
+++ b/src/layout/components/importTable.vue
@@ -1,55 +1,122 @@
<template>
- <div>
- <el-steps direction="vertical" :active="1">
- <el-step title="鍑嗗鏁版嵁">
- <span class="desc">瀵煎叆鐨勬暟鎹釜鏁伴渶灏忎簬200,鎵�鏈夊厑璁稿鍏ョ殑瀛楁璇峰弬鑰冩ā鏉�;
- <span class="bolder">瀛楁涓嶇鍚堣鍒欙紝鏁存潯鏁版嵁涓嶄簣浠ュ鍏�</span>
- </span>
- <button type="button" class="el-button more-btn el-button--text el-button--mini"><span>鏇村瀛楁瀵煎叆瑙勫垯 <i class="el-icon-arrow-down no-open"></i></span></button>
- <div class="desc">
- <ul class="tip" style="">
- <li>1銆佸憳宸ュ伐鍙凤細蹇呭～锛涘伐鍙蜂笉鍙噸澶嶏紱鏀寔澶у皬鍐欏瓧姣嶃�佹暟瀛楃粍鍚堬紱</li>
- <li>2銆佸憳宸ュ鍚嶏細蹇呭～锛涘鏋滈噸鍚嶏紝寤鸿鍔犳暟瀛楀尯鍒嗭紝濡傗�滃紶涓�1鈥濓紱</li>
- <li>3銆佺姸鎬侊細蹇呭～锛涢�夋嫨鍦ㄨ亴/绂昏亴锛�</li>
- <li>4銆佺數璇濓細蹇呭～锛涘湪鏈紒涓氬唴涓嶅彲閲嶅锛�</li>
- <li>5銆丳IN鐮侊細蹇呭～锛涙敮鎸�4-6浣嶆暟瀛楋紱</li>
- <li>6銆佸矖浣嶏細闈炲繀濉紱鍙互濉叆澶氫釜宀椾綅锛屼互鑻辨枃閫楀彿鈥�,鈥欓棿闅旓紱涓嶅彲閲嶅悕锛�</li>
- <li>7銆侀偖绠憋細闈炲繀濉紱閭鏍煎紡鏍￠獙锛屾瘮濡傗��***@126.com鈥濓紱</li>
- <li>8銆侀儴闂細闈炲繀濉紱璇峰～鍐欓儴闂ㄥ畬鏁村眰绾э紱涓棿闂撮殧锛岃鐢ㄨ嫳鏂囩鍙封��-鈥滈棿闅斻�傚鈥漻x鍏徃-xx閮ㄩ棬-xx鈥�</li>
- <li>9銆佸叆鑱屾棩鏈燂細闈炲繀濉紱鏃ユ湡鏍煎紡鈥淵Y-MM-DD鈥�</li>
- </ul>
- <a class="download el-link el-link--primary is-underline"><i class="el-icon-download"></i><span class="el-link--inner">涓嬭浇妯℃澘</span></a>
- </div>
- </el-step>
- <el-step title="涓婁紶鏁版嵁鏂囦欢"></el-step>
- </el-steps>
- </div>
+ <span>
+ <el-button type="primary" @click="openimport">瀵煎叆</el-button>
+ <el-dialog title="瀵煎叆" v-model="visible" :width="900">
+ <h6><span>1</span>鍑嗗鏁版嵁</h6>
+ <span class="desc">瀵煎叆鐨勬暟鎹釜鏁伴渶灏忎簬200,鎵�鏈夊厑璁稿鍏ョ殑瀛楁璇峰弬鑰冩ā鏉�;
+ <span class="bolder">瀛楁涓嶇鍚堣鍒欙紝鏁存潯鏁版嵁涓嶄簣浠ュ鍏�</span>
+ <span class="more" @click="showDest = !showDest">鏇村瀛楁瀵煎叆瑙勫垯></span>
+ </span>
+ <div class="text-desc" :class="{showDest: showDest}">
+ <ul class="tip">
+ <li>1銆佸憳宸ュ伐鍙凤細蹇呭～锛涘伐鍙蜂笉鍙噸澶嶏紱鏀寔澶у皬鍐欏瓧姣嶃�佹暟瀛楃粍鍚堬紱</li>
+ <li>2銆佸憳宸ュ鍚嶏細蹇呭～锛涘鏋滈噸鍚嶏紝寤鸿鍔犳暟瀛楀尯鍒嗭紝濡傗�滃紶涓�1鈥濓紱</li>
+ <li>3銆佺姸鎬侊細蹇呭～锛涢�夋嫨鍦ㄨ亴/绂昏亴锛�</li>
+ <li>4銆佺數璇濓細蹇呭～锛涘湪鏈紒涓氬唴涓嶅彲閲嶅锛�</li>
+ <li>5銆丳IN鐮侊細蹇呭～锛涙敮鎸�4-6浣嶆暟瀛楋紱</li>
+ <li>6銆佸矖浣嶏細闈炲繀濉紱鍙互濉叆澶氫釜宀椾綅锛屼互鑻辨枃閫楀彿鈥�,鈥欓棿闅旓紱涓嶅彲閲嶅悕锛�</li>
+ <li>7銆侀偖绠憋細闈炲繀濉紱閭鏍煎紡鏍￠獙锛屾瘮濡傗��***@126.com鈥濓紱</li>
+ <li>8銆侀儴闂細闈炲繀濉紱璇峰～鍐欓儴闂ㄥ畬鏁村眰绾э紱涓棿闂撮殧锛岃鐢ㄨ嫳鏂囩鍙封��-鈥滈棿闅斻�傚鈥漻x鍏徃-xx閮ㄩ棬-xx鈥�</li>
+ <li>9銆佸叆鑱屾棩鏈燂細闈炲繀濉紱鏃ユ湡鏍煎紡鈥淵Y-MM-DD鈥�</li>
+ </ul>
+ </div>
+ <div class="exportBtn" @click="exportBtn">涓嬭浇妯℃澘</div>
+ <h6 class="marTop8"><span>2</span>涓婁紶鏁版嵁鏂囦欢</h6>
+ <div class="uploadBtn">
+ <el-upload class="upload" :action="uploadUrl">
+ <el-button type="primary">涓婁紶鏂囦欢</el-button>
+ </el-upload>
+ <div class="uploadBtn-desc">鐩墠鏀寔鐨勬枃浠剁被鍨嬩负.xls,.xlsx</div>
+ </div>
+ <template #footer>
+ <el-button @click="visible=false" >鍙� 娑�</el-button>
+ </template>
+ </el-dialog>
+ </span>
</template>
<script>
export default {
data() {
return {
+ visible: false,
+ showDest: true
}
},
mounted() {
},
+ props: {
+ exportUrl: {type: String, default: true },
+ uploadUrl: {type: String, default: true }
+ },
methods: {
-
+ exportBtn() {
+ this.$HTTP.get(this.exportUrl).then(res=> {
+ if(res.code == 200) {
+ window.open(res.data.link);
+ }
+ })
+ },
+ openimport() {
+ this.visible = true;
+ }
}
}
</script>
<style scoped>
+.showDest {
+ display: none;
+}
.desc {
color: #333;
+ font-size: 14px;
+ padding-left: 25px;
+}
+.tip {
+ list-style: none;
+ margin-left: 40px;
+ margin-top: 8px;
+ font-size: 12px;
}
.desc .bolder {
font-weight: bolder;
}
-.tip {
+h6 {
+ font-size: 14px;
+ margin-bottom:8px;
+}
+h6 span:nth-child(1) {
+ border-radius: 50%;
+ border: 1px solid;
+ text-align: center;
+ background: #fff;
+ width: 20px;
+ height: 20px;
+ font-size: 14px;
+ display: inline-block;
+ margin-right:8px;
+}
+.more {
+ color:#62a5a5;
+ cursor: pointer;
+}
+.marTop8 {
+ margin-top: 8px;
+}
+.uploadBtn {
+ padding-left: 25px;
+ padding-top: 4px;
+}
+.uploadBtn-desc {
+ margin-top:6px;
font-size: 12px;
- padding-left: 16px
+}
+.exportBtn {
+ color: #4f9999;
+ cursor: pointer;
+ margin-left: 40px;
+ margin-top: 8px;
}
</style>
--
Gitblit v1.9.3