Browse Source

底部按钮样式修改

xiaohaizhao 1 year ago
parent
commit
c59f51a981
1 changed files with 103 additions and 92 deletions
  1. 103 92
      cloud/feedback/index.vue

+ 103 - 92
cloud/feedback/index.vue

@@ -2,7 +2,8 @@
     <view>
         <My_listbox ref="List" @getlist="getList" :bottomHeight="70">
             <view class="item-box">
-                <navigator @click="itemClick(item,index)" :url="'/cloud/feedback/detail?id='+item.sa_feedbackid" class="item" v-for="(item,index) in list" :key="item.sa_feedbackid">   
+                <navigator @click="itemClick(item, index)" :url="'/cloud/feedback/detail?id=' + item.sa_feedbackid"
+                    class="item" v-for="(item, index) in list" :key="item.sa_feedbackid">
                     <view class="header">
                         <view class="header-left">
                             <text>{{ item.type }}</text>
@@ -35,9 +36,9 @@
 
 <script>
 export default {
-    data () {
+    data() {
         return {
-            list:[],
+            list: [],
             content: {
                 "pageNumber": 1,
                 "pageSize": 20,
@@ -67,22 +68,22 @@ export default {
                 })
             })
         },
-        async itemClick (data,index) {
+        async itemClick(data, index) {
             this.$Http.setCallCount = function () {
                 let replycount = this.list[index].replycount + 1
-                this.$set(this.list[index],'replycount',replycount)
+                this.$set(this.list[index], 'replycount', replycount)
             }.bind(this)
         },
-        updateList () {
-            this.$Http.updateList = function(res) {
+        updateList() {
+            this.$Http.updateList = function (res) {
                 this.getList(true)
                 delete this.$Http.updateList
             }.bind(this)
         }
     },
-    onLoad (options) {
+    onLoad(options) {
         uni.setNavigationBarTitle({
-            title:'意见反馈',
+            title: '意见反馈',
         })
         this.getList(true)
     }
@@ -90,97 +91,107 @@ export default {
 </script>
 
 <style lang="scss">
-    .item-box {
-        padding: 10px;
-        .item {
-            background: #ffffff;
-            padding: 19px 0 10px 10px;
-            border-radius: 8px 8px 8px 8px;
-            font-family: Source Han Sans SC, Source Han Sans SC;
-            margin-top: 10px;
-            &:first-child {
-                margin-top: 0 !important;
-            }
-            .header {
-                display: flex;
-                justify-content: space-between;
-                align-items: center;
-                padding-right: 10px;
-                .header-left {
-                    position: relative;
-                    padding-left: 10px;
-                    &::after {
-                        content:'';
-                        width: 4px;
-                        height: 16px;
-                        background: #C30D23;
-                        position: absolute;
-                        left: 0;
-                        top: 2px;
-                    }
-                }
-                .header-right {
-                    font-weight: 400;
-                    font-size: 12px;
-                    color: #E3041F;
-                    position: relative;
-                    &::after {
-                        content:'';
-                        width: 5px;
-                        height: 5px;
-                        border-radius: 50%;
-                        background: #E3041F;
-                        position: absolute;
-                        left: -8px;
-                        top: 6px;
-                    }
+.item-box {
+    padding: 10px;
+
+    .item {
+        background: #ffffff;
+        padding: 19px 0 10px 10px;
+        border-radius: 8px 8px 8px 8px;
+        font-family: Source Han Sans SC, Source Han Sans SC;
+        margin-top: 10px;
+
+        &:first-child {
+            margin-top: 0 !important;
+        }
+
+        .header {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            padding-right: 10px;
+
+            .header-left {
+                position: relative;
+                padding-left: 10px;
+
+                &::after {
+                    content: '';
+                    width: 4px;
+                    height: 16px;
+                    background: #C30D23;
+                    position: absolute;
+                    left: 0;
+                    top: 2px;
                 }
             }
-            .content {
-                font-weight: 400;
-                font-size: 14px;
-                color: #666666;
-                margin: 10px 0;
-                padding:0 10px 10px 0;
-                border-bottom: 1px solid #DDDDDD;
-            }
-            .footer {
-                display: flex;
-                align-items: center;
-                justify-content: space-between;
+
+            .header-right {
                 font-weight: 400;
                 font-size: 12px;
-                color: #999999;
-                padding-right: 10px;
+                color: #E3041F;
+                position: relative;
+
+                &::after {
+                    content: '';
+                    width: 5px;
+                    height: 5px;
+                    border-radius: 50%;
+                    background: #E3041F;
+                    position: absolute;
+                    left: -8px;
+                    top: 6px;
+                }
             }
         }
-    }
-    .bottom {
-        display: flex;
-        position: fixed;
-        bottom: 0;
-        left: 0;
-        width: 375px;
-        height: 64px;
-        background: #FFFFFF;
-        box-shadow: 0px -2px 6px 1px rgba(0, 0, 0, 0.16);
-        box-sizing: border-box;
-        z-index: 9999999;
-        padding: 10px;
-        .but { 
-            width: 355px;
-            height: 45px;
-            font-family: PingFang SC, PingFang SC;
-            font-weight: 500;
+
+        .content {
+            font-weight: 400;
             font-size: 14px;
-            color: #FFFFFF;
-            background: #C30D23;
-            border-radius: 5px 5px 5px 5px;
-            border: 1px solid #FFFFFF;
+            color: #666666;
+            margin: 10px 0;
+            padding: 0 10px 10px 0;
+            border-bottom: 1px solid #DDDDDD;
+        }
+
+        .footer {
             display: flex;
             align-items: center;
-            align-content: center;
-            justify-content: space-evenly;
+            justify-content: space-between;
+            font-weight: 400;
+            font-size: 12px;
+            color: #999999;
+            padding-right: 10px;
         }
     }
-</style>
+}
+
+.bottom {
+    display: flex;
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    width: 375px;
+    height: 64px;
+    background: #FFFFFF;
+    box-shadow: 0px -2px 6px 1px rgba(0, 0, 0, 0.16);
+    box-sizing: border-box;
+    z-index: 9999999;
+    padding: 5px 10px;
+
+    .but {
+        width: 355px;
+        height: 45px;
+        font-family: PingFang SC, PingFang SC;
+        font-weight: 500;
+        font-size: 14px;
+        color: #FFFFFF;
+        background: #C30D23;
+        border-radius: 5px 5px 5px 5px;
+        border: 1px solid #FFFFFF;
+        display: flex;
+        align-items: center;
+        align-content: center;
+        justify-content: space-evenly;
+    }
+}</style>