123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123 |
- <template>
- <view>
- <view class="top-bar" >
- <view class="row">
-
- <view class="column column1" @click="navTo(1,'/pages/home/home')"><image src="../../static/images/backhome.png" style="width: 24px; height: 24px;"></image></view>
- <view class="column column2"><input class="input-box" type="text" placeholder="搜索内容" style="width: 100%;"/></view>
- <view class="column column3"><image src="../../static/images/fangdajing.png" style="width: 21px; height: 21px;"></image></view>
- <view class="column column4" ></view>
- </view>
-
- </view>
-
-
- </view>
- </template>
- <script>
- export default {
- props: {
- active: {
- type: Number,
- default: 1
- }
- },
-
-
- data() {
- return {
- // diy:2
- };
- },
-
- computed: {
-
- diy() {
-
- return this.$store.state.systemInfo.is_vip;
- },
-
- setColor() {
-
- return this.$store.state.setColor;
- }
-
- },
-
- methods: {
- navTo(index, url) {
-
- if (index != this.active) {
-
- uni.switchTab({
- url: url
- })
- }
- },
- onViewBind(e){
- uni.navigateTo({
- url:'/pages/user-detail/user-detail'
- })
- },
-
-
- }
- }
- </script>
- <style scoped>
- .top-bar {
- /* background-color: #745A42; */
- background-color: #593320;
- width: 100vw;
-
- /*兼容 IOS<11.2*/
- padding-bottom: constant(safe-area-inset-bottom);
- /*兼容 IOS>11.2*/
- padding-bottom: env(safe-area-inset-bottom);
- height: 120px;
- display: flex;
- flex-flow: row nowrap;
- justify-tab-bar: space-around;
- align-items: center;
- padding-top: 30px;
-
- position: fixed;
- left: 0;
- top: 0;
- z-index: 900;
- }
- .row {
- padding-top: 40px;
- display: flex;
- justify-content: space-between;
- width: 100%;
- }
- .column {
- padding: 10px 0px 0px 0px;
-
- text-align: left; /* 文本居中 */
- width: 100%;
- }
- .column1 { width: 24%; padding-left: 30px; }
- .column2 { width: 48%;padding-left:20px }
- .column3 { width: 20px; padding-left:10px; padding-top: 12px;}
- .column4 { width: 20%;margin-right: 30px; }
- .input-box {
- border: 1px solid #CCC; /* 白色边框 */
- border-radius: 10px; /* 边框弧形角度 */
- padding: 0px 5px; /* 内边距 */
- height: 24px;
- color: #FFF;
-
- }
- .input-box::placeholder {
- color: #FFF; /* 占位符文字颜色 */
-
- }
- </style>
|