feat: 增加文件上链功能

4cfeb321 · salitedfish · 0e2956fb · 4cfeb321 · 4cfeb321 · 4cfeb321
Commit 4cfeb321 authored Mar 16, 2022 by salitedfish
8 changed files
--- a/public/sy/index.html
+++ b/public/sy/index.html
@@ -7,9 +7,12 @@
  <meta name="viewport" content="width=device-width,initial-scale=1.0">
  <link rel="icon" href="./sy/favicon.ico">
  <title>商品溯源</title>
+  <link rel="stylesheet" href="//at.alicdn.com/t/font_3238461_g1lzc0q51h5.css">
  <link rel="stylesheet" href="//at.alicdn.com/t/font_1321935_49vw1tllkgn.css">
  <script src="https://cdn.bootcss.com/tinymce/4.7.4/tinymce.min.js"></script>
  <script src="//at.alicdn.com/t/font_2543933_cg1fy18na6.js"></script>
+  <script src="//at.alicdn.com/t/font_2990811_5ef22ofxikf.js"></script>
 </head>
 <body>

--- a/src/assets/images/newProductList/txt_icon.png
+++ b/src/assets/images/newProductList/txt_icon.png
--- a/src/components/newProductList/IssuePass.vue
+++ b/src/components/newProductList/IssuePass.vue
@@ -17,7 +17,7 @@
          </el-select>
        </el-form-item>
        <el-form-item label="通证数量" prop="amount">
-          <el-input onkeyup="value=value.replace(/[^\d]/g,0)" :disabled="amountDisable" v-model.number="formData.amount" placeholder="请输入通证数量"></el-input>
+          <el-input type="number"  :disabled="amountDisable" v-model.number="formData.amount" placeholder="请输入通证数量"></el-input>
        </el-form-item> 
        <el-form-item label="源文件上链" prop="fileUpload">
          <el-button type="primary" @click="goUpload" v-if="!file.name">点击上传</el-button>
@@ -29,7 +29,8 @@
                <img v-else-if='["png", "jpg", "jpeg", "gif" ].includes(fileType)' class="layout_icon" src="@/assets/images/newProductList/img_icon.png" alt="">
                <img v-else-if='["xls", "xlsx" ].includes(fileType)' class="layout_icon" src="@/assets/images/newProductList/excel_icon.png" alt="">
                <img v-else-if='["pdf"].includes(fileType)' class="layout_icon" src="@/assets/images/newProductList/pdf_icon.png" alt="">  
-                <img v-else-if='["ppt", "pptx" ].includes(fileType)' class="layout_icon" src="@/assets/images/newProductList/ppt_icon.png" alt="">  
+                <img v-else-if='["ppt", "pptx" ].includes(fileType)' class="layout_icon" src="@/assets/images/newProductList/ppt_icon.png" alt=""> 
+                <img v-else-if='["txt"].includes(fileType)' class="layout_icon" src="@/assets/images/newProductList/txt_icon.png" alt=""> 
                <img v-else class="layout_icon" src="@/assets/images/newProductList/pass.png" alt="">  
            </div>
            <div class="file_name">{{file.name}}</div>
@@ -60,19 +61,26 @@
        提示：源文件上链需要支付额外的上链次数，上链次数根据源文件的大小实时计算，费用从套餐中扣除，一旦上链后无法更改，请谨慎操作。
      </div>
    </div>
+    <div>
+    </div>
  </div>
 </template>
 <script>
 import UploadFileVue from "../uploadFile.vue";
 import {debounce} from "@/utils/tool/debounce";
+import CommonDialog from "@/components/CommonDialog.vue";
 import {GO_URLS} from "@/config/URLS";
 export default {
  name: "IssuePass",
  props: ['content'],
  components: {
-    UploadFileVue
+    UploadFileVue,
+    CommonDialog
  },
  data() {
    return {
@@ -291,6 +299,9 @@ export default {
          width: 420px;
          height: 35px;
          line-height: 35px;
+          input::-webkit-outer-spin-button,
+　　      input::-webkit-inner-spin-button { -webkit-appearance: none; }
+　　      input[type="number"]{ -moz-appearance: textfield; }
          .el-input__inner {
            height: 35px;
@@ -377,10 +388,9 @@ export default {
    .fee {
      color: #F6AD00;
      font-size: 16px;
+      font-weight: bold;
    }
  }
 }
 </style>
--- a/src/components/newProductList/Search.vue
+++ b/src/components/newProductList/Search.vue
 <template>
  <div class="search-wrapper">
-    <div class="add-goods" @click="goPassMaker">
+    <div class="add-goods" @click="goPassMaker" v-if="$route.path == '/passList'">
      <i class="iconfont iconjiahao"></i>铸造通证
    </div>
    <div class="choose-type">
@@ -28,11 +28,11 @@
    <div class="sort">
      <div class="chosen-sort" @click="show('showChangeSort')">
        <!-- <svg-icon class="iconshaixuan" icon-class="iconshaixuan" className="iconshaixuan"/> -->
-        <Icon name="iconshaixuan" color="#1c2323" size="12px"></Icon>
+        <Icon name="iconshaixuan" color="#1c2323" size="12px" class="icon-sort"></Icon>
        {{sorts[query.amount_sort]}}
        <!-- <svg-icon class="arrow-down" icon-class="down"/> -->
-        <Icon name="iconzhankai" color="#1c2323" size="12px"></Icon>
+        <Icon name="iconzhankai" color="#1c2323" size="12px" class="arrow-down"></Icon>
        <!-- <i class="iconfont iconxiangxia select-icon"></i> -->
      </div>
      <ul v-if="showChangeSort" class="sort-ul" @mousedown.stop>
@@ -230,20 +230,20 @@ export default {
    .chosen-sort {
      display: flex;
      align-items: center;
-      justify-content: space-around;
+      justify-content: space-between;
-      width: 100px;
+      align-items: center;
+      min-width: 100px;
      cursor: pointer;
      .icon-sort {
        width: 12px;
-        height: 12px;
+        height: 16px;
-        margin-right: 10px;
+        margin-right: 8px;
      }
      .arrow-down {
        width: 9px;
-        height: 4px;
+        height: 16px;
-        margin-left: 8px;
+        margin-left: 5px;
      }
    }

--- a/src/components/newProductList/TransferPass.vue
+++ b/src/components/newProductList/TransferPass.vue
@@ -13,7 +13,7 @@
        </el-form-item>
        <el-form-item class="amount-item" label="转账数量" prop="amount" v-if="content.type === 0">
          <div class="amount-item">
-            <el-input onkeyup="value=value.replace(/[^\d]/g,0)" :disabled="amountDisable" v-model.number="formData.amount" placeholder="填写转账数量"></el-input>
+            <el-input type="number" :disabled="amountDisable" v-model.number="formData.amount" placeholder="填写转账数量"></el-input>
            <span class="balance">可转 {{content.balance}} FT</span>
            <el-button class="all-btn" type="text" @click="allIn">全部</el-button>
          </div>
@@ -104,6 +104,7 @@ input::-webkit-inner-spin-button {
 input[type="number"] {
  -moz-appearance: textfield;
 }
 .transfer-pass {
  width: 592px;
  background: #FFFFFF;
@@ -172,6 +173,9 @@ input[type="number"] {
          width: 420px;
          height: 35px;
          line-height: 35px;
+          input::-webkit-outer-spin-button,
+　　      input::-webkit-inner-spin-button { -webkit-appearance: none; }
+　　      input[type="number"]{ -moz-appearance: textfield; }
          .el-input__inner {
            height: 35px;

--- a/src/components/uploadFile.vue
+++ b/src/components/uploadFile.vue
@@ -18,7 +18,8 @@
                  <img v-else-if='["png", "jpg", "jpeg", "gif" ].includes(uploadFileType(fileData.name))' class="layout_icon" src="@/assets/images/newProductList/img_icon.png" alt="">
                  <img v-else-if='["xls", "xlsx" ].includes(uploadFileType(fileData.name))' class="layout_icon" src="@/assets/images/newProductList/excel_icon.png" alt="">
                  <img v-else-if='["pdf"].includes(uploadFileType(fileData.name))' class="layout_icon" src="@/assets/images/newProductList/pdf_icon.png" alt="">  
-                  <img v-else-if='["ppt", "pptx" ].includes(uploadFileType(fileData.name))' class="layout_icon" src="@/assets/images/newProductList/ppt_icon.png" alt="">  
+                  <img v-else-if='["ppt", "pptx" ].includes(uploadFileType(fileData.name))' class="layout_icon" src="@/assets/images/newProductList/ppt_icon.png" alt="">
+                  <img v-else-if='["txt"].includes(uploadFileType(fileData.name))' class="layout_icon" src="@/assets/images/newProductList/txt_icon.png" alt="">   
                  <img v-else class="layout_icon" src="@/assets/images/newProductList/pass.png" alt="">  
              </div>
              <div class="process_content">
@@ -41,7 +42,7 @@
          </div>
          <div class="process_tip tip_success" v-if="uploadStatus == UploadStatusType.SUCCESS">
              <div></div>
-              <div class="tip_right">预计扣除次数<span class="fee">{{fee}}</span>次</div>
+              <div class="tip_right">预计扣除次数 <span class="fee">{{fee}}</span> 次</div>
          </div>
      </div>
      <input type="file" ref="fileUpload" hidden @change="onInputUpload">
@@ -193,10 +194,14 @@ export default Vue.extend({
        margin-bottom: 5px;
      }
      .layout_status {
+        color: #3F79FE;
+        font-weight: bold;
        font-size: 14px;
        line-height: 20px;
+        margin-bottom: 5px;
      }
      .layout_tip {
+        transform: scale(0.9);
        font-size: 12px;
        line-height: 17px;
      }
@@ -256,6 +261,7 @@ export default Vue.extend({
            .fee {
                color: #F6AD00;
                font-size: 16px;
+                font-weight: bold;
            }
        }

--- a/src/plugins/axios-plugin.ts
+++ b/src/plugins/axios-plugin.ts
@@ -85,6 +85,8 @@ async function ajax(param: PostParam | GetParam) {
      return null;
    }
    Message.error('网络异常');
+    sessionStorage.removeItem("user");
+    router.push({ path: "/" });
  }
 }
 export {

--- a/src/views/pass/PassMaker.vue
+++ b/src/views/pass/PassMaker.vue
@@ -25,6 +25,7 @@
                       <img v-else-if='["xls", "xlsx" ].includes(uploadFileType(fileData.name))' class="layout_icon" src="@/assets/images/newProductList/excel_icon.png" alt="">
                       <img v-else-if='["pdf"].includes(uploadFileType(fileData.name))' class="layout_icon" src="@/assets/images/newProductList/pdf_icon.png" alt="">  
                       <img v-else-if='["ppt", "pptx" ].includes(uploadFileType(fileData.name))' class="layout_icon" src="@/assets/images/newProductList/ppt_icon.png" alt="">  
+                       <img v-else-if='["txt" ].includes(uploadFileType(fileData.name))' class="layout_icon" src="@/assets/images/newProductList/txt_icon.png" alt="">  
                       <img v-else class="layout_icon" src="@/assets/images/newProductList/pass.png" alt="">  
                   </div>
                   <div class="process_content">
@@ -63,7 +64,7 @@
               </el-select>
             </el-form-item>
             <el-form-item label="通证数量" prop="amount">
-               <el-input onkeyup="value=value.replace(/[^\d]/g,0)" :disabled="amountDisable" v-model.number="formData.amount" placeholder="请输入通证数量"></el-input>
+               <el-input type="number" :disabled="amountDisable" v-model.number="formData.amount" placeholder="请输入通证数量"></el-input>
             </el-form-item>
           </el-form>
           <div class="category_add">
@@ -72,6 +73,12 @@
                   <img src="@/assets/images/newProductList/pass.png" alt="">
                   <span v-if="relationProof.name" class="relatived_text">已关联</span>
                   <span class="add_btn" @click="showCategory">{{relationProof.name? relationProof.name : '关联溯源'}}</span>
+                   <Icon class="recycle" @click="showCategory" v-if="relationProof.name" name="icon-zhongchuan" color="#8E8D8D" size="12px"></Icon>
+                   <span v-if="relationProof.name" @click="showCategory" class="re_add">重新关联</span>
+                   <div v-if="relationProof.name" class="delete_add" @click="deleteAdd">
+                       <img class="delete_icon" src="@/assets/images/newProductList/cancel.png" alt="">
+                       <div class="tip_right">删除</div>
+                   </div>
               </div>
           </div>
           <el-button class="submit_btn" @click="submit" type="primary" :disabled="disabled">支付并发行</el-button>
@@ -89,9 +96,12 @@
               <input class="category_input"  type="text" placeholder="输入溯源名称" v-model="searchKeywords">
           </div>
           <div class="floderList">
-                <ul class="infinite-list" v-infinite-scroll="pagechange" infinite-scroll-delay="100" style="overflow:auto">
+                <ul class="infinite-list" v-infinite-scroll="pagechange" infinite-scroll-delay="100" style="overflow:auto" v-if="proofList.length >= 1">
                  <li v-for="i in proofList" class="infinite-list-item" @click="checkProof(i)">{{ i.name }}</li>
                </ul>
+                <div v-else class="search_empty">
+                    搜索无结果
+                </div>
           </div>
       </el-dialog>
   </div>
@@ -301,6 +311,10 @@ export default Vue.extend({
               this.proofList = this.proofList.concat(res.data.results)
           }
       },
+       /**删除溯源 */
+       deleteAdd(){
+           this.relationProof = {} as ProofInfoType
+       },
       /**
        * 关键词查找溯源
        */
@@ -429,10 +443,14 @@ export default Vue.extend({
            margin-bottom: 5px;
          }
          .layout_status {
+            color: #3F79FE;
+            font-weight: bold;
            font-size: 14px;
            line-height: 20px;
+            margin-bottom: 5px;
          }
          .layout_tip {
+            transform: scale(0.9);
            font-size: 12px;
            line-height: 17px;
          }
@@ -523,6 +541,28 @@ export default Vue.extend({
                    font-size: 14px;
                    cursor: pointer;
                }
+                .recycle {
+                    margin-left: 10px;
+                }
+                .re_add {
+                    color: #8E8D8D;
+                    font-size: 12px;
+                    margin-left: 2px;
+                    cursor: pointer;
+                }
+                .delete_add {
+                    margin-left: auto;
+                    display: flex;
+                    align-items: center;
+                    color: #8E8D8D;
+                    font-size: 14px;
+                    cursor: pointer;
+                    img {
+                        width: 14px;
+                        height: 14px;
+                        margin-right: 4px;
+                    }
+                }
            }
        }
        .submit_btn {
@@ -537,6 +577,7 @@ export default Vue.extend({
            .fee {
                color: #F6AD00;
                font-size: 16px;
+                font-weight: bold;
            }
        }
    }
@@ -576,7 +617,6 @@ export default Vue.extend({
            input::-webkit-input-placeholder {
                color: #B9B9B9; 
            } 
        }
        .floderList {
            margin-top: 15px;
@@ -598,6 +638,13 @@ export default Vue.extend({
                    }
                }
            }
+            .search_empty {
+                box-sizing: border-box;
+                height: 300px;
+                padding-top: 10px;
+                text-align: center;
+                color: #C0C4CC;
+            }
        }
    }
    /deep/ .el-tree-node__label {
@@ -605,6 +652,11 @@ export default Vue.extend({
        text-overflow: ellipsis;
        white-space: nowrap;
    } 
+    /deep/ .el-input {
+        input::-webkit-outer-spin-button,
+　　    input::-webkit-inner-spin-button { -webkit-appearance: none; }
+　　    input[type="number"]{ -moz-appearance: textfield; }
+    }
 }