Skip to content

E
emergency-app
Commit 99469e05 by 吴春元
Options

修改

parent ed1df273
Showing with 776 additions and 130 deletions
.idea/vcs.xml 0 → 100644
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="VcsDirectoryMappings">
<mapping directory="" vcs="Git" />
</component>
</project>
\ No newline at end of file
.idea/workspace.xml
...@@ -4,29 +4,41 @@ ...@@ -4,29 +4,41 @@
<option name="autoReloadType" value="NONE" /> <option name="autoReloadType" value="NONE" />
</component> </component>
<component name="ChangeListManager"> <component name="ChangeListManager">
<list default="true" id="e6b5ebd7-6e68-4ea7-96fc-deb6be1cf064" name="Changes" comment="" /> <list default="true" id="e6b5ebd7-6e68-4ea7-96fc-deb6be1cf064" name="Changes" comment="">
<change afterPath="$PROJECT_DIR$/.idea/vcs.xml" afterDir="false" />
</list>
<option name="SHOW_DIALOG" value="false" /> <option name="SHOW_DIALOG" value="false" />
<option name="HIGHLIGHT_CONFLICTS" value="true" /> <option name="HIGHLIGHT_CONFLICTS" value="true" />
<option name="HIGHLIGHT_NON_ACTIVE_CHANGELIST" value="false" /> <option name="HIGHLIGHT_NON_ACTIVE_CHANGELIST" value="false" />
<option name="LAST_RESOLUTION" value="IGNORE" /> <option name="LAST_RESOLUTION" value="IGNORE" />
</component> </component>
<component name="Git.Settings">
<option name="RECENT_GIT_ROOT_PATH" value="$PROJECT_DIR$" />
</component>
<component name="ProjectColorInfo"><![CDATA[{
"associatedIndex": 4
}]]></component>
<component name="ProjectId" id="2syJVkZnfHDKjALs5jpTkkHI9zT" /> <component name="ProjectId" id="2syJVkZnfHDKjALs5jpTkkHI9zT" />
<component name="ProjectViewState"> <component name="ProjectViewState">
<option name="hideEmptyMiddlePackages" value="true" /> <option name="hideEmptyMiddlePackages" value="true" />
<option name="showLibraryContents" value="true" /> <option name="showLibraryContents" value="true" />
</component> </component>
<component name="PropertiesComponent"> <component name="PropertiesComponent"><![CDATA[{
<property name="RunOnceActivity.OpenProjectViewOnStart" value="true" /> "keyToString": {
<property name="RunOnceActivity.ShowReadmeOnStart" value="true" /> "RunOnceActivity.ShowReadmeOnStart": "true",
<property name="RunOnceActivity.cidr.known.project.marker" value="true" /> "kotlin-language-version-configured": "true",
<property name="android.project.structure.last.selected" value="SDK Location" /> "last_opened_file_path": "/Library/web/git/emergency-app/emergency-app",
<property name="android.project.structure.proportion" value="0.15" /> "nodejs_package_manager_path": "yarn",
<property name="android.sdk.path" value="$USER_HOME$/Library/Android/sdk" /> "vue.rearranger.settings.migration": "true"
<property name="cidr.known.project.marker" value="true" /> }
<property name="dart.analysis.tool.window.visible" value="false" /> }]]></component>
<property name="last_opened_file_path" value="$PROJECT_DIR$" /> <component name="SharedIndexes">
<property name="settings.editor.selected.configurable" value="AndroidSdkUpdater" /> <attachedChunks>
<property name="show.migrate.to.gradle.popup" value="false" /> <set>
<option value="bundled-jdk-9f38398b9061-39b83d9b5494-intellij.indexing.shared.core-IU-241.15989.150" />
<option value="bundled-js-predefined-1d06a55b98c1-91d5c284f522-JavaScript-IU-241.15989.150" />
</set>
</attachedChunks>
</component> </component>
<component name="SpellCheckerSettings" RuntimeDictionaries="0" Folders="0" CustomDictionaries="0" DefaultDictionary="application-level" UseSingleDictionary="true" transferred="true" /> <component name="SpellCheckerSettings" RuntimeDictionaries="0" Folders="0" CustomDictionaries="0" DefaultDictionary="application-level" UseSingleDictionary="true" transferred="true" />
<component name="TaskManager"> <component name="TaskManager">
...@@ -36,7 +48,11 @@ ...@@ -36,7 +48,11 @@
<option name="number" value="Default" /> <option name="number" value="Default" />
<option name="presentableId" value="Default" /> <option name="presentableId" value="Default" />
<updated>1739421911220</updated> <updated>1739421911220</updated>
<workItem from="1739422927921" duration="93000" />
</task> </task>
<servers /> <servers />
</component> </component>
<component name="TypeScriptGeneratedFilesManager">
<option name="version" value="3" />
</component>
</project> </project>
\ No newline at end of file
components/yixuan-tabs/yixuan-tabs.vue 0 → 100644
<template>
<view class="tab">
<scroll-view class="scroll-view-content" scroll-x scroll-with-animation :show-scrollbar="false"
:scroll-left="scrollLeft">
<view class="scroll-item-view" :class="scroll ? '' : 'flex-row-left'" id="tab">
<view class="scroll-item" :class="[ index == list.length - 1 ? 'no-right' : '' ]"
:style="{ color: currentIndex == index ? activeColor: '', height: tabHeight, 'line-height': tabHeight, 'font-size': fontSize, width: !scroll ? (100/list.length) + '%' : '', 'margin-right': scroll ? marright : '','font-weight': currentIndex == index ? activeWeight: '', }"
:id="'tab-item-' + index" v-for="(item, index) in list" :key="index" @click="clickTab(item, index)">
{{ item.name }}
</view>
<view class="scroll-tab-bar" :style="[tabBarStyle]"></view>
</view>
</scroll-view>
</view>
</template>
<script>
export default {
props: {
list: {
type: Array,
default: () => {
return []
}
},
// 当前活动tab的索引
current: {
type: [Number, String],
default: 0
},
// 菜单底部移动的bar的宽度，单位px
barWidth: {
type: [String, Number],
default: 16
},
// 移动bar的高度
barHeight: {
type: [String, Number],
default: 2
},
barStyle: {
type: Object,
default () {
return {}
}
},
// 移动bar选中颜色
activeBarColor: {
type: String,
default: '#ffffff'
},
// 文字选中颜色
activeColor: {
type: String,
default: '#ffffff'
},
// 过渡动画时长, 单位ms
duration: {
type: [String, Number],
default: 0.5
},
// tab高度
height: {
type: Number,
default: 44
},
// 字体
fontSize: {
type: String,
default: '14px'
},
// 是否滚动，默认是，否则是不滚动，按个数等分宽度
scroll: {
type: Boolean,
default: true
},
// margin-right
marright: {
type: String,
default: '10px'
},
// font-weight
activeWeight: {
type: String,
default: 'normal'
}
},
watch: {
list(n, o) {
// list变动时，重制内部索引，否则可能导致超出数组边界的情况
if (n.length !== o.length) this.currentIndex = 0;
this.$nextTick(() => {
this.init();
});
},
current: {
immediate: true,
handler(nVal, oVal) {
// 视图更新后再执行移动操作
this.$nextTick(() => {
this.currentIndex = nVal;
this.scrollByIndex();
});
}
}
},
computed: {
tabBarStyle: function() {
let style = {
width: this.barWidth + 'px',
height: this.barHeight + 'px',
transform: `translateX(${this.scrollBarLeft}px)`,
'transition-duration': `${this.barFirstTimeMove ? 0 : this.duration}s`,
'border-radius': `${this.barHeight / 2}px`,
'background-color': this.activeBarColor
}
Object.assign(style, this.barStyle)
return style
},
tabHeight() {
return this.height + 'px'
}
},
data() {
return {
scrollLeft: 0,
componentWidth: 0, // tabs组件宽度，单位为px
parentLeft: 0, // 父元素(tabs组件)到屏幕左边的距离
scrollBarLeft: 0, // 移动bar需要通过translateX()移动的距离
tabItemRectInfo: [],
currentIndex: 0,
barFirstTimeMove: true
};
},
mounted() {
this.init()
},
methods: {
init() {
console.log("#init")
this.$nextTick(() => {
uni.createSelectorQuery().in(this).select(`#tab`).fields({
size: true,
rect: true
}, data => {
console.log("#tab-data:", data)
this.parentLeft = data.left;
// tabs组件的宽度
this.componentWidth = data.width;
}).exec();
this.getTabItemRect()
})
},
getTabItemRect() {
console.log("getTabItemRect")
let query = uni.createSelectorQuery().in(this);
for (let i = 0; i < this.list.length; i++) {
// 只要size和rect两个参数
query.select(`#tab-item-${i}`).fields({
size: true,
rect: true
});
}
query.exec((data) => {
console.log("#data:", data)
this.tabItemRectInfo = data
this.scrollByIndex()
})
},
scrollByIndex() {
let tabInfo = this.tabItemRectInfo[this.currentIndex]
if (!tabInfo) return
// 活动tab的宽度
let tabWidth = tabInfo.width
let offsetLeft = tabInfo.left - this.parentLeft
// 将活动的tabs-item移动到屏幕正中间，实际上是对scroll-view的移动
let scrollLeft = offsetLeft - (this.componentWidth - tabWidth) / 2
this.scrollLeft = scrollLeft < 0 ? 0 : scrollLeft;
// 计算当前活跃item到组件左边的距离
let left = tabInfo.left + tabInfo.width / 2 - this.parentLeft
this.scrollBarLeft = left - this.barWidth / 2;
if (this.barFirstTimeMove == true) {
setTimeout(() => {
this.barFirstTimeMove = false;
}, 100)
}
},
clickTab(item, index) {
// 点击当前活动tab，不触发事件
if (index == this.currentIndex) return
this.currentIndex = index
this.$emit('tabItemClick', item, index)
this.scrollByIndex()
}
}
}
</script>
<style lang="scss" scoped>
.tab {
height: 50px;
}
scroll-view {
box-sizing: border-box;
height: 100%;
}
::v-deep ::-webkit-scrollbar {
display: none
}
/* #ifndef APP-NVUE */
::-webkit-scrollbar,
::-webkit-scrollbar,
::-webkit-scrollbar {
display: none;
width: 0 !important;
height: 0 !important;
-webkit-appearance: none;
background: transparent;
}
/* #endif */
/* #ifdef H5 */
// 通过样式穿透，隐藏H5下，scroll-view下的滚动条
scroll-view ::v-deep ::-webkit-scrollbar {
display: none;
width: 0 !important;
height: 0 !important;
-webkit-appearance: none;
background: transparent;
}
/* #endif */
.scroll-view-content {
white-space: nowrap;
width: 100%;
position: relative;
.scroll-item-view {
width: 100%;
white-space: nowrap;
position: relative;
}
.scroll-item {
position: relative;
padding: 0 10px;
display: inline-block;
text-align: center;
color: rgba(255, 255, 255, 0.7);
}
.mar-r-38 {
margin-right: 10px;
}
.no-right {
margin: 0;
}
.scroll-tab-bar {
position: absolute;
bottom: 0;
z-index: 10;
}
}
</style>
\ No newline at end of file
package.json
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
"url": "git+https://github.com/sonofmagic/uni-app-vue3-tailwind-hbuilder-template.git" "url": "git+https://github.com/sonofmagic/uni-app-vue3-tailwind-hbuilder-template.git"
}, },
"keywords": [], "keywords": [],
"author": "", "author": "",
"license": "ISC", "license": "ISC",
"bugs": { "bugs": {
"url": "https://github.com/sonofmagic/uni-app-vue3-tailwind-hbuilder-template/issues" "url": "https://github.com/sonofmagic/uni-app-vue3-tailwind-hbuilder-template/issues"
......
pages/index/index.vue
...@@ -85,6 +85,7 @@ ...@@ -85,6 +85,7 @@
//获取首页轮播图 //获取首页轮播图
function getLbtList(pageSize : number, pageNo : number) { function getLbtList(pageSize : number, pageNo : number) {
const datas = { const datas = {
contentDisplay: "0",
contentType: yjjblbt, contentType: yjjblbt,
pageSize: pageSize, pageSize: pageSize,
pageNo: pageNo, pageNo: pageNo,
...@@ -106,6 +107,7 @@ ...@@ -106,6 +107,7 @@
//获取首页轮播图 //获取首页轮播图
function getRdList(pageSize : number, pageNo : number) { function getRdList(pageSize : number, pageNo : number) {
const datas = { const datas = {
contentDisplay: "0",
contentType: rdxw, contentType: rdxw,
pageSize: pageSize, pageSize: pageSize,
pageNo: pageNo, pageNo: pageNo,
...@@ -126,6 +128,7 @@ ...@@ -126,6 +128,7 @@
//获取首页轮播图 //获取首页轮播图
function getSxList(pageSize : number, pageNo : number) { function getSxList(pageSize : number, pageNo : number) {
const datas = { const datas = {
contentDisplay: "0",
contentType: sxxw, contentType: sxxw,
pageSize: pageSize, pageSize: pageSize,
pageNo: pageNo, pageNo: pageNo,
...@@ -147,6 +150,7 @@ ...@@ -147,6 +150,7 @@
//获取首页轮播图 //获取首页轮播图
function getTyList(pageSize : number, pageNo : number) { function getTyList(pageSize : number, pageNo : number) {
const datas = { const datas = {
contentDisplay: "0",
contentType: tyxw, contentType: tyxw,
pageSize: pageSize, pageSize: pageSize,
pageNo: pageNo, pageNo: pageNo,
...@@ -182,7 +186,7 @@ ...@@ -182,7 +186,7 @@
//详情页面 //详情页面
function goToDetails(item : any) { function goToDetails(item : any) {
if (item.contentOutLink) { if (item.contentOutLink) {
uni.navigateTo({ uni.navigateTo({
url: '/pages/web/index?webUrl=' + item.contentOutLink, url: '/pages/web/index?webUrl=' + item.contentOutLink,
}); });
......
pages/py/all-list/all-list.vue
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
<view class="news-list"> <view class="news-list">
<view v-for="(news, index) in dataList" :key="index" class="news-card" @click="goToDetails(news)"> <view v-for="(news, index) in dataList" :key="index" class="news-card" @click="goToDetails(news)">
<view class="news-content"> <view class="news-content">
<image class="news-image" :src="news.image" mode="aspectFill" /> <image v-if="news.image" class="news-image" :src="news.image" mode="aspectFill" />
<view class="news-info"> <view class="news-info">
<text class="news-title">{{ news.contentTitle }}</text> <text class="news-title">{{ news.contentTitle }}</text>
<text class="news-date">{{ news.contentDatetime }}</text> <text class="news-date">{{ news.contentDatetime }}</text>
...@@ -20,7 +20,7 @@ ...@@ -20,7 +20,7 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { ref } from 'vue'; import { ref, watch } from 'vue';
import { getNewsList } from "@/network/api/news.js"; import { getNewsList } from "@/network/api/news.js";
import { yjjblbt, rdxw, tyxw, sxxw, tzgg, qwfb, pyzq, zjjd, flfg, baseImageUrl } from "@/network/config.js"; import { yjjblbt, rdxw, tyxw, sxxw, tzgg, qwfb, pyzq, zjjd, flfg, baseImageUrl } from "@/network/config.js";
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app'; import { onPageScroll, onReachBottom } from '@dcloudio/uni-app';
...@@ -34,9 +34,9 @@ ...@@ -34,9 +34,9 @@
empty: { empty: {
tip: '~ 暂无相关数据 ~', // 提示 tip: '~ 暂无相关数据 ~', // 提示
} }
} }
const props = defineProps({ const props = defineProps({
dataValue: String, categoryId: Number,
}); });
//总条数 //总条数
const total = ref(0); const total = ref(0);
...@@ -57,11 +57,18 @@ ...@@ -57,11 +57,18 @@
dataList.value = []// 先置空列表,显示加载进度 dataList.value = []// 先置空列表,显示加载进度
getMescroll().resetUpScroll() // 再刷新列表数据 getMescroll().resetUpScroll() // 再刷新列表数据
} }
//categoryId变化时,重置列表数据
watch(() => props.categoryId, (newVal, oldVal) => {
dataList.value = [];
getMescroll().resetUpScroll();
})
//获取新闻热点列表 //获取新闻热点列表
function getList(isDown : boolean, mescroll : any, pageSize : number, pageNo : number) { function getList(isDown : boolean, mescroll : any, pageSize : number, pageNo : number) {
const datas = { const datas = {
contentType: props.dataValue, contentDisplay: "0",
categoryId: props.categoryId,
pageSize: pageSize, pageSize: pageSize,
pageNo: pageNo, pageNo: pageNo,
}; };
......
pages/py/index.vue
<template> <template>
<view class="app-container flex flex-col"> <view class="app-container flex flex-col">
<view class="nav-bar fixed w-full top-0 z-50"> <view class="nav-bar fixed w-full top-0 z-50">
<view class="tab-container"> <!-- <scroll-view scroll-x="true" class="tab-scroll">
<view v-for="(tab, index) in tabs" :key="index" class="tab-item" <view class="tab-container">
:class="{'tab-active': activeTab === index}" @click="changeTabs(index)"> <view v-for="(tab, index) in tabs" :key="index" class="tab-item"
{{ tab.categoryTitle }} :class="{'tab-active': activeTab === index}" @click="changeTabs(index,tab)">
{{ tab.categoryTitle }}
</view>
</view> </view>
</scroll-view> -->
<view class="tab-content">
<tabsTop :list="tabList" @tabItemClick="itemClick" activeWeight='600'></tabsTop>
</view> </view>
</view> </view>
<view class="flex-1 h-0"> <view class="flex-1 h-0">
<all-list class="h-full" v-if="activeTab == 0" :dataValue="qwfb"></all-list> <all-list class="h-full" :categoryId="categoryId"></all-list>
<!-- <all-list class="h-full" v-if="activeTab == 0" :dataValue="qwfb"></all-list>
<all-list class="h-full" v-if="activeTab == 1" :dataValue="pyzq"></all-list> <all-list class="h-full" v-if="activeTab == 1" :dataValue="pyzq"></all-list>
<all-list class="h-full" v-if="activeTab == 2" :dataValue="zjjd"></all-list> <all-list class="h-full" v-if="activeTab == 2" :dataValue="zjjd"></all-list>
<all-list class="h-full" v-if="activeTab == 3" :dataValue="flfg"></all-list> <all-list class="h-full" v-if="activeTab == 3" :dataValue="flfg"></all-list>
<dt-list class="h-full" v-if="activeTab == 4" :dataValue="dtsy"></dt-list> <dt-list class="h-full" v-if="activeTab == 4" :dataValue="dtsy"></dt-list> -->
</view> </view>
</view> </view>
</template> </template>
...@@ -26,16 +34,13 @@ ...@@ -26,16 +34,13 @@
import dtList from './dt-list/dt-list.vue'; import dtList from './dt-list/dt-list.vue';
import { yjjblbt, rdxw, tyxw, sxxw, tzgg, qwfb, pyzq, zjjd, flfg, dtsy, sxhlwlhpypt, baseImageUrl } from "@/network/config.js"; import { yjjblbt, rdxw, tyxw, sxxw, tzgg, qwfb, pyzq, zjjd, flfg, dtsy, sxhlwlhpypt, baseImageUrl } from "@/network/config.js";
import { getTab } from '@/network/api/news'; import { getTab } from '@/network/api/news';
import tabsTop from '@/components/yixuan-tabs/yixuan-tabs.vue'
const activeTab = ref(0); const activeTab = ref(0);
// const tabs = [ const categoryId = ref();
// '权威发布',
// '辟谣专区',
// '专家解读',
// '法律法规',
// '读图识谣'
// ];
const tabs = ref([]); const tabs = ref([]);
const tabList = ref([]);
getTab(sxhlwlhpypt).then((res) => { getTab(sxhlwlhpypt).then((res) => {
console.log(res); console.log(res);
...@@ -46,38 +51,31 @@ ...@@ -46,38 +51,31 @@
const filterData = data.filter( const filterData = data.filter(
(item) => (item) =>
item.categoryTitle !== "轮播图" && item.categoryTitle !== "轮播图" &&
item.categoryTitle !== "山西互联网联合辟谣平台"&& item.categoryTitle !== "山西互联网联合辟谣平台" &&
item.categoryTitle !== "首页" item.categoryTitle !== "首页"
); );
categoryId.value = filterData[0].id;
tabs.value = filterData; tabs.value = filterData;
// categoryId.value = data[0].id;
// tabs.value = data;
//为tabList添加name属性
tabList.value = filterData.map((item : any) => {
return {
name: item.categoryTitle,
id: item.id
};
});
}); });
function itemClick(item : any, index : number) {
categoryId.value = item.id;
activeTab.value = index;
};
function changeTabs(index : number) { // function changeTabs(index : number, tab : number) {
switch (index) { // categoryId.value = tab.id;
case 0: { // activeTab.value = index;
activeTab.value = 0; // }
break
}
case 1: {
activeTab.value = 1;
break
}
case 2: {
activeTab.value = 2;
break
}
case 3: {
activeTab.value = 3;
break
}
case 4: {
activeTab.value = 4;
break
}
}
}
</script> </script>
<style> <style>
...@@ -85,10 +83,23 @@ ...@@ -85,10 +83,23 @@
height: 100%; height: 100%;
} }
.tab-content {
width: 100%;
}
.tab-scroll {
overflow-x: auto;
/* 允许水平滚动 */
white-space: nowrap;
/* 防止选项卡换行 */
}
.app-container { .app-container {
width: 750rpx; width: 750rpx;
min-height: 100%; min-height: 100%;
background-color: #f5f5f5; background-color: #f5f5f5;
display: flex;
/* 使用Flexbox布局 */
} }
.nav-bar { .nav-bar {
...@@ -101,8 +112,8 @@ ...@@ -101,8 +112,8 @@
.tab-container { .tab-container {
height: 100%; height: 100%;
display: flex; display: flex;
justify-content: space-around; /* justify-content: space-around; */
align-items: center; /* align-items: center; */
} }
.tab-item { .tab-item {
...@@ -111,6 +122,10 @@ ...@@ -111,6 +122,10 @@
font-size: 14px; font-size: 14px;
color: rgba(255, 255, 255, 0.7); color: rgba(255, 255, 255, 0.7);
transition: all 0.3s; transition: all 0.3s;
flex-shrink: 0;
/* 防止选项卡缩小 */
margin-right: 10px;
/* 选项卡之间的间距 */
} }
.tab-active { .tab-active {
......
pages/wm/index.vue
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
</view> </view>
<view class="message-list"> <view class="message-list">
<view v-for="item in hotList" :key="item.id" class="message-item" @click="goToDetails(item.id)"> <view v-for="item in hotList" :key="item.id" class="message-item" @click="goToDetails(item.id)">
<text class="title">{{ item.title }}</text> <text class="title line-clamp-2">{{ item.title }}</text>
<view class="message-info"> <view class="message-info">
<text class="date">{{ item.contentDatetime }}</text> <text class="date">{{ item.contentDatetime }}</text>
<text <text
...@@ -147,7 +147,6 @@ ...@@ -147,7 +147,6 @@
url: '/pages_wm/modules/submit/index', url: '/pages_wm/modules/submit/index',
}); });
} }
</script> </script>
<style> <style>
page { page {
...@@ -336,6 +335,10 @@ ...@@ -336,6 +335,10 @@
font-size: 14px; font-size: 14px;
font-weight: 500; font-weight: 500;
flex: 1; flex: 1;
-webkit-line-clamp: 2;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
} }
.department { .department {
...@@ -348,6 +351,11 @@ ...@@ -348,6 +351,11 @@
color: #4b5563; color: #4b5563;
margin-bottom: 16rpx; margin-bottom: 16rpx;
display: block; display: block;
overflow: hidden;
-webkit-line-clamp: 3;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
} }
.status-tag { .status-tag {
......
pages/zx/index.vue
...@@ -2,19 +2,23 @@ ...@@ -2,19 +2,23 @@
<view class="app-container flex flex-col"> <view class="app-container flex flex-col">
<view class="nav-bar fixed w-full top-0 z-50"> <view class="nav-bar fixed w-full top-0 z-50">
<view class="tab-container"> <!-- <view class="tab-container">
<view v-for="(tab, index) in tabs" :key="index" class="tab-item" <view v-for="(tab, index) in tabs" :key="index" class="tab-item"
:class="{'tab-active': activeTab === index}" @click="changeTabs(index)"> :class="{'tab-active': activeTab === index}" @click="changeTabs(index,tab)">
{{ tab.categoryTitle }} {{ tab.categoryTitle }}
</view> </view>
</view> -->
<view class="tab-content">
<tabsTop :list="tabList" @tabItemClick="itemClick" activeWeight='600'></tabsTop>
</view> </view>
</view> </view>
<view class="flex-1 h-0"> <view class="flex-1 h-0">
<news-list class="h-full" v-if="activeTab == 0" :dataValue="rdxw"></news-list> <!-- <news-list class="h-full" v-if="activeTab == 0" :dataValue="rdxw"></news-list> -->
<news-list class="h-full" v-if="activeTab == 1" :dataValue="sxxw"></news-list> <news-list class="h-full" :categoryId="categoryId"></news-list>
<!-- <news-list class="h-full" v-if="activeTab == 1" :dataValue="sxxw"></news-list>
<news-list class="h-full" v-if="activeTab == 2" :dataValue="tyxw"></news-list> <news-list class="h-full" v-if="activeTab == 2" :dataValue="tyxw"></news-list>
<tz-list class="h-full" v-if="activeTab == 3" :dataValue="tzgg"></tz-list> <tz-list class="h-full" v-if="activeTab == 3" :dataValue="tzgg"></tz-list> -->
</view> </view>
</view> </view>
...@@ -27,46 +31,56 @@ ...@@ -27,46 +31,56 @@
import tzList from './tz-list/tz-list.vue'; import tzList from './tz-list/tz-list.vue';
import { yjjblbt, rdxw, tyxw, sxxw, tzgg, tyshlwyjzhhjbzx, baseImageUrl } from "@/network/config.js"; import { yjjblbt, rdxw, tyxw, sxxw, tzgg, tyshlwyjzhhjbzx, baseImageUrl } from "@/network/config.js";
import { getTab } from '@/network/api/news'; import { getTab } from '@/network/api/news';
const activeTab = ref(0); import tabsTop from '@/components/yixuan-tabs/yixuan-tabs.vue'
// const tabs = [
// '新闻热点',
// '山西新闻',
// '太原新闻',
// '通知公告'
// ];
const activeTab = ref(0);
const categoryId = ref();
const tabs = ref([]); const tabs = ref([]);
const tabList = ref([]);
getTab(tyshlwyjzhhjbzx).then((res) => { getTab(tyshlwyjzhhjbzx).then((res) => {
console.log(res);
const data = res.data.rows; const data = res.data.rows;
// //用data内的categorySort排序 // //用data内的categorySort排序
data.sort((a, b) => a.categorySort - b.categorySort); data.sort((a, b) => a.categorySort - b.categorySort);
//将data内categoryTitle等于“权威发布”和“辟谣专区”和“轮播图”的数据过滤不在navItems.value中显示 //将data内categoryTitle等于“权威发布”和“辟谣专区”和“轮播图”的数据过滤不在navItems.value中显示
const filterData = data.filter((item) => item.categoryTitle !== "轮播图" && item.categoryTitle !== "首页"); const filterData = data.filter((item) => item.categoryTitle !== "轮播图" && item.categoryTitle !== "首页");
categoryId.value = filterData[0].id;
tabs.value = filterData; tabs.value = filterData;
//为tabList添加name属性
tabList.value = filterData.map((item : any) => {
return {
name: item.categoryTitle,
id: item.id
};
});
}); });
function changeTabs(index : number) { function itemClick(item : any, index : number) {
switch (index) { categoryId.value = item.id;
case 0: { activeTab.value = index;
activeTab.value = 0; };
break
} // function changeTabs(index : number, tab : any) {
case 1: { // categoryId.value = tab.id;
activeTab.value = 1; // switch (index) {
break // case 0: {
} // activeTab.value = 0;
case 2: { // break
activeTab.value = 2; // }
break // case 1: {
} // activeTab.value = 1;
case 3: { // break
activeTab.value = 3; // }
break // case 2: {
} // activeTab.value = 2;
} // break
} // }
// case 3: {
// activeTab.value = 3;
// break
// }
// }
// }
</script> </script>
<style scoped> <style scoped>
......
pages/zx/news-list/news-list.vue
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
<view class="news-count">共 {{ total }} 条新闻</view> <view class="news-count">共 {{ total }} 条新闻</view>
<view class="news-list"> <view class="news-list">
<view v-for="(item, index) in dataList" :key="index" class="news-item" @click="goToDetails(item)"> <view v-for="(item, index) in dataList" :key="index" class="news-item" @click="goToDetails(item)">
<view class="news-image"> <view v-if="item.image" class="news-image">
<image :src="item.image" :alt="item.contentTitle" mode="aspectFill" /> <image :src="item.image" :alt="item.contentTitle" mode="aspectFill" />
</view> </view>
<view class="news-content"> <view class="news-content">
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { ref } from 'vue'; import { ref, watch } from 'vue';
import { getNewsList } from "@/network/api/news.js"; import { getNewsList } from "@/network/api/news.js";
import { yjjblbt, rdxw, tyxw, sxxw, tzgg, baseImageUrl } from "@/network/config.js"; import { yjjblbt, rdxw, tyxw, sxxw, tzgg, baseImageUrl } from "@/network/config.js";
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app'; import { onPageScroll, onReachBottom } from '@dcloudio/uni-app';
...@@ -38,7 +38,7 @@ ...@@ -38,7 +38,7 @@
} }
} }
const props = defineProps({ const props = defineProps({
dataValue: String, categoryId: Number,
}); });
//总条数 //总条数
const total = ref(0); const total = ref(0);
...@@ -60,10 +60,17 @@ ...@@ -60,10 +60,17 @@
getMescroll().resetUpScroll() // 再刷新列表数据 getMescroll().resetUpScroll() // 再刷新列表数据
} }
//categoryId变化时,重置列表数据
watch(() => props.categoryId, (newVal, oldVal) => {
dataList.value = [];
getMescroll().resetUpScroll();
})
//获取新闻热点列表 //获取新闻热点列表
function getList(isDown : boolean, mescroll : any, pageSize : number, pageNo : number) { function getList(isDown : boolean, mescroll : any, pageSize : number, pageNo : number) {
const datas = { const datas = {
contentType: props.dataValue, contentDisplay: "0",
categoryId: props.categoryId,
pageSize: pageSize, pageSize: pageSize,
pageNo: pageNo, pageNo: pageNo,
}; };
......
pages_py/modules/detail/index.vue
...@@ -87,6 +87,7 @@ ...@@ -87,6 +87,7 @@
//获取相关列表 //获取相关列表
function getNewsLists() { function getNewsLists() {
const datas = { const datas = {
contentDisplay: "0",
contentType: getContentType(), contentType: getContentType(),
pageSize: 5, pageSize: 5,
pageNo: 1, pageNo: 1,
......
pages_wm/modules/detail/index.vue
...@@ -10,17 +10,17 @@ ...@@ -10,17 +10,17 @@
:class="['reply-status', detail.replyStatus === '1' ? 'replied' : 'pending']">{{ detail.replyStatus == "1" ? "已回复" : "未回复" }}</text> :class="['reply-status', detail.replyStatus === '1' ? 'replied' : 'pending']">{{ detail.replyStatus == "1" ? "已回复" : "未回复" }}</text>
<!-- <text :class="detail.replyStatus == '1' <!-- <text :class="detail.replyStatus == '1'
?'status-tag':'status-tag-red'">{{ detail.replyStatus == "1" ? "已回复" : "未回复" }}</text> --> ?'status-tag':'status-tag-red'">{{ detail.replyStatus == "1" ? "已回复" : "未回复" }}</text> -->
<text class="info-text">留言人: {{ detail.name }}</text> <text class="info-text">留言人: ***{{'&nbsp;'}}</text>
<text class="divider">|</text> <text class="divider">|</text>
<text class="info-text">{{ detail.contentDatetime }}</text> <text class="info-text">{{detail.contentDatetime}}</text>
</view> </view>
<!-- 诉求内容 --> <!-- 诉求内容 -->
<view class="content-section"> <view class="content-section">
<text class="section-title">问题内容：</text> <text class="section-title">问题内容：</text>
<rich-text class="description" :nodes="detail.content"></rich-text> <text class="description">{{detail.content}}</text>
<!-- <textarea class="textarea" fixed disabled auto-height :value="detail.content"></textarea> -->
</view> </view>
<!-- 附件列表 --> <!-- 附件列表 -->
<!-- <view :v-if="attachments.length>0" class="attachments-section"> <!-- <view :v-if="attachments.length>0" class="attachments-section">
<text class="section-title">相关附件</text> <text class="section-title">相关附件</text>
...@@ -37,7 +37,10 @@ ...@@ -37,7 +37,10 @@
<!-- 官方回复 --> <!-- 官方回复 -->
<view class="reply-card" v-if="detail.reply != null"> <view class="reply-card" v-if="detail.reply != null">
<text class="section-title2">官方回复</text> <text class="section-title2">官方回复</text>
<rich-text class="reply-text" :nodes="detail.reply"></rich-text> <text class="description" >{{detail.reply}}</text>
<!-- <rich-text class="reply-text" :nodes="detail.reply"></rich-text> -->
<!-- <textarea class="textarea" fixed disabled auto-height :value="detail.reply"></textarea> -->
</view> </view>
</view> </view>
</view> </view>
...@@ -55,7 +58,7 @@ ...@@ -55,7 +58,7 @@
detail.value = response.data; detail.value = response.data;
}); });
}); });
const attachments = ref([ const attachments = ref([
{ {
name: '现场照片1.jpeg', name: '现场照片1.jpeg',
...@@ -192,9 +195,9 @@ ...@@ -192,9 +195,9 @@
} }
.info-text { .info-text {
color: #666666; color: #999;
font-size: 14px; font-size: 25rpx;
margin-left: 20rpx; margin-left: 10rpx;
} }
.divider { .divider {
...@@ -227,7 +230,7 @@ ...@@ -227,7 +230,7 @@
.description { .description {
color: #333333; color: #333333;
font-size: 14px; font-size: 14px;
line-height: 1.6; line-height: 1.8;
margin-bottom: 30rpx; margin-bottom: 30rpx;
display: block; display: block;
} }
...@@ -314,19 +317,20 @@ ...@@ -314,19 +317,20 @@
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
} }
.reply-status { .reply-status {
font-size: 12px; font-size: 12px;
padding: 2rpx 16rpx; padding: 2rpx 16rpx;
border-radius: 32rpx; border-radius: 32rpx;
display: inline-block; display: inline-block;
} }
.replied { .replied {
color: #52C41A; color: #52C41A;
background-color: #F6FFED; background-color: #F6FFED;
border: 1px solid #B7EB8F; border: 1px solid #B7EB8F;
} }
.pending { .pending {
color: #FAAD14; color: #FAAD14;
background-color: #FFF7E6; background-color: #FFF7E6;
......
pages_wm/modules/message/index.vue
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
<text class="message-title">{{ item.title }}</text> <text class="message-title">{{ item.title }}</text>
<text class="message-content">{{ item.content }}</text> <text class="message-content">{{ item.content }}</text>
<view class="message-footer"> <view class="message-footer">
<text class="message-time">留言人：{{ item.name }} {{ item.contentDatetime }}</text> <text class="message-time">留言人：*** {{'&nbsp;&nbsp;'+ item.contentDatetime }}</text>
<text <text
:class="['reply-status', item.replyStatus === '1' ? 'replied' : 'pending']">{{ item.replyStatus == "1" ? "已回复" : "未回复" }}</text> :class="['reply-status', item.replyStatus === '1' ? 'replied' : 'pending']">{{ item.replyStatus == "1" ? "已回复" : "未回复" }}</text>
</view> </view>
...@@ -77,7 +77,7 @@ ...@@ -77,7 +77,7 @@
} }
function search(word) { function search(word) {
searchKeyword.value=word; searchKeyword.value = word;
dataList.value = []; // 先清空列表,显示加载进度 dataList.value = []; // 先清空列表,显示加载进度
getMescroll().resetUpScroll(); getMescroll().resetUpScroll();
} }
...@@ -148,6 +148,13 @@ ...@@ -148,6 +148,13 @@
font-weight: 500; font-weight: 500;
color: #333333; color: #333333;
margin-bottom: 16rpx; margin-bottom: 16rpx;
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
word-wrap: break-word;
white-space: normal !important;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
} }
.message-content { .message-content {
...@@ -156,12 +163,20 @@ ...@@ -156,12 +163,20 @@
color: #666666; color: #666666;
line-height: 1.6; line-height: 1.6;
margin-bottom: 20rpx; margin-bottom: 20rpx;
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
word-wrap: break-word;
white-space: normal !important;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
} }
.message-footer { .message-footer {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
} }
.message-time { .message-time {
......
pages_wm/modules/recover/index.vue
...@@ -7,20 +7,20 @@ ...@@ -7,20 +7,20 @@
<uni-search-bar v-model="searchKeyword" placeholder="搜索回复内容" :radius="16" bgColor="#ffffff" <uni-search-bar v-model="searchKeyword" placeholder="搜索回复内容" :radius="16" bgColor="#ffffff"
cancelButton="none" @input="search" :focus="true"></uni-search-bar> cancelButton="none" @input="search" :focus="true"></uni-search-bar>
</view> </view>
<!-- top="xxx"下拉布局往下偏移,防止被悬浮菜单遮住 --> <!-- top="xxx"下拉布局往下偏移,防止被悬浮菜单遮住 -->
<mescroll-body @init="mescrollInit" top="0" @down="downCallback" :up="upOption" @up="upCallback" <mescroll-body @init="mescrollInit" top="0" @down="downCallback" :up="upOption" @up="upCallback"
@emptyclick="emptyClick" :down="downOption"> @emptyclick="emptyClick" :down="downOption">
<view class="container h-full"> <view class="container h-full">
<view class="news-count">共 {{ total }} 条新闻</view> <view class="news-count">共 {{ total }} 条新闻</view>
<view class="message-list"> <view class="message-list">
<view v-for="(item, index) in dataList" :key="index" class="message-card" <view v-for="(item, index) in dataList" :key="index" class="message-card"
@click="goToDetails(item.id)"> @click="goToDetails(item.id)">
<text class="message-title">{{ item.title }}</text> <text class="message-title">{{ item.title }}</text>
<text class="message-content">{{ item.content }}</text> <text class="message-content">{{ item.content }}</text>
<view class="message-footer"> <view class="message-footer">
<text class="message-time">留言人：{{ item.name }} {{ item.contentDatetime }}</text> <text class="message-time">留言人：***{{'&nbsp;&nbsp;'+item.contentDatetime }}</text>
<text <text
:class="['reply-status', item.replyStatus === '1' ? 'replied' : 'pending']">{{ item.replyStatus == "1" ? "已回复" : "未回复" }}</text> :class="['reply-status', item.replyStatus === '1' ? 'replied' : 'pending']">{{ item.replyStatus == "1" ? "已回复" : "未回复" }}</text>
</view> </view>
...@@ -46,35 +46,35 @@ ...@@ -46,35 +46,35 @@
tip: '~ 暂无相关数据 ~' tip: '~ 暂无相关数据 ~'
} }
} }
//总条数 //总条数
const total = ref(0); const total = ref(0);
const dataList = ref([]); const dataList = ref([]);
const searchKeyword = ref(''); const searchKeyword = ref('');
//下拉刷新 //下拉刷新
const downCallback = (mescroll : any) => { const downCallback = (mescroll : any) => {
dataList.value = []; dataList.value = [];
mescroll.resetUpScroll(); // 重置列表为第一页 (自动执行 page.num=1, 再触发upCallback方法 ) mescroll.resetUpScroll(); // 重置列表为第一页 (自动执行 page.num=1, 再触发upCallback方法 )
} }
//上拉加载 //上拉加载
const upCallback = (mescroll : any) => { const upCallback = (mescroll : any) => {
getList(false, mescroll, mescroll.size, mescroll.num); getList(false, mescroll, mescroll.size, mescroll.num);
} }
//点击空布局按钮的回调 //点击空布局按钮的回调
const emptyClick = () => { const emptyClick = () => {
dataList.value = []// 先置空列表,显示加载进度 dataList.value = []// 先置空列表,显示加载进度
getMescroll().resetUpScroll() // 再刷新列表数据 getMescroll().resetUpScroll() // 再刷新列表数据
} }
function search(word) { function search(word) {
searchKeyword.value=word; searchKeyword.value = word;
dataList.value = []; // 先清空列表,显示加载进度 dataList.value = []; // 先清空列表,显示加载进度
getMescroll().resetUpScroll(); getMescroll().resetUpScroll();
} }
//获取新闻热点列表 //获取新闻热点列表
function getList(isDown : boolean, mescroll : any, pageSize : number, pageNo : number) { function getList(isDown : boolean, mescroll : any, pageSize : number, pageNo : number) {
const datas = { const datas = {
...@@ -140,6 +140,13 @@ ...@@ -140,6 +140,13 @@
font-weight: 500; font-weight: 500;
color: #333333; color: #333333;
margin-bottom: 16rpx; margin-bottom: 16rpx;
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
word-wrap: break-word;
white-space: normal !important;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
} }
.message-content { .message-content {
...@@ -148,6 +155,13 @@ ...@@ -148,6 +155,13 @@
color: #666666; color: #666666;
line-height: 1.6; line-height: 1.6;
margin-bottom: 20rpx; margin-bottom: 20rpx;
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
word-wrap: break-word;
white-space: normal !important;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
} }
.message-footer { .message-footer {
...@@ -179,6 +193,7 @@ ...@@ -179,6 +193,7 @@
background-color: #FFF7E6; background-color: #FFF7E6;
border: 1px solid #FFE58F; border: 1px solid #FFE58F;
} }
.news-count { .news-count {
text-align: center; text-align: center;
font-size: 13px; font-size: 13px;
......
pages_wm/modules/submit/index.vue
...@@ -3,16 +3,16 @@ ...@@ -3,16 +3,16 @@
<view class="container"> <view class="container">
<!-- 基础表单校验 --> <!-- 基础表单校验 -->
<uni-forms ref="valiForm" :rules="rules" :model="form"> <uni-forms ref="valiForm" :rules="rules" :model="form">
<uni-forms-item label-width="80px" label="姓名" required name="name"> <uni-forms-item label-width="78px" label="姓名" required name="name">
<uni-easyinput v-model="form.name" placeholder="请输入姓名" /> <uni-easyinput v-model="form.name" placeholder="请输入姓名" />
</uni-forms-item> </uni-forms-item>
<uni-forms-item label-width="80px" label="留言标题" required name="title"> <uni-forms-item label-width="78px" label="留言标题" required name="title">
<uni-easyinput v-model="form.title" placeholder="请输入留言标题" /> <uni-easyinput v-model="form.title" placeholder="请输入留言标题" />
</uni-forms-item> </uni-forms-item>
<uni-forms-item label-width="80px" label="留言内容" required name="content"> <uni-forms-item label-width="78px" label="留言内容" required name="content">
<uni-easyinput type="textarea" v-model="form.content" placeholder="请输入留言内容" /> <uni-easyinput type="textarea" v-model="form.content" placeholder="请输入留言内容" />
</uni-forms-item> </uni-forms-item>
<uni-forms-item label-width="80px" label="联系电话" required name="phoneNumber"> <uni-forms-item label-width="78px" label="联系电话" required name="phoneNumber">
<uni-easyinput v-model="form.phoneNumber" placeholder="请输入联系电话" /> <uni-easyinput v-model="form.phoneNumber" placeholder="请输入联系电话" />
</uni-forms-item> </uni-forms-item>
<!-- <view class="form-item"> <!-- <view class="form-item">
......
pages_zx/modules/detail/index.vue
...@@ -87,6 +87,7 @@ ...@@ -87,6 +87,7 @@
//获取相关列表 //获取相关列表
function getNewsLists() { function getNewsLists() {
const datas = { const datas = {
contentDisplay: "0",
contentType: getContentType(), contentType: getContentType(),
pageSize: 5, pageSize: 5,
pageNo: 1, pageNo: 1,
......
uni_modules/uni-segmented-control/changelog.md 0 → 100644
## 1.2.3（2024-04-02）
- 修复 修复在微信小程序下inactiveColor失效bug
## 1.2.2（2024-03-28）
- 修复 在vue2下:style动态绑定导致编译失败的bug
## 1.2.1（2024-03-20）
- 新增 inActiveColor属性，可供配置未激活时的颜色
## 1.2.0（2021-11-19）
- 优化 组件UI，并提供设计资源，详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移，详见:[https://uniapp.dcloud.io/component/uniui/uni-segmented-control](https://uniapp.dcloud.io/component/uniui/uni-segmented-control)
## 1.1.0（2021-07-30）
- 组件兼容 vue3，如何创建vue3项目，详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 1.0.5（2021-05-12）
- 新增 项目示例地址
## 1.0.4（2021-02-05）
- 调整为uni_modules目录规范
uni_modules/uni-segmented-control/components/uni-segmented-control/uni-segmented-control.vue 0 → 100644
<template>
<view :class="[styleType === 'text'?'segmented-control--text' : 'segmented-control--button' ]"
:style="{ borderColor: styleType === 'text' ? '' : activeColor }" class="segmented-control">
<view v-for="(item, index) in values" :class="[styleType === 'text' ? '' : 'segmented-control__item--button',
index === 0 && styleType === 'button' ? 'segmented-control__item--button--first' : '',
index === values.length - 1 && styleType === 'button' ? 'segmented-control__item--button--last':'']" :key="index"
:style="{backgroundColor: index === currentIndex && styleType === 'button' ? activeColor : styleType === 'button' ?inActiveColor:'transparent', borderColor: index === currentIndex && styleType === 'text' || styleType === 'button' ? activeColor : inActiveColor}"
class="segmented-control__item" @click="_onClick(index)">
<view>
<text
:style="{color:index === currentIndex? styleType === 'text'? activeColor: '#fff': styleType === 'text'? '#000': activeColor}"
class="segmented-control__text"
:class="styleType === 'text' && index === currentIndex ? 'segmented-control__item--text': ''">{{ item }}</text>
</view>
</view>
</view>
</template>
<script>
/**
* SegmentedControl 分段器
* @description 用作不同视图的显示
* @tutorial https://ext.dcloud.net.cn/plugin?id=54
* @property {Number} current 当前选中的tab索引值，从0计数
* @property {String} styleType = [button|text] 分段器样式类型
* @value button 按钮类型
* @value text 文字类型
* @property {String} activeColor 选中的标签背景色与边框颜色
* @property {String} inActiveColor 未选中的标签背景色与边框颜色
* @property {Array} values 选项数组
* @event {Function} clickItem 组件触发点击事件时触发，e={currentIndex}
*/
export default {
name: 'UniSegmentedControl',
emits: ['clickItem'],
props: {
current: {
type: Number,
default: 0
},
values: {
type: Array,
default () {
return []
}
},
activeColor: {
type: String,
default: '#2979FF'
},
inActiveColor: {
type: String,
default: 'transparent'
},
styleType: {
type: String,
default: 'button'
}
},
data() {
return {
currentIndex: 0
}
},
watch: {
current(val) {
if (val !== this.currentIndex) {
this.currentIndex = val
}
}
},
computed: {},
created() {
this.currentIndex = this.current
},
methods: {
_onClick(index) {
if (this.currentIndex !== index) {
this.currentIndex = index
this.$emit('clickItem', {
currentIndex: index
})
}
}
}
}
</script>
<style lang="scss" scoped>
.segmented-control {
/* #ifndef APP-NVUE */
display: flex;
box-sizing: border-box;
/* #endif */
flex-direction: row;
height: 36px;
overflow: hidden;
/* #ifdef H5 */
cursor: pointer;
/* #endif */
}
.segmented-control__item {
/* #ifndef APP-NVUE */
display: inline-flex;
box-sizing: border-box;
/* #endif */
position: relative;
flex: 1;
justify-content: center;
align-items: center;
}
.segmented-control__item--button {
border-style: solid;
border-top-width: 1px;
border-bottom-width: 1px;
border-right-width: 1px;
border-left-width: 0;
}
.segmented-control__item--button--first {
border-left-width: 1px;
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
.segmented-control__item--button--last {
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
}
.segmented-control__item--text {
border-bottom-style: solid;
border-bottom-width: 2px;
padding: 6px 0;
}
.segmented-control__text {
font-size: 14px;
line-height: 20px;
text-align: center;
}
</style>
uni_modules/uni-segmented-control/package.json 0 → 100644
{
"id": "uni-segmented-control",
"displayName": "uni-segmented-control 分段器",
"version": "1.2.3",
"description": "分段器由至少 2 个分段控件组成，用作不同视图的显示",
"keywords": [
"uni-ui",
"uniui",
"分段器",
"segement",
"顶部选择"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": ""
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui",
"type": "component-vue"
},
"uni_modules": {
"dependencies": ["uni-scss"],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y",
"alipay": "n"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y"
},
"快应用": {
"华为": "u",
"联盟": "u"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}
\ No newline at end of file
uni_modules/uni-segmented-control/readme.md 0 → 100644
## SegmentedControl 分段器
> **组件名：uni-segmented-control**
> 代码块： `uSegmentedControl`
用作不同视图的显示
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-segmented-control)
#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment