调整显示样式

vue/afvue/src/assets/main.css

@@ -41,3 +41,46 @@ a,
     box-shadow: 1px 2px 10px rgba(0, 0, 0, 0.1);
   }
 }
+
+
+/* 常规图标 */
+.tb{
+  display: inline-block;
+  width: 25px;
+  height: 25px;
+  background-image: url("@/assets/css_sprites.png");
+  background-repeat: no-repeat;
+  background-size: 25px;
+  background-position: 0px -375px
+}
+
+.tb-html {
+    background-position: 0px -448px;
+}
+.tb-gz{
+    background-position: 0px -298px;
+}
+.tb-zip{
+    background-position: 0px -298px;
+}
+.tb-js{
+    background-position: 0px -523px;
+}
+.tb-json{
+    background-position: 0px -623px;
+}
+.tb-css{
+    background-position: 0px -323px;
+}
+.tb-png{
+    background-position: 0px -375px;
+}
+.tb-jpg{
+    background-position: 0px -375px;
+}
+.tb-gif{
+    background-position: 0px -375px;
+}
+.tb-php{
+    background-position: 0px -848px;
+}

vue/afvue/src/views/Sfilecompare.vue

@@ -13,14 +13,14 @@
                 <input name="path" class="inputbox" type="text" placeholder="/" autocomplete="off" v-model="fspath">
                 <button @click="getFlist">Go</button>
                 <button @click="goParent">🔙</button>
+                <a @click="uploadFile">同步选择的代码</a>
             </div>
             <div class="sflist">
                 <ul>
-                    <li v-for="(item, index) in fsclist" :key="item" 
-                        :data-index="index">
+                    <li v-for="(item, index) in fsclist" :key="item" :data-index="index">
                         <input type="checkbox" :value="item.path" class="sfchkbox" :name="'fsbox' + index" :ref="'fsbox' + index"/>
-                        <a class="haschild" @click="goIntoDir(item.path, 1)" v-if="item.isdir">{{ item.path }}</a>
-                        <span v-else>{{ item.path }}</span>
+                        <a class="haschild" @click="goIntoDir(item.path, 1)" v-if="item.isdir"><i></i>{{ item.path }}</a>
+                        <span v-else><i :class="'tb tb-'+item.suffix"></i>{{ item.path }}</span>
                         <!-- 
                         <div class="sflfunc">
                             <a>发送</a>
@@ -52,9 +52,10 @@
 
             <div class="sflist">
                 <ul>
-                    <li v-for="item in ssclist" :key="item">
-                        <a class="haschild" @click="goIntoDir(item.path, 2)" v-if="item.isdir">{{ item.path }}</a>
-                        <span v-else>{{ item.path }}</span>
+                    <li v-for="item in ssclist" :key="item" :data-index="index">
+                        <input type="checkbox" :value="item.path" class="sfchkbox" :name="'ssbox' + index" :ref="'fsbox' + index"/>
+                        <a class="haschild" @click="goIntoDir(item.path, 2)" v-if="item.isdir"><i></i>{{ item.path }}</a>
+                        <span v-else><i :class="'tb tb-'+item.suffix"></i>{{ item.path }}</span>
                     </li>
                 </ul>
             </div>
@@ -332,7 +333,7 @@ export default {
 }
 
 .sfcon:nth-child(2) .sflist {
-    background-color: #f1ebeb;
+    background-color: #dddcdc5e;
 }
 
 .sfind {
@@ -415,6 +416,15 @@ export default {
 .sfcon .sflist .haschild {
     cursor: pointer;
 }
+.sfcon .sflist .haschild i{
+    display: inline-block;
+    width: 25px;
+    height: 25px;
+    background-image: url("@/assets/css_sprites.png");
+    background-repeat: no-repeat;
+    background-size: 25px;
+    background-position: 0px -400px;
+}
 
 .sfcon .sflist .tips {
     width: 100%;