1 line
4.9 KiB
Plaintext
1 line
4.9 KiB
Plaintext
|
{"version":3,"file":"s-search-block.js","sources":["../../../../../../src/sheep/components/s-search-block/s-search-block.vue","../../../../../../uniComponent:/RDovQXBwL1dvcmsvYWRkci9hY2RyLXVpL3NyYy9zaGVlcC9jb21wb25lbnRzL3Mtc2VhcmNoLWJsb2NrL3Mtc2VhcmNoLWJsb2NrLnZ1ZQ"],"sourcesContent":["<template>\r\n <view\r\n class=\"search-content ss-flex ss-col-center ss-row-between\"\r\n @tap=\"click\"\r\n :style=\"[\r\n {\r\n borderRadius: radius + 'px',\r\n background: elBackground,\r\n height: height + 'px',\r\n width: width,\r\n },\r\n ]\"\r\n :class=\"[{ 'border-content': navbar }]\"\r\n >\r\n <view class=\"ss-flex ss-col-center\" v-if=\"navbar\">\r\n <view class=\"search-icon _icon-search ss-m-l-10\" :style=\"[{ color: props.iconColor }]\"></view>\r\n <view class=\"search-input ss-flex-1 ss-line-1\" :style=\"[{ color: fontColor, width: width }]\">\r\n {{ placeholder }}\r\n </view>\r\n </view>\r\n <uni-search-bar\r\n v-if=\"!navbar\"\r\n class=\"ss-flex-1\"\r\n :radius=\"data.borderRadius\"\r\n :placeholder=\"data.placeholder\"\r\n cancelButton=\"none\"\r\n clearButton=\"none\"\r\n @confirm=\"onSearch\"\r\n v-model=\"state.searchVal\"\r\n />\r\n <view class=\"keyword-link ss-flex\">\r\n <view v-for=\"(item, index) in data.hotKeywords\" :key=\"index\">\r\n <view\r\n class=\"ss-m-r-16\"\r\n :style=\"[{ color: data.textColor }]\"\r\n @tap.stop=\"sheep.$router.go('/modules/mall/goods/list', { keyword: item })\"\r\n >\r\n {{ item }}\r\n </view>\r\n </view>\r\n </view>\r\n <view v-if=\"data.hotKeywords && data.hotKeywords.length && navbar\" class=\"ss-flex\">\r\n <button\r\n class=\"ss-reset-button keyword-btn\"\r\n v-for=\"(item, index) in data.hotKeywords\"\r\n :key=\"index\"\r\n :style=\"[{ color: data.textColor, marginRight: '10rpx' }]\"\r\n >\r\n {{ item }}\r\n </button>\r\n </view>\r\n </view>\r\n</template>\r\n\r\n<script setup>\r\n/**\r\n * 基础组件 - 搜索栏\r\n *\r\n * @property {String} elBackground \t\t\t- 输入框背景色\r\n * @property {String} iconColor \t\t\t- 图标颜色\r\n * @property {String} fontColor \t\t \t- 字体颜色\r\n * @property {Number} placeholder \t\t\t- 默认placeholder\r\n * @property {Number} topRadius \t\t\t- 组件上圆角\r\n * @property {Number} bottomRadius \t\t\t- 组件下圆角\r\n *\r\n * @slot keywords\t\t\t\t\t\t\t- 关键字\r\n * @event {Function} click \t\t\t\t\t- 点击组件时触发\r\n */\r\n\r\nimport { computed, reactive } from 'vue'\r\nimport sheep from '@/sheep'\r\n\r\n// 组件数据\r\nconst state = reactive({\r\n searchVal: '',\r\n})\r\n\r\n// 事件页面\r\nconst emits = defineEmits(['click'])\r\n\r\n// 接收参数\r\nconst props = defineProps({\r\n data: {\r\n type: Object,\r\n default: () => ({}),\r\n },\r\n // 输入框背景色\r\n elBackground: {\r\n type: String,\r\n default: '',\r\n },\r\n height: {\r\n type: Number,\r\n default: 36,\r\n },\r\n // 图标颜色\r\n iconColor: {\r\n type: String,\r\n default: '#b0b3bf',\r\n },\r\n // 字体颜色\r\n fontColor: {\r\n type: String,\r\n default: '#b0b3bf',\r\n },\r\n // placeholder\r\n placeholder: {\r\n type: String,\r\n default: '这是一个搜索框',\r\n },\r\n radius: {\r\n type: Number,\r\n default: 10,\r\n },\r\n width: {\r\n type: String,\r\n default: '100%',\r\n },\r\n navbar: {\r\n type: Boolean,\r\n default: true,\r\n },\r\n})\r\n\r\n// 点击\r\nconst click = () => {\r\n emits('click')\r\n}\r\n\r\nfunction onSearch(e) {\r\n if (e.value) {\r\n sheep.$router.go('/modules/mall/goods/list', { keyword: e.value })\r\n setTimeout(() => {\r\n state.searchVal = ''\r\n }, 100)\r\n }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n \r\n.border-content {\r\n border: 2rpx solid #eee;\r\n}\r\n\r\n.search-content {\r\n flex: 1;\r\n // height: 80rpx
|