Explorar o código

feat: 给进制转换增加一个交换按钮

jxeng %!s(int64=2) %!d(string=hai) anos
pai
achega
b282457fd5
Modificáronse 3 ficheiros con 14 adicións e 5 borrados
  1. 8 4
      apps/trans-radix/index.css
  2. 1 1
      apps/trans-radix/index.html
  3. 5 0
      apps/trans-radix/index.js

+ 8 - 4
apps/trans-radix/index.css

@@ -16,10 +16,14 @@ select.x-select {
     width: 114px;
 }
 .radix-tips {
-    margin-left: 160px;
-    font-size: 12px;
-    color: #bbb;
-    font-style: italic;
+    margin-left: 220px;
+    font-size: 14px;
+    letter-spacing: 3px;
+    cursor: pointer;
+    user-select: none;
+}
+.radix-tips:hover {
+    color: #0000ffcc;
 }
 
 .row.x-tips {

+ 1 - 1
apps/trans-radix/index.html

@@ -44,7 +44,7 @@
         </div>
 
         <div class="ui-mt-20">
-            <span class="radix-tips">// 转换结果就在下面了</span>
+            <span class="radix-tips" @click="switchInput">↑↓交换</span>
         </div>
 
         <div class="row mod-radios ui-mt-20">

+ 5 - 0
apps/trans-radix/index.js

@@ -20,6 +20,11 @@ new Vue({
     methods: {
         getId: (type, id) => [type, id].join('_'),
 
+        switchInput: function () {
+            [this.fromSelected, this.toSelected] = [this.toSelected, this.fromSelected];
+            [this.srcValue, this.rstValue] = [this.rstValue, this.srcValue];
+        },
+
         radixRadioClicked: function (type, n) {
             if (type === 1) {
                 this.fromSelected = n;