c5_labsci/fapp/ciyon_ap/pages/demo/comview/searchbar.vue
2026-01-27 00:52:00 +08:00

90 lines
2.2 KiB
Vue
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<ciy-header ref="header" title="ciy-searchbar组件"></ciy-header>
<view>
<view class="ciy-card">
<view class="title">文字搜索栏</view>
<view class="content">
<view class="tip">
文字搜索框<br />
</view>
</view>
</view>
<view class="sti bg3" :style="{top:(header_statusbar_height+header_title_height)+'px'}">
<ciy-searchbar class="block px2 py2" :placeholder="props.placeholder" :btntxt="props.btntxt" @confirm="query_search"></ciy-searchbar>
</view>
<view class="ciy-card" v-if="formdata">
<view class="content">
<view v-html="tobr(formdata)" class="formdata"></view>
</view>
</view>
<view class="ciy-card">
<view class="title">属性</view>
<view class="content">
<view class="prp">placeholder</view>
<view class="tip">
占位文字。<br />
默认 请选择
</view>
<ciy-input bb v-model="props.placeholder"></ciy-input>
<view class="hr"></view>
<view class="prp">btntxt</view>
<view class="tip">
右侧按钮文字。<br />
</view>
<ciy-input bb v-model="props.btntxt"></ciy-input>
<view class="hr"></view>
<view class="prp">value</view>
<view class="tip">
默认的输入内容。<br />
</view>
</view>
</view>
<view class="ciy-card">
<view class="title">方法</view>
<view class="content">
</view>
</view>
<view class="ciy-card">
<view class="title">事件</view>
<view class="content">
<view class="evt">@confirm</view>
<view class="tip">
执行查询事件<br />
</view>
<view class="hr"></view>
<view class="log" v-for="(item, index) in eventlog" :key="index">
<text class="code">{{eventlog.length - index}}</text>
{{item}}
</view>
</view>
</view>
<view class="hr"></view>
</view>
</template>
<style scoped>
@import '@/pages/demo/zdemo.css';
</style>
<script>
import zmixin from '@/pages/demo/zmixin.js';
export default {
mixins: [zmixin],
data() {
return {
props:{
placeholder: '请输入关键字',
btntxt: '搜索'
}
}
},
onLoad() {},
methods: {
query_search(e) {
this.formdata = JSON.stringify(e, null, ' ') + '';
}
}
}
</script>