Skip to content

D
demo
提交 c238a295 authored 作者: 吴也's avatar 吴也
浏览文件
操作

Initial commit

上级
隐藏空白字符变更
内嵌 并排
正在显示 包含 379 行增加 和 0 行删除
App.vue 0 → 100644
浏览文件 @ c238a295
<script>
export default {
onLaunch: function() {
console.log('App Launch')
},
onShow: function() {
console.log('App Show')
},
onHide: function() {
console.log('App Hide')
}
}
</script>
<style>
/*每个页面公共css */
</style>
index.html 0 → 100644
浏览文件 @ c238a295
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, user-scalable=yes, maximum-scale=4.0, minimum-scale=1.0">
<title>
<%= htmlWebpackPlugin.options.title %>
</title>
<script>
document.addEventListener('DOMContentLoaded', function() {
document.documentElement.style.fontSize = document.documentElement.clientWidth / 20 + 'px'
})
</script>
<link rel="stylesheet" href="<%= BASE_URL %>static/index.<%= VUE_APP_INDEX_CSS_HASH %>.css" />
</head>
<body>
<noscript>
<strong>Please enable JavaScript to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
\ No newline at end of file
main.js 0 → 100644
浏览文件 @ c238a295
import Vue from 'vue'
import App from './App'
Vue.config.productionTip = false
App.mpType = 'app'
const app = new Vue({
...App
})
app.$mount()
manifest.json 0 → 100644
浏览文件 @ c238a295
{
"name" : "demo",
"appid" : "",
"description" : "",
"versionName" : "1.0.0",
"versionCode" : "100",
"transformPx" : false,
/* 5+App特有相关 */
"app-plus" : {
"usingComponents" : true,
"nvueCompiler" : "uni-app",
"compilerVersion" : 3,
"splashscreen" : {
"alwaysShowBeforeRender" : true,
"waiting" : true,
"autoclose" : true,
"delay" : 0
},
/* 模块配置 */
"modules" : {},
/* 应用发布信息 */
"distribute" : {
/* android打包配置 */
"android" : {
"permissions" : [
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
"<uses-permission android:name=\"android.permission.READ_CONTACTS\"/>",
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
"<uses-permission android:name=\"android.permission.WRITE_CONTACTS\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
"<uses-permission android:name=\"android.permission.RECORD_AUDIO\"/>",
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
"<uses-permission android:name=\"android.permission.MODIFY_AUDIO_SETTINGS\"/>",
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
"<uses-permission android:name=\"android.permission.CALL_PHONE\"/>",
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_COARSE_LOCATION\"/>",
"<uses-feature android:name=\"android.hardware.camera\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_FINE_LOCATION\"/>",
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
]
},
/* ios打包配置 */
"ios" : {},
/* SDK配置 */
"sdkConfigs" : {}
}
},
/* 快应用特有相关 */
"quickapp" : {},
/* 小程序特有相关 */
"mp-weixin" : {
"appid" : "",
"setting" : {
"urlCheck" : false
},
"usingComponents" : true
},
"mp-alipay" : {
"usingComponents" : true
},
"mp-baidu" : {
"usingComponents" : true
},
"mp-toutiao" : {
"usingComponents" : true
},
"h5" : {
"template" : "index.html"
}
}
pages.json 0 → 100644
浏览文件 @ c238a295
{
"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
{
"path": "pages/index/index"
},
{
"path": "pages/index/calog"
}
],
"globalStyle": {
"navigationStyle":"custom"
}
}
pages/index/calog.vue 0 → 100644
浏览文件 @ c238a295
<template>
<view class="contain">
<view class="imgBox" v-for="(item,index) in dataList" @tap="toDetail(index)">
<img :src="'/static/0229新冠肺炎防控指导手册（中国中医科学院）-'+(index+1)+'.png'" alt="">
</view>
</view>
</template>
<script>
export default {
data() {
return {
dataList:new Array(64)
}
},
onLoad() {
},
methods: {
toDetail(indx){
uni.reLaunch({
url: './index?indx='+indx
});
}
}
}
</script>
<style lang="less" scope>
.contain{
display: flex;
flex-wrap: wrap;
padding: 40upx;
justify-content: center;
}
.imgBox{
height: 270upx;
flex: 3;
margin:0 20upx 30upx 0 ;
img{
height: 270upx;
}
}
</style>
pages/index/index.vue 0 → 100644
浏览文件 @ c238a295
<template>
<view class="content">
<img :src="imgUrl" alt="" @tap="tapImg($event)" ref="imgs">
<view class="calogBox" v-if="ifShow">
<view class="calog" @tap="toPage()">目录</view>
<view class="page">{{indx}}/64</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
imgUrl:'/static/0229新冠肺炎防控指导手册（中国中医科学院）-1.png',
indx:1,
ifShow:false
}
},
onLoad: function (option) {
if(option.indx||option.indx==0){
this.imgUrl= '/static/0229新冠肺炎防控指导手册（中国中医科学院）-'+(Number(option.indx)+1)+'.png';
this.indx=Number(option.indx)+1;
}
},
methods: {
toPage(){
uni.navigateTo({
url: './calog'
});
},
tapImg($event){
let num=parseInt($event.detail.x/this.$refs.imgs.width*3)
if(num==0){
if(this.indx>1){
this.indx-=1;
this.imgUrl='/static/0229新冠肺炎防控指导手册（中国中医科学院）-'+this.indx+'.png'
}
if(this.ifShow){
this.ifShow=false
}
}
if(num==1){
this.ifShow=!this.ifShow
}
if(num==2){
if(this.indx<64){
this.indx+=1;
this.imgUrl='/static/0229新冠肺炎防控指导手册（中国中医科学院）-'+this.indx+'.png'
}
if(this.ifShow){
this.ifShow=false
}
}
}
}
}
</script>
<style lang="less" scoped>
.content{
height: 100vh;
width: 100%;
overflow: hidden;
img{
height: 100%;
width: 100%;
}
.cover{
height: 100%;
width: 100%;
}
.divs{
position: absolute;
top: 0;
width: 33.33%;
height: 100%;
}
.prev{
left: 0;
}
.next{
right: 0;
}
.center{
left: 33.33%;
}
.calogBox{
height: 100upx;
width: 100%;
background: rgba(0,0,0,0.8);
color: #666;
font-size: 14px;
position: absolute;
bottom: 0;
left: 0;
z-index: 400;
display: flex;
.page{
flex: 2;
text-align: center;
line-height: 100upx;
}
.calog{
flex: 3;
text-align: center;
line-height: 100upx;
}
}
}
</style>
uni.scss 0 → 100644
浏览文件 @ c238a295
/**
* 这里是uni-app内置的常用样式变量
*
* uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
* 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
*
*/
/**
* 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
*
* 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
*/
/* 颜色变量 */
/* 行为相关颜色 */
$uni-color-primary: #007aff;
$uni-color-success: #4cd964;
$uni-color-warning: #f0ad4e;
$uni-color-error: #dd524d;
/* 文字基本颜色 */
$uni-text-color:#333;//基本色
$uni-text-color-inverse:#fff;//反色
$uni-text-color-grey:#999;//辅助灰色，如加载更多的提示信息
$uni-text-color-placeholder: #808080;
$uni-text-color-disable:#c0c0c0;
/* 背景颜色 */
$uni-bg-color:#ffffff;
$uni-bg-color-grey:#f8f8f8;
$uni-bg-color-hover:#f1f1f1;//点击状态颜色
$uni-bg-color-mask:rgba(0, 0, 0, 0.4);//遮罩颜色
/* 边框颜色 */
$uni-border-color:#c8c7cc;
/* 尺寸变量 */
/* 文字尺寸 */
$uni-font-size-sm:24upx;
$uni-font-size-base:28upx;
$uni-font-size-lg:32upx;
/* 图片尺寸 */
$uni-img-size-sm:40upx;
$uni-img-size-base:52upx;
$uni-img-size-lg:80upx;
/* Border Radius */
$uni-border-radius-sm: 4upx;
$uni-border-radius-base: 6upx;
$uni-border-radius-lg: 12upx;
$uni-border-radius-circle: 50%;
/* 水平间距 */
$uni-spacing-row-sm: 10px;
$uni-spacing-row-base: 20upx;
$uni-spacing-row-lg: 30upx;
/* 垂直间距 */
$uni-spacing-col-sm: 8upx;
$uni-spacing-col-base: 16upx;
$uni-spacing-col-lg: 24upx;
/* 透明度 */
$uni-opacity-disabled: 0.3; // 组件禁用态的透明度
/* 文章场景相关 */
$uni-color-title: #2C405A; // 文章标题颜色
$uni-font-size-title:40upx;
$uni-color-subtitle: #555555; // 二级标题颜色
$uni-font-size-subtitle:36upx;
$uni-color-paragraph: #3F536E; // 文章段落颜色
$uni-font-size-paragraph:30upx;
\ No newline at end of file
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论