diff --git a/.eslintrc.js b/.eslintrc.js new file mode 100644 index 0000000..115cc02 --- /dev/null +++ b/.eslintrc.js @@ -0,0 +1,31 @@ +/* + * Eslint config file + * Documentation: https://eslint.org/docs/user-guide/configuring/ + * Install the Eslint extension before using this feature. + */ +module.exports = { + env: { + es6: true, + browser: true, + node: true, + }, + ecmaFeatures: { + modules: true, + }, + parserOptions: { + ecmaVersion: 2018, + sourceType: 'module', + }, + globals: { + wx: true, + App: true, + Page: true, + getCurrentPages: true, + getApp: true, + Component: true, + requirePlugin: true, + requireMiniProgram: true, + }, + // extends: 'eslint:recommended', + rules: {}, +} diff --git a/README.md b/README.md index b0b5df8..c046c06 100644 --- a/README.md +++ b/README.md @@ -1,2 +1,4 @@ -# WeChatApps - +##自己替换/images四张图片,底部导航栏用,名字别变,单张图片大小小于40KB,否则报错。 +##文章在models/articleManager.js 自己照着替换文字。 +##大图片是网页直链图片,不要想着本地,会报错。替换大图片自己找网页直链图片。 +##未提及文件不要瞎改,除非你会。直接提交被判抄袭概不负责。 \ No newline at end of file diff --git a/app.js b/app.js new file mode 100644 index 0000000..32d5fd9 --- /dev/null +++ b/app.js @@ -0,0 +1,15 @@ +// app.js +const { ImageManager } = require('./utils/imageManager'); + +App({ + onLaunch() { + // 初始化图片管理器 + this.globalData = { + imageManager: new ImageManager() + }; + }, + + globalData: { + imageManager: null + } +}) diff --git a/app.json b/app.json new file mode 100644 index 0000000..90a637e --- /dev/null +++ b/app.json @@ -0,0 +1,45 @@ +{ + "pages": [ + "pages/index/index", + "pages/article/article" + ], + "window": { + "navigationBarTextStyle": "black", + "navigationStyle": "custom" + }, + "tabBar": { + "color": "#999999", + "selectedColor": "#1296db", + "backgroundColor": "#ffffff", + "borderStyle": "black", + "list": [ + { + "pagePath": "pages/index/index", + "text": "主页", + "iconPath": "images/home.png", + "selectedIconPath": "images/home-active.png" + }, + { + "pagePath": "pages/article/article", + "text": "文章", + "iconPath": "images/article.png", + "selectedIconPath": "images/article-active.png" + } + ] + }, + "style": "v2", + "renderer": "skyline", + "rendererOptions": { + "skyline": { + "defaultDisplayBlock": true, + "defaultContentBox": true, + "tagNameStyleIsolation": "legacy", + "disableABTest": true, + "sdkVersionBegin": "3.0.0", + "sdkVersionEnd": "15.255.255" + } + }, + "componentFramework": "glass-easel", + "sitemapLocation": "sitemap.json", + "lazyCodeLoading": "requiredComponents" +} \ No newline at end of file diff --git a/app.wxss b/app.wxss new file mode 100644 index 0000000..bc24d89 --- /dev/null +++ b/app.wxss @@ -0,0 +1,17 @@ +/**app.wxss**/ +page { + font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, + Segoe UI, Arial, Roboto, 'PingFang SC', 'miui', 'Hiragino Sans GB', 'Microsoft Yahei', + sans-serif; + background-color: #f6f6f6; + font-size: 32rpx; + width: 100%; + overflow-x: hidden; +} + +.container { + display: flex; + flex-direction: column; + align-items: stretch; + box-sizing: border-box; +} diff --git a/components/article-card/article-card.js b/components/article-card/article-card.js new file mode 100644 index 0000000..e69de29 diff --git a/components/article-card/article-card.json b/components/article-card/article-card.json new file mode 100644 index 0000000..e8cfaaf --- /dev/null +++ b/components/article-card/article-card.json @@ -0,0 +1,4 @@ +{ + "component": true, + "usingComponents": {} +} \ No newline at end of file diff --git a/components/article-card/article-card.wxml b/components/article-card/article-card.wxml new file mode 100644 index 0000000..e69de29 diff --git a/components/article-card/article-card.wxss b/components/article-card/article-card.wxss new file mode 100644 index 0000000..e69de29 diff --git a/components/navigation-bar/navigation-bar.js b/components/navigation-bar/navigation-bar.js new file mode 100644 index 0000000..eb1770e --- /dev/null +++ b/components/navigation-bar/navigation-bar.js @@ -0,0 +1,102 @@ +Component({ + options: { + multipleSlots: true // 在组件定义时的选项中启用多slot支持 + }, + /** + * 组件的属性列表 + */ + properties: { + extClass: { + type: String, + value: '' + }, + title: { + type: String, + value: '' + }, + background: { + type: String, + value: '' + }, + color: { + type: String, + value: '' + }, + back: { + type: Boolean, + value: true + }, + loading: { + type: Boolean, + value: false + }, + homeButton: { + type: Boolean, + value: false, + }, + animated: { + // 显示隐藏的时候opacity动画效果 + type: Boolean, + value: true + }, + show: { + // 显示隐藏导航,隐藏的时候navigation-bar的高度占位还在 + type: Boolean, + value: true, + observer: '_showChange' + }, + // back为true的时候,返回的页面深度 + delta: { + type: Number, + value: 1 + }, + }, + /** + * 组件的初始数据 + */ + data: { + displayStyle: '' + }, + lifetimes: { + attached() { + const rect = wx.getMenuButtonBoundingClientRect() + const platform = (wx.getDeviceInfo() || wx.getSystemInfoSync()).platform + const isAndroid = platform === 'android' + const isDevtools = platform === 'devtools' + const { windowWidth, safeArea: { top = 0, bottom = 0 } = {} } = wx.getWindowInfo() || wx.getSystemInfoSync() + this.setData({ + ios: !isAndroid, + innerPaddingRight: `padding-right: ${windowWidth - rect.left}px`, + leftWidth: `width: ${windowWidth - rect.left}px`, + safeAreaTop: isDevtools || isAndroid ? `height: calc(var(--height) + ${top}px); padding-top: ${top}px` : `` + }) + }, + }, + /** + * 组件的方法列表 + */ + methods: { + _showChange(show) { + const animated = this.data.animated + let displayStyle = '' + if (animated) { + displayStyle = `opacity: ${show ? '1' : '0' + };transition:opacity 0.5s;` + } else { + displayStyle = `display: ${show ? '' : 'none'}` + } + this.setData({ + displayStyle + }) + }, + back() { + const data = this.data + if (data.delta) { + wx.navigateBack({ + delta: data.delta + }) + } + this.triggerEvent('back', { delta: data.delta }, {}) + } + }, +}) diff --git a/components/navigation-bar/navigation-bar.json b/components/navigation-bar/navigation-bar.json new file mode 100644 index 0000000..4a20f17 --- /dev/null +++ b/components/navigation-bar/navigation-bar.json @@ -0,0 +1,5 @@ +{ + "component": true, + "styleIsolation": "apply-shared", + "usingComponents": {} +} \ No newline at end of file diff --git a/components/navigation-bar/navigation-bar.wxml b/components/navigation-bar/navigation-bar.wxml new file mode 100644 index 0000000..be9a663 --- /dev/null +++ b/components/navigation-bar/navigation-bar.wxml @@ -0,0 +1,64 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + {{title}} + + + + + + + + + + + + diff --git a/components/navigation-bar/navigation-bar.wxss b/components/navigation-bar/navigation-bar.wxss new file mode 100644 index 0000000..8bd379e --- /dev/null +++ b/components/navigation-bar/navigation-bar.wxss @@ -0,0 +1,96 @@ +.weui-navigation-bar { + --weui-FG-0:rgba(0,0,0,.9); + --height: 44px; + --left: 16px; +} +.weui-navigation-bar .android { + --height: 48px; +} + +.weui-navigation-bar { + overflow: hidden; + color: var(--weui-FG-0); + flex: none; +} + +.weui-navigation-bar__inner { + position: relative; + top: 0; + left: 0; + height: calc(var(--height) + env(safe-area-inset-top)); + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + padding-top: env(safe-area-inset-top); + width: 100%; + box-sizing: border-box; +} + +.weui-navigation-bar__left { + position: relative; + padding-left: var(--left); + display: flex; + flex-direction: row; + align-items: flex-start; + height: 100%; + box-sizing: border-box; +} + +.weui-navigation-bar__btn_goback_wrapper { + padding: 11px 18px 11px 16px; + margin: -11px -18px -11px -16px; +} + +.weui-navigation-bar__btn_goback_wrapper.weui-active { + opacity: 0.5; +} + +.weui-navigation-bar__btn_goback { + font-size: 12px; + width: 12px; + height: 24px; + -webkit-mask: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='24' viewBox='0 0 12 24'%3E %3Cpath fill-opacity='.9' fill-rule='evenodd' d='M10 19.438L8.955 20.5l-7.666-7.79a1.02 1.02 0 0 1 0-1.42L8.955 3.5 10 4.563 2.682 12 10 19.438z'/%3E%3C/svg%3E") no-repeat 50% 50%; + mask: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='24' viewBox='0 0 12 24'%3E %3Cpath fill-opacity='.9' fill-rule='evenodd' d='M10 19.438L8.955 20.5l-7.666-7.79a1.02 1.02 0 0 1 0-1.42L8.955 3.5 10 4.563 2.682 12 10 19.438z'/%3E%3C/svg%3E") no-repeat 50% 50%; + -webkit-mask-size: cover; + mask-size: cover; + background-color: var(--weui-FG-0); +} + +.weui-navigation-bar__center { + font-size: 17px; + text-align: center; + position: relative; + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + font-weight: bold; + flex: 1; + height: 100%; +} + +.weui-navigation-bar__loading { + margin-right: 4px; + align-items: center; +} + +.weui-loading { + font-size: 16px; + width: 16px; + height: 16px; + display: block; + background: transparent url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='80px' height='80px' viewBox='0 0 80 80' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Ctitle%3Eloading%3C/title%3E%3Cdefs%3E%3ClinearGradient x1='94.0869141%25' y1='0%25' x2='94.0869141%25' y2='90.559082%25' id='linearGradient-1'%3E%3Cstop stop-color='%23606060' stop-opacity='0' offset='0%25'%3E%3C/stop%3E%3Cstop stop-color='%23606060' stop-opacity='0.3' offset='100%25'%3E%3C/stop%3E%3C/linearGradient%3E%3ClinearGradient x1='100%25' y1='8.67370605%25' x2='100%25' y2='90.6286621%25' id='linearGradient-2'%3E%3Cstop stop-color='%23606060' offset='0%25'%3E%3C/stop%3E%3Cstop stop-color='%23606060' stop-opacity='0.3' offset='100%25'%3E%3C/stop%3E%3C/linearGradient%3E%3C/defs%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' opacity='0.9'%3E%3Cg%3E%3Cpath d='M40,0 C62.09139,0 80,17.90861 80,40 C80,62.09139 62.09139,80 40,80 L40,73 C58.2253967,73 73,58.2253967 73,40 C73,21.7746033 58.2253967,7 40,7 L40,0 Z' fill='url(%23linearGradient-1)'%3E%3C/path%3E%3Cpath d='M40,0 L40,7 C21.7746033,7 7,21.7746033 7,40 C7,58.2253967 21.7746033,73 40,73 L40,80 C17.90861,80 0,62.09139 0,40 C0,17.90861 17.90861,0 40,0 Z' fill='url(%23linearGradient-2)'%3E%3C/path%3E%3Ccircle id='Oval' fill='%23606060' cx='40.5' cy='3.5' r='3.5'%3E%3C/circle%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A") no-repeat; + background-size: 100%; + margin-left: 0; + animation: loading linear infinite 1s; +} + +@keyframes loading { + from { + transform: rotate(0); + } + to { + transform: rotate(360deg); + } +} diff --git a/images/article-active.png b/images/article-active.png new file mode 100644 index 0000000..306d36a Binary files /dev/null and b/images/article-active.png differ diff --git a/images/article.png b/images/article.png new file mode 100644 index 0000000..502e2ee Binary files /dev/null and b/images/article.png differ diff --git a/images/home-active.png b/images/home-active.png new file mode 100644 index 0000000..e57f2bc Binary files /dev/null and b/images/home-active.png differ diff --git a/images/home.png b/images/home.png new file mode 100644 index 0000000..2a34983 Binary files /dev/null and b/images/home.png differ diff --git a/models/article.js b/models/article.js new file mode 100644 index 0000000..9625ce8 --- /dev/null +++ b/models/article.js @@ -0,0 +1,23 @@ +/** + * 文章数据模型 + */ +class Article { + constructor(id, title, content, cover, summary, createTime) { + this.id = id; + this.title = title; + this.content = content; + this.cover = cover; + this.summary = summary || this.generateSummary(content); + this.createTime = createTime || new Date().getTime(); + } + + // 生成摘要 + generateSummary(content) { + if (!content) return ''; + return content.substring(0, 100).replace(/<[^>]+>/g, '') + '...'; + } +} + +module.exports = { + Article +} \ No newline at end of file diff --git a/models/articleManager.js b/models/articleManager.js new file mode 100644 index 0000000..c3a9879 --- /dev/null +++ b/models/articleManager.js @@ -0,0 +1,45 @@ +const { Article } = require('./article'); + +/** + * 文章管理类 + */ +class ArticleManager { + constructor() { + this.articles = this.initArticles(); + } + + // 初始化文章 + initArticles() { + return [ new Article( + '1', + '文章标题', + `

第一行第一行第一行第一行第一行第一行第一行第一行第一行第一行第一行第一行

+

第二行第二行第二行第二行第二行第二行第二行第二行第二行第二行第二行第二行

+ +

第三行第三行第三行第三行第三行第三行第三行第三行第三行第三行第三行第三行

+

第四行第四行第四行第四行第四行第四行第四行第四行第四行第四行第四行第四行

+

第五行第五行第五行第五行第五行第五行第五行第五行第五行第五行第五行第五行

`, + new Date('2025-05-13').getTime() + ), + ]; + } + + // 获取所有文章 + getAllArticles() { + return this.articles; + } + + // 获取特定文章 + getArticleById(id) { + return this.articles.find(article => article.id === id); + } + + // 获取最新文章 + getLatestArticle() { + return this.articles.sort((a, b) => b.createTime - a.createTime)[0]; + } +} + +module.exports = { + ArticleManager +} \ No newline at end of file diff --git a/pages/article/article.js b/pages/article/article.js new file mode 100644 index 0000000..097848c --- /dev/null +++ b/pages/article/article.js @@ -0,0 +1,47 @@ +const { ArticleManager } = require('../../models/articleManager'); +const { formatDate } = require('../../utils/util'); + +Page({ + data: { + article: null, + formatDate: '' + }, + onLoad: function (options) { + this.articleManager = new ArticleManager(); + + // 如果有指定文章ID,则显示该文章 + if (options.id) { + this.loadArticle(options.id); + } else { + // 否则显示最新文章 + const latestArticle = this.articleManager.getLatestArticle(); + if (latestArticle) { + this.loadArticle(latestArticle.id); + } + } + }, + // 加载指定ID的文章 + loadArticle: function(id) { + const article = this.articleManager.getArticleById(id); + if (article) { // 格式化日期 + const date = new Date(article.createTime); + const formattedDate = formatDate(date); this.setData({ + article: article, + formatDate: formattedDate + }); + } }, + + // 分享功能 + onShareAppMessage: function () { + if (this.data.article) { + return { + title: this.data.article.title, + path: `/pages/article/article?id=${this.data.article.id}` + }; + } + return { + title: '精选文章', + path: '/pages/article/article' + }; + } +}) \ No newline at end of file diff --git a/pages/article/article.json b/pages/article/article.json new file mode 100644 index 0000000..8632c9b --- /dev/null +++ b/pages/article/article.json @@ -0,0 +1,5 @@ +{ + "usingComponents": { + "navigation-bar": "/components/navigation-bar/navigation-bar" + } +} diff --git a/pages/article/article.wxml b/pages/article/article.wxml new file mode 100644 index 0000000..9b73e63 --- /dev/null +++ b/pages/article/article.wxml @@ -0,0 +1,12 @@ + + + + + + {{article.title}} + {{formatDate}} + + + + + diff --git a/pages/article/article.wxss b/pages/article/article.wxss new file mode 100644 index 0000000..22caebc --- /dev/null +++ b/pages/article/article.wxss @@ -0,0 +1,110 @@ +.container { + display: flex; + flex-direction: column; + width: 100%; + height: 100vh; + padding: 0 0 120rpx; /* 增大底部内边距,为底部导航栏留出足够空间 */ + box-sizing: border-box; + background: #f6f6f6; +} + +.article-container { + padding: 20px; + margin: 20px 20px 50px; /* 增大底部外边距 */ + background: #fff; + border-radius: 10px; + box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05); +} + +.article-header { + margin-bottom: 20px; + border-bottom: 1px solid #eee; + padding-bottom: 15px; +} + +.article-title { + font-size: 22px; + font-weight: bold; + display: block; + margin-bottom: 10px; + color: #333; +} + +.article-time { + font-size: 14px; + color: #999; + display: block; +} + +.article-content { + line-height: 1.8; + font-size: 16px; + color: #333; + letter-spacing: 0.05em; /* 添加字间距 */ + font-family: "PingFang SC", "Microsoft YaHei", sans-serif; /* 设置更适合阅读的字体 */ +} + +.article-content rich-text { + width: 100%; +} + +.article-content rich-text p { + margin-bottom: 15px; + text-indent: 2em; /* 添加首行缩进2个字符 */ + text-align: justify; /* 文本两端对齐 */ +} + +/* 文章中的图片样式 */ +.article-content image, +.article-content img { + width: 100%; + margin: 15px 0; + border-radius: 8px; + box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1); + display: block; + height: auto; +} + +/* 引用内容样式 */ +.article-content blockquote { + padding: 10px 15px; + background: #f9f9f9; + border-left: 4px solid #1296db; + margin: 15px 0; + color: #666; + font-style: italic; +} + +/* 列表样式 */ +.article-content ul, +.article-content ol { + padding-left: 2em; + margin-bottom: 15px; +} + +/* 粗体文字样式 */ +.article-content strong { + font-weight: bold; + color: #000; +} + +/* 文章小标题样式 */ +.article-content h1, +.article-content h2, +.article-content h3, +.article-content h4 { + margin: 20px 0 10px; + font-weight: bold; + color: #222; +} + +.article-image { + max-width: 100%; + width: 100%; + height: auto; + display: block; + margin: 15px 0; + border-radius: 8px; +} + + diff --git a/pages/article/article.wxss.new b/pages/article/article.wxss.new new file mode 100644 index 0000000..e69de29 diff --git a/pages/index/index.js b/pages/index/index.js new file mode 100644 index 0000000..7297bdb --- /dev/null +++ b/pages/index/index.js @@ -0,0 +1,60 @@ +// index.js +const { ArticleManager } = require('../../models/articleManager'); +const { formatDate } = require('../../utils/util'); + +Page({ + data: { + bannerList: [ + { imageUrl: 'https://www.meetstarry.com/banner1.png', title: '1' }, + { imageUrl: 'https://www.meetstarry.com/banner2.png', title: '2' }, + { imageUrl: 'https://www.meetstarry.com/banner3.png', title: '3' } + ], + article: null, + formatDate: '' + }, + + onLoad() { + // 实例化文章管理器 + this.articleManager = new ArticleManager(); + + // 获取最新的一篇文章 + const latestArticle = this.articleManager.getLatestArticle(); + if (latestArticle) { + // 格式化日期 + const date = new Date(latestArticle.createTime); + const formattedDate = formatDate(date); + + this.setData({ + article: latestArticle, + formatDate: formattedDate + }); + } + }, + + /** + * 图片加载错误处理 + */ + onImageError(e) { + const index = e.currentTarget.dataset.index; + const app = getApp(); + const defaultImage = app.globalData.imageManager ? app.globalData.imageManager.defaultImage : 'https://www.meetstarry.com/default.png'; + + // 处理轮播图错误 + if (typeof index !== 'undefined') { + const key = `bannerList[${index}].imageUrl`; + this.setData({ + [key]: defaultImage + }); + } + }, + + /** + * 用户点击右上角分享 + */ + onShareAppMessage() { + return { + title: '精选文章', + path: '/pages/index/index' + }; + } +}) diff --git a/pages/index/index.json b/pages/index/index.json new file mode 100644 index 0000000..aa3f1b0 --- /dev/null +++ b/pages/index/index.json @@ -0,0 +1,5 @@ +{ + "usingComponents": { + "navigation-bar": "/components/navigation-bar/navigation-bar" + } +} \ No newline at end of file diff --git a/pages/index/index.wxml b/pages/index/index.wxml new file mode 100644 index 0000000..0167250 --- /dev/null +++ b/pages/index/index.wxml @@ -0,0 +1,44 @@ + + + + + + + + + + + + + {{article.title}} + {{formatDate}} + + + + + + + diff --git a/pages/index/index.wxss b/pages/index/index.wxss new file mode 100644 index 0000000..fde2b8f --- /dev/null +++ b/pages/index/index.wxss @@ -0,0 +1,185 @@ +/**index.wxss**/ +page { + height: 100vh; + background-color: #f6f6f6; +} + +.page-wrapper { + display: flex; + flex-direction: column; + height: 100vh; + width: 100%; + position: relative; +} + +.page-container { + display: flex; + flex-direction: column; + height: 100vh; + box-sizing: border-box; + overflow: hidden; +} + +.scrollarea { + flex: 1; + overflow-y: auto; + overflow-x: hidden; + padding-bottom: 100rpx; /* 为底部导航栏留出空间 */ +} + +/* 轮播图样式 */ +.swiper-container { + width: 100%; + height: 400rpx; + position: relative; + overflow: hidden; + margin: 0; /* 移除所有边距 */ + padding: 0; /* 确保没有内边距 */ +} + +.banner { + width: 100%; + height: 400rpx; /* 确保高度固定 */ + border-radius: 0; /* 移除圆角,轮播图现在是文章内的一部分 */ + overflow: hidden; /* 确保内容不溢出 */ + box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1); /* 调整阴影效果 */ +} + +/* 轮播图加载状态 */ +.banner-loading { + width: 100%; + height: 400rpx; + display: flex; + align-items: center; + justify-content: center; + background-color: #f0f0f0; + border-radius: 0; /* 移除圆角,与轮播图样式保持一致 */ +} + +.loading-indicator { + width: 60rpx; + height: 60rpx; + border: 6rpx solid #e0e0e0; + border-top: 6rpx solid #1296db; + border-radius: 50%; + animation: spin 1s linear infinite; +} + +@keyframes spin { + 0% { transform: rotate(0deg); } + 100% { transform: rotate(360deg); } +} + +.banner-image { + width: 100%; + height: 100%; + transition: transform 0.3s ease; + /* 以下属性可能在WebView模式下不完全支持,但不会导致显示错误 */ + will-change: transform; + transform: translateZ(0); + backface-visibility: hidden; +} + +.banner-title { + position: absolute; + bottom: 0; + left: 0; + right: 0; + background: linear-gradient(to top, rgba(0,0,0,0.7), transparent); + color: white; + padding: 30rpx; + font-size: 32rpx; + text-shadow: 0 1rpx 3rpx rgba(0,0,0,0.5); + font-weight: 600; + z-index: 10; + display: flex; + align-items: center; + height: 120rpx; /* 为标题提供足够空间 */ +} + +.container { + padding: 20rpx; + padding-bottom: 50rpx; /* 为底部导航栏增加额外的空间 */ +} + +/* 文章部分样式 */ +.article-scroll { + flex: 1; + overflow-y: auto; + -webkit-overflow-scrolling: touch; /* 在WebView模式下提供流畅滚动 */ +} + +.article-section { + background: #fff; + border-radius: 10rpx; + padding: 30rpx; + margin: 20rpx 0 50rpx; /* 增加底部外边距 */ + box-shadow: 0 2rpx 10rpx rgba(0,0,0,0.05); +} + +.article-header { + margin-bottom: 20rpx; + padding-bottom: 20rpx; + border-bottom: 1rpx solid #eee; +} + +.article-title { + font-size: 40rpx; + font-weight: bold; + display: block; + margin-bottom: 10rpx; + color: #333; +} + +.article-time { + font-size: 24rpx; + color: #999; +} + +.article-content { + font-size: 28rpx; + line-height: 1.8; + color: #333; + margin-bottom: 20rpx; /* 添加底部间距 */ + letter-spacing: 0.05em; /* 添加字间距 */ + font-family: "PingFang SC", "Microsoft YaHei", sans-serif; /* 设置更适合阅读的字体 */ +} + +.article-content rich-text { + width: 100%; +} + +/* 段落样式 */ +.article-content rich-text p { + margin-bottom: 15rpx; + text-indent: 2em; /* 添加首行缩进2个字符 */ + text-align: justify; /* 文本两端对齐 */ +} + +/* 文章中的图片样式 */ +.article-content image, +.article-content img { + width: 100%; + margin: 15rpx 0; + border-radius: 8rpx; + box-shadow: 0 2rpx 6rpx rgba(0, 0, 0, 0.1); + display: block; + height: auto; +} + +.article-image { + max-width: 100%; + width: 100%; + height: auto; + display: block; + margin: 15rpx 0; + border-radius: 8rpx; +} + +/* 移除了未使用的样式 */ + +/* 移除了重复的文章内容样式 */ + +/* 移除了未使用的段落和图片状态样式 */ + +/* 移除了未使用的模式特定样式 */ \ No newline at end of file diff --git a/project.config.json b/project.config.json new file mode 100644 index 0000000..d8a3a68 --- /dev/null +++ b/project.config.json @@ -0,0 +1,25 @@ +{ + "setting": { + "es6": true, + "postcss": true, + "minified": true, + "uglifyFileName": false, + "enhance": true, + "packNpmRelationList": [], + "babelSetting": { + "ignore": [], + "disablePlugins": [], + "outputPath": "" + }, + "useCompilerPlugins": false, + "minifyWXML": true + }, + "compileType": "miniprogram", + "simulatorPluginLibVersion": {}, + "packOptions": { + "ignore": [], + "include": [] + }, + "appid": "wxc7291afafdd1f339", + "editorSetting": {} +} \ No newline at end of file diff --git a/project.private.config.json b/project.private.config.json new file mode 100644 index 0000000..d32b15f --- /dev/null +++ b/project.private.config.json @@ -0,0 +1,14 @@ +{ + "libVersion": "3.8.3", + "projectname": "WeChatApps", + "setting": { + "urlCheck": true, + "coverView": true, + "lazyloadPlaceholderEnable": false, + "skylineRenderEnable": false, + "preloadBackgroundData": false, + "autoAudits": false, + "showShadowRootInWxmlPanel": true, + "compileHotReLoad": true + } +} \ No newline at end of file diff --git a/sitemap.json b/sitemap.json new file mode 100644 index 0000000..cd24f35 --- /dev/null +++ b/sitemap.json @@ -0,0 +1,7 @@ +{ + "desc": "关于本文件的更多信息,请参考文档 https://developers.weixin.qq.com/miniprogram/dev/framework/sitemap.html", + "rules": [{ + "action": "allow", + "page": "*" + }] +} \ No newline at end of file diff --git a/utils/font-awesome.wxss b/utils/font-awesome.wxss new file mode 100644 index 0000000..e69de29 diff --git a/utils/imageManager.js b/utils/imageManager.js new file mode 100644 index 0000000..7e606d3 --- /dev/null +++ b/utils/imageManager.js @@ -0,0 +1,25 @@ +/** + * 图片管理器 + * 用于统一管理小程序中的图片资源 + */ + +class ImageManager { + constructor() { + this.defaultImage = 'https://www.meetstarry.com/default.png'; + } + /** + * 获取图片,如果为空则返回默认图片 + * @param {String} url - 图片URL + * @returns {String} - 返回图片URL + */ + getImageUrl(url) { + if (!url || url === '') { + return this.defaultImage; + } + return url; + } +} + +module.exports = { + ImageManager +}; \ No newline at end of file diff --git a/utils/util.js b/utils/util.js new file mode 100644 index 0000000..688cb3a --- /dev/null +++ b/utils/util.js @@ -0,0 +1,44 @@ +/** + * 格式化时间 + * @param {Date} date - 日期对象 + * @returns {String} - 格式化后的时间字符串 (yyyy-MM-dd) + */ +const formatDate = date => { + const year = date.getFullYear() + const month = date.getMonth() + 1 + const day = date.getDate() + + return `${year}-${month.toString().padStart(2, '0')}-${day.toString().padStart(2, '0')}`; +} + +/** + * 格式化时间 + * @param {Date} date - 日期对象 + * @returns {String} - 格式化后的时间字符串 (yyyy-MM-dd HH:mm:ss) + */ +const formatTime = date => { + const year = date.getFullYear() + const month = date.getMonth() + 1 + const day = date.getDate() + const hour = date.getHours() + const minute = date.getMinutes() + const second = date.getSeconds() + + return `${[year, month, day].map(formatNumber).join('-')} ${[hour, minute, second].map(formatNumber).join(':')}` +} + +/** + * 格式化数字,补零 + * @param {Number} n - 数字 + * @returns {String} - 补零后的字符串 + */ +const formatNumber = n => { + n = n.toString() + return n[1] ? n : `0${n}` +} + +module.exports = { + formatDate, + formatTime, + formatNumber +} \ No newline at end of file