排序

package-lock.json

@@ -1931,6 +1931,7 @@
     "bindings": {
       "version": "1.5.0",
       "resolved": "https://registry.npm.taobao.org/bindings/download/bindings-1.5.0.tgz",
+      "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==",
       "dev": true,
       "optional": true,
       "requires": {
@@ -3680,9 +3681,9 @@
       "dev": true
     },
     "element-ui": {
-      "version": "2.4.11",
-      "resolved": "https://registry.npmjs.org/element-ui/-/element-ui-2.4.11.tgz",
-      "integrity": "sha512-RtgK0t840NAFTajGMWvylzZRSX1EkZ7V4YgAoBxhv4TtkeMscLuk/IdYOzPdlQq6IN0byx1YVBxCX+u4yYkGvw==",
+      "version": "2.13.1",
+      "resolved": "https://registry.npmjs.org/element-ui/-/element-ui-2.13.1.tgz",
+      "integrity": "sha512-jyvJmXa2c6ElRc4NOw4V1vnjHsvfzTRhbwElZ68CyF9by2F64B+AJRzujg/HJgXCimHwd2g1Av9D04EP3mWymg==",
       "dev": true,
       "requires": {
         "async-validator": "~1.8.1",
@@ -4545,6 +4546,7 @@
     "file-uri-to-path": {
       "version": "1.0.0",
       "resolved": "https://registry.npm.taobao.org/file-uri-to-path/download/file-uri-to-path-1.0.0.tgz",
+      "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==",
       "dev": true,
       "optional": true
     },
@@ -4834,8 +4836,7 @@
         "ansi-regex": {
           "version": "2.1.1",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "aproba": {
           "version": "1.2.0",
@@ -4856,14 +4857,12 @@
         "balanced-match": {
           "version": "1.0.0",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "brace-expansion": {
           "version": "1.1.11",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "balanced-match": "^1.0.0",
             "concat-map": "0.0.1"
@@ -4878,20 +4877,17 @@
         "code-point-at": {
           "version": "1.1.0",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "concat-map": {
           "version": "0.0.1",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "console-control-strings": {
           "version": "1.1.0",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "core-util-is": {
           "version": "1.0.2",
@@ -5008,8 +5004,7 @@
         "inherits": {
           "version": "2.0.4",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "ini": {
           "version": "1.3.5",
@@ -5021,7 +5016,6 @@
           "version": "1.0.0",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "number-is-nan": "^1.0.0"
           }
@@ -5036,7 +5030,6 @@
           "version": "3.0.4",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "brace-expansion": "^1.1.7"
           }
@@ -5044,14 +5037,12 @@
         "minimist": {
           "version": "0.0.8",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "minipass": {
           "version": "2.9.0",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "safe-buffer": "^5.1.2",
             "yallist": "^3.0.0"
@@ -5070,7 +5061,6 @@
           "version": "0.5.1",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "minimist": "0.0.8"
           }
@@ -5160,8 +5150,7 @@
         "number-is-nan": {
           "version": "1.0.1",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "object-assign": {
           "version": "4.1.1",
@@ -5173,7 +5162,6 @@
           "version": "1.4.0",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "wrappy": "1"
           }
@@ -5259,8 +5247,7 @@
         "safe-buffer": {
           "version": "5.1.2",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "safer-buffer": {
           "version": "2.1.2",
@@ -5296,7 +5283,6 @@
           "version": "1.0.2",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "code-point-at": "^1.0.0",
             "is-fullwidth-code-point": "^1.0.0",
@@ -5316,7 +5302,6 @@
           "version": "3.0.1",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "ansi-regex": "^2.0.0"
           }
@@ -5360,14 +5345,12 @@
         "wrappy": {
           "version": "1.0.2",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "yallist": {
           "version": "3.1.1",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         }
       }
     },
@@ -6427,6 +6410,7 @@
     "jquery": {
       "version": "3.4.1",
       "resolved": "https://registry.npm.taobao.org/jquery/download/jquery-3.4.1.tgz",
+      "integrity": "sha1-cU8fjZ3eS9+lV2S6N+8hRjDYDvI=",
       "dev": true
     },
     "js-levenshtein": {
@@ -7208,6 +7192,7 @@
     "nan": {
       "version": "2.14.0",
       "resolved": "https://registry.npm.taobao.org/nan/download/nan-2.14.0.tgz",
+      "integrity": "sha512-INOFj37C7k3AfaNTtX8RhsTw7qRy7eLET14cROi9+5HAVbbHuIWUHEauBv5qT4Av2tWasiTY1Jw6puUNqRJXQg==",
       "dev": true,
       "optional": true
     },

package.json

@@ -25,7 +25,7 @@
     "@vue/cli-service": "^3.0.4",
     "@vue/eslint-config-standard": "^3.0.4",
     "axios": "^0.18.0",
-    "element-ui": "^2.4.7",
+    "element-ui": "^2.13.1",
     "jquery": "^3.4.1",
     "js-md5": "^0.7.3",
     "less": "^3.8.1",

src/components/qualityControl/AddQualityControlTemp.vue

@@ -37,10 +37,13 @@
                             <div>
                                 <p>已选择字段：</p>
                                 <div class="selectFiled" v-for="(it,ii) in item.selectFiled">
+                                    <div class="orderBox">
+                                        <span v-if="ii !=0" class="el-icon-top order" :class="{lastItem:ii ==item.selectFiled.length}" @click="upFiled(ii,index)"></span>
+                                        <span v-if="ii !=item.selectFiled.length-1" class="el-icon-bottom order"  :class="{firstItem:ii == 0}" @click="downFiled(ii,index)"></span> 
+                                    </div>
                                     <span>{{it.name}}</span>
-                                    <span @click="upFiled(ii,index)">上升</span>
-                                    <span @click="downFiled(ii,index)">下降</span> 
-                                    <span @click="delSelected(ii,index)">删除</span>
+                                
+                                    <span class="delItem" @click="delSelected(ii,index)">删除</span>
                                 </div>
                             </div>
                         </div>
@@ -226,13 +229,13 @@ export default {
     width: 500px;
     min-height: 200px;
     padding: 0 50px 0 50px;
-    border: 1px solid rgb(220, 223, 230);
+    border: 1px solid #dcdfe6;
     border-radius: 5px;
     margin-bottom: 20px;
 }
 .addUnit{
     display: inline-block;
-    border: 1px solid rgb(220, 223, 230);
+    border: 1px solid #dcdfe6;
     border-radius: 5px;
     width: 80px;
     text-align: center;
@@ -265,5 +268,28 @@ export default {
 .searchItem:hover{
     background-color: #abcdef;
 }
+.selectFiled{
+    position: relative;
+}
+.orderBox{
+    position: absolute;
+    left: -50px;
+}
+.order{
+    display: inline-block;
+    width: 16px;
+    height: 16px;
+    font-size: 16px;
+    margin-left: 5px;
+    border: 1px solid #dcdfe6;
+    cursor: pointer;
+    i{
+        width: 15px;
+        height: 15px;
+    }
+}
+.firstItem{
+    margin-left: 28px;
+}
 
 </style>