init project
|
@ -0,0 +1,23 @@
|
||||||
|
.DS_Store
|
||||||
|
node_modules/
|
||||||
|
unpackage/
|
||||||
|
dist/
|
||||||
|
|
||||||
|
# local env files
|
||||||
|
.env.local
|
||||||
|
.env.*.local
|
||||||
|
|
||||||
|
# Log files
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
|
|
||||||
|
# Editor directories and files
|
||||||
|
.project
|
||||||
|
.idea
|
||||||
|
.vscode
|
||||||
|
*.suo
|
||||||
|
*.ntvs*
|
||||||
|
*.njsproj
|
||||||
|
*.sln
|
||||||
|
*.sw*
|
|
@ -0,0 +1,16 @@
|
||||||
|
{ // launch.json 配置了启动调试时相关设置,configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
|
||||||
|
// launchtype项可配置值为local或remote, local代表前端连本地云函数,remote代表前端连云端云函数
|
||||||
|
"version": "0.0",
|
||||||
|
"configurations": [{
|
||||||
|
"default" :
|
||||||
|
{
|
||||||
|
"launchtype" : "local"
|
||||||
|
},
|
||||||
|
"mp-weixin" :
|
||||||
|
{
|
||||||
|
"launchtype" : "local"
|
||||||
|
},
|
||||||
|
"type" : "uniCloud"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
|
@ -0,0 +1,19 @@
|
||||||
|
# star-store
|
||||||
|
|
||||||
|
## Project setup
|
||||||
|
```
|
||||||
|
yarn install
|
||||||
|
```
|
||||||
|
|
||||||
|
### Compiles and hot-reloads for development
|
||||||
|
```
|
||||||
|
yarn serve
|
||||||
|
```
|
||||||
|
|
||||||
|
### Compiles and minifies for production
|
||||||
|
```
|
||||||
|
yarn build
|
||||||
|
```
|
||||||
|
|
||||||
|
### Customize configuration
|
||||||
|
See [Configuration Reference](https://cli.vuejs.org/config/).
|
|
@ -0,0 +1,63 @@
|
||||||
|
const plugins = []
|
||||||
|
|
||||||
|
if (process.env.UNI_OPT_TREESHAKINGNG) {
|
||||||
|
plugins.push(require('@dcloudio/vue-cli-plugin-uni-optimize/packages/babel-plugin-uni-api/index.js'))
|
||||||
|
}
|
||||||
|
|
||||||
|
if (
|
||||||
|
(
|
||||||
|
process.env.UNI_PLATFORM === 'app-plus' &&
|
||||||
|
process.env.UNI_USING_V8
|
||||||
|
) ||
|
||||||
|
(
|
||||||
|
process.env.UNI_PLATFORM === 'h5' &&
|
||||||
|
process.env.UNI_H5_BROWSER === 'builtin'
|
||||||
|
)
|
||||||
|
) {
|
||||||
|
const path = require('path')
|
||||||
|
|
||||||
|
const isWin = /^win/.test(process.platform)
|
||||||
|
|
||||||
|
const normalizePath = path => (isWin ? path.replace(/\\/g, '/') : path)
|
||||||
|
|
||||||
|
const input = normalizePath(process.env.UNI_INPUT_DIR)
|
||||||
|
try {
|
||||||
|
plugins.push([
|
||||||
|
require('@dcloudio/vue-cli-plugin-hbuilderx/packages/babel-plugin-console'),
|
||||||
|
{
|
||||||
|
file (file) {
|
||||||
|
file = normalizePath(file)
|
||||||
|
if (file.indexOf(input) === 0) {
|
||||||
|
return path.relative(input, file)
|
||||||
|
}
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
])
|
||||||
|
} catch (e) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
process.UNI_LIBRARIES = process.UNI_LIBRARIES || ['@dcloudio/uni-ui']
|
||||||
|
process.UNI_LIBRARIES.forEach(libraryName => {
|
||||||
|
plugins.push([
|
||||||
|
'import',
|
||||||
|
{
|
||||||
|
'libraryName': libraryName,
|
||||||
|
'customName': (name) => {
|
||||||
|
return `${libraryName}/lib/${name}/${name}`
|
||||||
|
}
|
||||||
|
}
|
||||||
|
])
|
||||||
|
})
|
||||||
|
module.exports = {
|
||||||
|
presets: [
|
||||||
|
[
|
||||||
|
'@vue/app',
|
||||||
|
{
|
||||||
|
modules: 'commonjs',
|
||||||
|
useBuiltIns: process.env.UNI_PLATFORM === 'h5' ? 'usage' : 'entry'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
],
|
||||||
|
plugins
|
||||||
|
}
|
|
@ -0,0 +1,106 @@
|
||||||
|
{
|
||||||
|
"name": "star-store",
|
||||||
|
"version": "0.1.0",
|
||||||
|
"private": true,
|
||||||
|
"scripts": {
|
||||||
|
"serve": "npm run dev:h5",
|
||||||
|
"build": "npm run build:h5",
|
||||||
|
"build:app-plus": "cross-env NODE_ENV=production UNI_PLATFORM=app-plus vue-cli-service uni-build",
|
||||||
|
"build:custom": "cross-env NODE_ENV=production uniapp-cli custom",
|
||||||
|
"build:h5": "cross-env NODE_ENV=production UNI_PLATFORM=h5 vue-cli-service uni-build",
|
||||||
|
"build:mp-360": "cross-env NODE_ENV=production UNI_PLATFORM=mp-360 vue-cli-service uni-build",
|
||||||
|
"build:mp-alipay": "cross-env NODE_ENV=production UNI_PLATFORM=mp-alipay vue-cli-service uni-build",
|
||||||
|
"build:mp-baidu": "cross-env NODE_ENV=production UNI_PLATFORM=mp-baidu vue-cli-service uni-build",
|
||||||
|
"build:mp-jd": "cross-env NODE_ENV=production UNI_PLATFORM=mp-jd vue-cli-service uni-build",
|
||||||
|
"build:mp-kuaishou": "cross-env NODE_ENV=production UNI_PLATFORM=mp-kuaishou vue-cli-service uni-build",
|
||||||
|
"build:mp-lark": "cross-env NODE_ENV=production UNI_PLATFORM=mp-lark vue-cli-service uni-build",
|
||||||
|
"build:mp-qq": "cross-env NODE_ENV=production UNI_PLATFORM=mp-qq vue-cli-service uni-build",
|
||||||
|
"build:mp-toutiao": "cross-env NODE_ENV=production UNI_PLATFORM=mp-toutiao vue-cli-service uni-build",
|
||||||
|
"build:mp-weixin": "cross-env NODE_ENV=production UNI_PLATFORM=mp-weixin vue-cli-service uni-build",
|
||||||
|
"build:quickapp-native": "cross-env NODE_ENV=production UNI_PLATFORM=quickapp-native vue-cli-service uni-build",
|
||||||
|
"build:quickapp-webview": "cross-env NODE_ENV=production UNI_PLATFORM=quickapp-webview vue-cli-service uni-build",
|
||||||
|
"build:quickapp-webview-huawei": "cross-env NODE_ENV=production UNI_PLATFORM=quickapp-webview-huawei vue-cli-service uni-build",
|
||||||
|
"build:quickapp-webview-union": "cross-env NODE_ENV=production UNI_PLATFORM=quickapp-webview-union vue-cli-service uni-build",
|
||||||
|
"dev:app-plus": "cross-env NODE_ENV=development UNI_PLATFORM=app-plus vue-cli-service uni-build --watch",
|
||||||
|
"dev:custom": "cross-env NODE_ENV=development uniapp-cli custom",
|
||||||
|
"dev:h5": "cross-env NODE_ENV=development UNI_PLATFORM=h5 vue-cli-service uni-serve",
|
||||||
|
"dev:mp-360": "cross-env NODE_ENV=development UNI_PLATFORM=mp-360 vue-cli-service uni-build --watch",
|
||||||
|
"dev:mp-alipay": "cross-env NODE_ENV=development UNI_PLATFORM=mp-alipay vue-cli-service uni-build --watch",
|
||||||
|
"dev:mp-baidu": "cross-env NODE_ENV=development UNI_PLATFORM=mp-baidu vue-cli-service uni-build --watch",
|
||||||
|
"dev:mp-jd": "cross-env NODE_ENV=development UNI_PLATFORM=mp-jd vue-cli-service uni-build --watch",
|
||||||
|
"dev:mp-kuaishou": "cross-env NODE_ENV=development UNI_PLATFORM=mp-kuaishou vue-cli-service uni-build --watch",
|
||||||
|
"dev:mp-lark": "cross-env NODE_ENV=development UNI_PLATFORM=mp-lark vue-cli-service uni-build --watch",
|
||||||
|
"dev:mp-qq": "cross-env NODE_ENV=development UNI_PLATFORM=mp-qq vue-cli-service uni-build --watch",
|
||||||
|
"dev:mp-toutiao": "cross-env NODE_ENV=development UNI_PLATFORM=mp-toutiao vue-cli-service uni-build --watch",
|
||||||
|
"dev:mp-weixin": "cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue-cli-service uni-build --watch",
|
||||||
|
"dev:quickapp-native": "cross-env NODE_ENV=development UNI_PLATFORM=quickapp-native vue-cli-service uni-build --watch",
|
||||||
|
"dev:quickapp-webview": "cross-env NODE_ENV=development UNI_PLATFORM=quickapp-webview vue-cli-service uni-build --watch",
|
||||||
|
"dev:quickapp-webview-huawei": "cross-env NODE_ENV=development UNI_PLATFORM=quickapp-webview-huawei vue-cli-service uni-build --watch",
|
||||||
|
"dev:quickapp-webview-union": "cross-env NODE_ENV=development UNI_PLATFORM=quickapp-webview-union vue-cli-service uni-build --watch",
|
||||||
|
"info": "node node_modules/@dcloudio/vue-cli-plugin-uni/commands/info.js",
|
||||||
|
"serve:quickapp-native": "node node_modules/@dcloudio/uni-quickapp-native/bin/serve.js",
|
||||||
|
"test:android": "cross-env UNI_PLATFORM=app-plus UNI_OS_NAME=android jest -i",
|
||||||
|
"test:h5": "cross-env UNI_PLATFORM=h5 jest -i",
|
||||||
|
"test:ios": "cross-env UNI_PLATFORM=app-plus UNI_OS_NAME=ios jest -i",
|
||||||
|
"test:mp-baidu": "cross-env UNI_PLATFORM=mp-baidu jest -i",
|
||||||
|
"test:mp-weixin": "cross-env UNI_PLATFORM=mp-weixin jest -i"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"@dcloudio/uni-app-plus": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/uni-h5": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/uni-helper-json": "*",
|
||||||
|
"@dcloudio/uni-i18n": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/uni-mp-360": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/uni-mp-alipay": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/uni-mp-baidu": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/uni-mp-jd": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/uni-mp-kuaishou": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/uni-mp-lark": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/uni-mp-qq": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/uni-mp-toutiao": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/uni-mp-vue": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/uni-mp-weixin": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/uni-quickapp-native": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/uni-quickapp-webview": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/uni-stat": "^2.0.1-33920220314002",
|
||||||
|
"@vue/shared": "^3.0.0",
|
||||||
|
"core-js": "^3.6.5",
|
||||||
|
"flyio": "^0.6.2",
|
||||||
|
"regenerator-runtime": "^0.12.1",
|
||||||
|
"uview-ui": "^2.0.29",
|
||||||
|
"vue": "^2.6.11",
|
||||||
|
"vuex": "^3.2.0"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"@babel/runtime": "~7.12.0",
|
||||||
|
"@dcloudio/types": "*",
|
||||||
|
"@dcloudio/uni-automator": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/uni-cli-i18n": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/uni-cli-shared": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/uni-migration": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/uni-template-compiler": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/vue-cli-plugin-hbuilderx": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/vue-cli-plugin-uni": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/vue-cli-plugin-uni-optimize": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/webpack-uni-mp-loader": "^2.0.1-33920220314002",
|
||||||
|
"@dcloudio/webpack-uni-pages-loader": "^2.0.1-33920220314002",
|
||||||
|
"@vue/cli-plugin-babel": "~4.5.13",
|
||||||
|
"@vue/cli-service": "~4.5.13",
|
||||||
|
"babel-plugin-import": "^1.11.0",
|
||||||
|
"cross-env": "^7.0.2",
|
||||||
|
"jest": "^25.4.0",
|
||||||
|
"mini-types": "*",
|
||||||
|
"miniprogram-api-typings": "*",
|
||||||
|
"node-sass": "^4.14.1",
|
||||||
|
"postcss-comment": "^2.0.0",
|
||||||
|
"sass-loader": "^10.0.1",
|
||||||
|
"vue-template-compiler": "^2.6.11"
|
||||||
|
},
|
||||||
|
"browserslist": [
|
||||||
|
"Android >= 4.4",
|
||||||
|
"ios >= 9"
|
||||||
|
],
|
||||||
|
"uni-app": {
|
||||||
|
"scripts": {}
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,22 @@
|
||||||
|
const path = require('path')
|
||||||
|
module.exports = {
|
||||||
|
parser: require('postcss-comment'),
|
||||||
|
plugins: [
|
||||||
|
require('postcss-import')({
|
||||||
|
resolve (id, basedir, importOptions) {
|
||||||
|
if (id.startsWith('~@/')) {
|
||||||
|
return path.resolve(process.env.UNI_INPUT_DIR, id.substr(3))
|
||||||
|
} else if (id.startsWith('@/')) {
|
||||||
|
return path.resolve(process.env.UNI_INPUT_DIR, id.substr(2))
|
||||||
|
} else if (id.startsWith('/') && !id.startsWith('//')) {
|
||||||
|
return path.resolve(process.env.UNI_INPUT_DIR, id.substr(1))
|
||||||
|
}
|
||||||
|
return id
|
||||||
|
}
|
||||||
|
}),
|
||||||
|
require('autoprefixer')({
|
||||||
|
remove: process.env.UNI_PLATFORM !== 'h5'
|
||||||
|
}),
|
||||||
|
require('@dcloudio/vue-cli-plugin-uni/packages/postcss')
|
||||||
|
]
|
||||||
|
}
|
|
@ -0,0 +1,28 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="zh-CN">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
<title>
|
||||||
|
<%= htmlWebpackPlugin.options.title %>
|
||||||
|
</title>
|
||||||
|
<script>
|
||||||
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
document.documentElement.style.fontSize = document.documentElement.clientWidth / 20 + 'px'
|
||||||
|
})
|
||||||
|
var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') || CSS.supports('top: constant(a)'))
|
||||||
|
document.write('<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' + (coverSupport ? ', viewport-fit=cover' : '') + '" />')
|
||||||
|
</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>
|
|
@ -0,0 +1,47 @@
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
onLaunch: function () {
|
||||||
|
console.log("App Launch");
|
||||||
|
},
|
||||||
|
onShow: function () {
|
||||||
|
console.log("App Show");
|
||||||
|
},
|
||||||
|
onHide: function () {
|
||||||
|
console.log("App Hide");
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
/*每个页面公共css */
|
||||||
|
@import "uview-ui/index.scss";
|
||||||
|
// 公共样式
|
||||||
|
|
||||||
|
page {
|
||||||
|
color: #251b1d;
|
||||||
|
font-family: PingFang SC-Regular, PingFang SC;
|
||||||
|
font-size: 14px;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.overflowEllipsis {
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.status_bar {
|
||||||
|
height: var(--status-bar-height);
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.moreEllipsis {
|
||||||
|
letter-spacing: 0;
|
||||||
|
overflow: hidden;
|
||||||
|
display: -webkit-box;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
-webkit-line-clamp: 2;
|
||||||
|
/*要显示的行数*/
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,41 @@
|
||||||
|
<template>
|
||||||
|
<view class="search">
|
||||||
|
<image src="../../static/icon9.png" mode="" class="searchIcon"></image>
|
||||||
|
<input type="text" v-model="value" placeholder="请输入搜索内容" placeholder-class="plClass" class="searchInput" />
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "search",
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
value: ''
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.search {
|
||||||
|
height: 36px;
|
||||||
|
background: #F8F8F8;
|
||||||
|
border-radius: 6px 6px 6px 6px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.searchIcon {
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
margin: 0 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchInput {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.plClass {
|
||||||
|
color: #AFADB0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,116 @@
|
||||||
|
<template>
|
||||||
|
<view class="tabbar">
|
||||||
|
<view class="tabbar-item" @click="cliTabbar(1)">
|
||||||
|
<image src="../../static/tabbar/homeSelected.png" v-if="tabbarId=='1'" mode="" class="img"></image>
|
||||||
|
<image src="../../static/tabbar/home.png" mode="" v-else class="img"></image>
|
||||||
|
<text class="label" :class="tabbarId=='1' ? 'selected' : ''">首页</text>
|
||||||
|
</view>
|
||||||
|
<view class="tabbar-item" @click="cliTabbar(2)">
|
||||||
|
<image src="../../static/tabbar/activitySelected.png" v-if="tabbarId=='2'" mode="" class="img"></image>
|
||||||
|
<image src="../../static/tabbar/activity.png" mode="" v-else class="img"></image>
|
||||||
|
<text class="label" :class="tabbarId=='2' ? 'selected' : ''">动态</text>
|
||||||
|
</view>
|
||||||
|
<view class="tabbar-item midButton" @click="cliTabbar(3)">
|
||||||
|
<image src="../../static/tabbar/middle.png" mode="" class="img"></image>
|
||||||
|
</view>
|
||||||
|
<view class="tabbar-item" @click="cliTabbar(4)">
|
||||||
|
<image src="../../static/tabbar/shopSelected.png" v-if="tabbarId=='4'" mode="" class="img"></image>
|
||||||
|
<image src="../../static/tabbar/shop.png" mode="" v-else class="img"></image>
|
||||||
|
<text class="label" :class="tabbarId=='4' ? 'selected' : ''">商城</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="tabbar-item" @click="cliTabbar(5)">
|
||||||
|
<image src="../../static/tabbar/mySelected.png" v-if="tabbarId=='5'" mode="" class="img"></image>
|
||||||
|
<image src="../../static/tabbar/my.png" mode="" v-else class="img"></image>
|
||||||
|
<text class="label" :class="tabbarId=='5' ? 'selected' : ''">我的</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "tabbar",
|
||||||
|
props: {
|
||||||
|
tabbarId: {
|
||||||
|
required: true,
|
||||||
|
type: String
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
methods: {
|
||||||
|
cliTabbar(val) {
|
||||||
|
if (val == '1') {
|
||||||
|
uni.reLaunch({
|
||||||
|
url: '/pages/pageHome/pageHome'
|
||||||
|
});
|
||||||
|
return
|
||||||
|
} else if (val == '2') {
|
||||||
|
uni.reLaunch({
|
||||||
|
url: '/pages/activity/activity'
|
||||||
|
});
|
||||||
|
return
|
||||||
|
} else if (val == '3') {
|
||||||
|
uni.reLaunch({
|
||||||
|
url: '/pages/PublishWorks/PublishWorks'
|
||||||
|
});
|
||||||
|
return
|
||||||
|
} else if (val == '4') {
|
||||||
|
uni.reLaunch({
|
||||||
|
url: '/pages/shop/Shop'
|
||||||
|
});
|
||||||
|
return
|
||||||
|
} else if (val == '5') {
|
||||||
|
uni.reLaunch({
|
||||||
|
url: '/pages/my/My'
|
||||||
|
});
|
||||||
|
return
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.tabbar {
|
||||||
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
background: #F7F7F7;
|
||||||
|
height: 50px;
|
||||||
|
display: flex;
|
||||||
|
font-size: 14px;
|
||||||
|
box-shadow: 1px -1px 1px rgba(0, 0, 0, 0.1);
|
||||||
|
z-index:999;
|
||||||
|
.tabbar-item {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
|
||||||
|
&.midButton {
|
||||||
|
.img {
|
||||||
|
width: 30px;
|
||||||
|
height: 30px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.img {
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.label {
|
||||||
|
color: #AFADB0;
|
||||||
|
|
||||||
|
&.selected {
|
||||||
|
color: #251B1D;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,24 @@
|
||||||
|
import Vue from 'vue'
|
||||||
|
import App from './App'
|
||||||
|
|
||||||
|
|
||||||
|
import uView from "uview-ui";
|
||||||
|
Vue.use(uView);
|
||||||
|
|
||||||
|
//公共方法
|
||||||
|
import "@/utils/utils.js"
|
||||||
|
|
||||||
|
|
||||||
|
//组件
|
||||||
|
import tabbar from "@/components/tabbar/tabbar.vue"
|
||||||
|
Vue.component('tabbar',tabbar)
|
||||||
|
|
||||||
|
Vue.config.productionTip = false
|
||||||
|
|
||||||
|
|
||||||
|
App.mpType = 'app'
|
||||||
|
|
||||||
|
const app = new Vue({
|
||||||
|
...App
|
||||||
|
})
|
||||||
|
app.$mount()
|
|
@ -0,0 +1,77 @@
|
||||||
|
{
|
||||||
|
"name" : "艺象心",
|
||||||
|
"appid" : "__UNI__9AD4766",
|
||||||
|
"description" : "",
|
||||||
|
"versionName" : "1.0.0",
|
||||||
|
"versionCode" : "100",
|
||||||
|
"transformPx" : false,
|
||||||
|
"app-plus" : {
|
||||||
|
/* 5+App特有相关 */
|
||||||
|
"usingComponents" : true,
|
||||||
|
"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打包配置 */
|
||||||
|
"sdkConfigs" : {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
/* SDK配置 */
|
||||||
|
"quickapp" : {},
|
||||||
|
/* 快应用特有相关 */
|
||||||
|
"mp-weixin" : {
|
||||||
|
/* 微信小程序特有相关 */
|
||||||
|
"appid" : "wx79d2c832590cc08c",
|
||||||
|
"setting" : {
|
||||||
|
"urlCheck" : false,
|
||||||
|
"minified" : true
|
||||||
|
},
|
||||||
|
"usingComponents" : true
|
||||||
|
},
|
||||||
|
"mp-alipay" : {
|
||||||
|
"usingComponents" : true
|
||||||
|
},
|
||||||
|
"mp-baidu" : {
|
||||||
|
"usingComponents" : true
|
||||||
|
},
|
||||||
|
"mp-toutiao" : {
|
||||||
|
"usingComponents" : true
|
||||||
|
},
|
||||||
|
"mp-qq" : {
|
||||||
|
"usingComponents" : true
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,270 @@
|
||||||
|
{
|
||||||
|
"easycom": {
|
||||||
|
"^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
|
||||||
|
},
|
||||||
|
"pages": [ //pages数组中第一项表示应用启动页,参考:https://uniapp.dcloud.io/collocation/pages
|
||||||
|
{
|
||||||
|
"path": "pages/pageHome/pageHome",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "",
|
||||||
|
"enablePullDownRefresh": false,
|
||||||
|
"navigationStyle": "custom"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/enjoy/enjoy",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "每日一赏",
|
||||||
|
"enablePullDownRefresh": false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/mediaProp/mediaProp",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "",
|
||||||
|
"enablePullDownRefresh": false,
|
||||||
|
"navigationStyle": "custom"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
"path": "pages/literHelp/literHelp",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "",
|
||||||
|
"enablePullDownRefresh": false,
|
||||||
|
"navigationStyle": "custom"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
"path": "pages/literFamily/literFamily",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "",
|
||||||
|
"enablePullDownRefresh": false,
|
||||||
|
"navigationStyle": "custom"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/activity/activity",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "",
|
||||||
|
"enablePullDownRefresh": false,
|
||||||
|
"navigationStyle": "custom"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
"path": "pages/moreFun/moreFun",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "更多功能",
|
||||||
|
"enablePullDownRefresh": false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/index/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "中间按钮"
|
||||||
|
}
|
||||||
|
}, {
|
||||||
|
"path": "pages/shop/Shop",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "",
|
||||||
|
"enablePullDownRefresh": false
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
// 政策速通
|
||||||
|
, {
|
||||||
|
"path": "pages/PolicyExpress/PolicyExpress",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "政策速通",
|
||||||
|
"enablePullDownRefresh": false
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
// 文艺作品
|
||||||
|
, {
|
||||||
|
"path": "pages/ArtWorks/ArtWorks",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "文艺作品",
|
||||||
|
"enablePullDownRefresh": false
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
// 文艺活动
|
||||||
|
, {
|
||||||
|
"path": "pages/ArtActivities/ArtActivities",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "文艺活动",
|
||||||
|
"enablePullDownRefresh": false
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
// 活动详情
|
||||||
|
{
|
||||||
|
"path": "pages/ActivitiesDetail/ActivitiesDetail",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "活动详情",
|
||||||
|
"enablePullDownRefresh": false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 我的页面
|
||||||
|
, {
|
||||||
|
"path": "pages/my/My",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "",
|
||||||
|
"enablePullDownRefresh": false,
|
||||||
|
"navigationStyle": "custom"
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
// 我的积分
|
||||||
|
{
|
||||||
|
"path": "pages/MyPoints/MyPoints",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "我的积分",
|
||||||
|
"enablePullDownRefresh": false,
|
||||||
|
"navigationStyle": "custom"
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
// 订单详情
|
||||||
|
{
|
||||||
|
"path": "pages/OrderDetail/OrderDetail",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "",
|
||||||
|
"enablePullDownRefresh": false,
|
||||||
|
"navigationStyle": "custom"
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
,{
|
||||||
|
"path" : "pages/famousArts/famousArts",
|
||||||
|
"style" :
|
||||||
|
{
|
||||||
|
"navigationBarTitleText": "",
|
||||||
|
"enablePullDownRefresh": false
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
,{
|
||||||
|
"path" : "pages/SelectId/SelectId",
|
||||||
|
"style" :
|
||||||
|
{
|
||||||
|
"navigationBarTitleText": "",
|
||||||
|
"enablePullDownRefresh": false,
|
||||||
|
"navigationStyle":"custom"
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
,{
|
||||||
|
"path" : "pages/improveData/improveData",
|
||||||
|
"style" :
|
||||||
|
{
|
||||||
|
"navigationBarTitleText": "完善资料",
|
||||||
|
"enablePullDownRefresh": false
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
,{
|
||||||
|
"path" : "pages/PublishWorks/PublishWorks",
|
||||||
|
"style" :
|
||||||
|
{
|
||||||
|
"navigationBarTitleText": "发布作品",
|
||||||
|
"enablePullDownRefresh": false
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
,{
|
||||||
|
"path" : "pages/PublishWorks/PublishWorksNext",
|
||||||
|
"style" :
|
||||||
|
{
|
||||||
|
"navigationBarTitleText": "发布作品",
|
||||||
|
"enablePullDownRefresh": false
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
,{
|
||||||
|
"path" : "pages/DataSearch/DataSearch",
|
||||||
|
"style" :
|
||||||
|
{
|
||||||
|
"navigationBarTitleText": "资料查找",
|
||||||
|
"enablePullDownRefresh": false
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
,{
|
||||||
|
"path" : "pages/folderDetail/folderDetail",
|
||||||
|
"style" :
|
||||||
|
{
|
||||||
|
"navigationBarTitleText": "",
|
||||||
|
"enablePullDownRefresh": false
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
,{
|
||||||
|
"path" : "pages/AwardWinningWork/AwardWinningWork",
|
||||||
|
"style" :
|
||||||
|
{
|
||||||
|
"navigationBarTitleText": "艺起战疫获奖作品",
|
||||||
|
"enablePullDownRefresh": false
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
,{
|
||||||
|
"path" : "pages/ArtRace/ArtRace",
|
||||||
|
"style" :
|
||||||
|
{
|
||||||
|
"navigationBarTitleText": "文艺比赛",
|
||||||
|
"enablePullDownRefresh": false
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
,{
|
||||||
|
"path" : "pages/ArtRace/ArtRaceDetail",
|
||||||
|
"style" :
|
||||||
|
{
|
||||||
|
"navigationBarTitleText": "",
|
||||||
|
"enablePullDownRefresh": false,
|
||||||
|
"navigationStyle":"custom"
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
,{
|
||||||
|
"path" : "pages/ArtRace/ThrowWork",
|
||||||
|
"style" :
|
||||||
|
{
|
||||||
|
"navigationBarTitleText": "投稿",
|
||||||
|
"enablePullDownRefresh": false
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
,{
|
||||||
|
"path" : "pages/MyOrder/MyOrder",
|
||||||
|
"style" :
|
||||||
|
{
|
||||||
|
"navigationBarTitleText": "",
|
||||||
|
"enablePullDownRefresh": false,
|
||||||
|
"navigationStyle":"custom"
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
,{
|
||||||
|
"path" : "pages/ConfirmOrder/ConfirmOrder",
|
||||||
|
"style" :
|
||||||
|
{
|
||||||
|
"navigationBarTitleText": "确认订单",
|
||||||
|
"enablePullDownRefresh": false
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"globalStyle": {
|
||||||
|
"navigationBarTextStyle": "black", //导航栏标题颜色及状态栏前景颜色,仅支持 black/white
|
||||||
|
"navigationBarBackgroundColor": "#FFFFFF", //导航栏背景颜色(同状态栏背景色)
|
||||||
|
"backgroundColor": "#F8F8F8" //下拉显示出来的窗口的背景色
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,258 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<view class="help_bg_box">
|
||||||
|
<view class=" bg_img_box">
|
||||||
|
<image style="height: 352rpx; width: 100%; " src="../../static/orderDetail.png"></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="header">
|
||||||
|
<view class="title">{{serveList.title}} 文化凝聚</view>
|
||||||
|
<view class="details">{{serveList.activityText}} 象山县第界</view>
|
||||||
|
</view>
|
||||||
|
<view class="activityDetails">
|
||||||
|
|
||||||
|
<view class="item_ul">
|
||||||
|
<view class="item_li">
|
||||||
|
<view class="standard">
|
||||||
|
<image class="icon" src="../../static/actDetails/actTime.png" mode="scaleToFill"></image>
|
||||||
|
<text>活动时间</text>
|
||||||
|
</view>
|
||||||
|
<view class="content">{{serveList.address}} 2021/12/12~2022/02/02</view>
|
||||||
|
</view>
|
||||||
|
<view class="item_li">
|
||||||
|
<view class="standard">
|
||||||
|
<image class="icon" src="../../static/actDetails/actAddr.png" mode="scaleToFill"></image>
|
||||||
|
<text>活动地点</text>
|
||||||
|
</view>
|
||||||
|
<view class="content"> 象山文化活动中心 </view>
|
||||||
|
</view>
|
||||||
|
<view class="item_li">
|
||||||
|
<view class="standard">
|
||||||
|
<image class="icon" src="../../static/actDetails/actAddr.png" mode="scaleToFill"></image>
|
||||||
|
<text>活动类型</text>
|
||||||
|
</view>
|
||||||
|
<view class="content"> 摄影 </view>
|
||||||
|
</view>
|
||||||
|
<view class="item_li">
|
||||||
|
<view class="standard">
|
||||||
|
<image class="icon" src="../../static/actDetails/actAddr.png" mode="scaleToFill"></image>
|
||||||
|
<text>活动报名时间</text>
|
||||||
|
</view>
|
||||||
|
<view class="content"> 2021/12/12~2022/02/02 </view>
|
||||||
|
</view>
|
||||||
|
<view class="item_li">
|
||||||
|
<view class="standard">
|
||||||
|
<image class="icon" src="../../static/actDetails/actPeople.png" mode="scaleToFill"></image>
|
||||||
|
<text> 活动人数</text>
|
||||||
|
</view>
|
||||||
|
<view class="content"> 60/<text style=" color: #AFADB0;">120</text> </view>
|
||||||
|
</view>
|
||||||
|
<view class="item_li">
|
||||||
|
<view class="standard">
|
||||||
|
<image class="icon" src="../../static/actDetails/actAddr.png" mode="scaleToFill"></image>
|
||||||
|
<text>志愿者报名时间</text>
|
||||||
|
</view>
|
||||||
|
<view class="content"> 2021/12/12~2022/02/02 </view>
|
||||||
|
</view>
|
||||||
|
<view class="item_li">
|
||||||
|
<view class="standard">
|
||||||
|
<image class="icon" src="../../static/actDetails/actPeople.png" mode="scaleToFill"></image>
|
||||||
|
<text>志愿者招募数量</text>
|
||||||
|
</view>
|
||||||
|
<view class="content">{{serveList.maxCount}} 60/<text style=" color: #AFADB0;">120</text> </view>
|
||||||
|
</view>
|
||||||
|
<view class="item_li">
|
||||||
|
<view class="standard">
|
||||||
|
<image class="icon" src="../../static/actDetails/actAddr.png" mode="scaleToFill"></image>
|
||||||
|
<text>冠名申请时间</text>
|
||||||
|
</view>
|
||||||
|
<view class="content"> 2021/12/12~2022/02/02 </view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="operation">
|
||||||
|
<button type="default" class="apply" @click="baoMing()">活动报名</button>
|
||||||
|
<button type="default" class="collection">志愿者报名</button>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
id: '',
|
||||||
|
serveList: [],
|
||||||
|
img: [],
|
||||||
|
activityId: '',
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
onLoad(options) {
|
||||||
|
// this.id = 'e98c24e3eb47db31f89cb1071a30fec4'
|
||||||
|
// this.id = options.id
|
||||||
|
console.log(options.id);
|
||||||
|
},
|
||||||
|
/*
|
||||||
|
onShow() {
|
||||||
|
this.getList()
|
||||||
|
}, */
|
||||||
|
methods: {
|
||||||
|
back() {
|
||||||
|
uni.navigateBack()
|
||||||
|
},
|
||||||
|
getList() {
|
||||||
|
this.http.request('/activity/details', {
|
||||||
|
id: this.id
|
||||||
|
}, "GET").then(res => {
|
||||||
|
this.serveList = res.data
|
||||||
|
this.img = res.data.images.split(',')
|
||||||
|
this.activityId = res.data.id
|
||||||
|
})
|
||||||
|
},
|
||||||
|
baoMing() {
|
||||||
|
this.$refs.popup.open()
|
||||||
|
},
|
||||||
|
close() {
|
||||||
|
this.$refs.popup.close()
|
||||||
|
},
|
||||||
|
confirm() {
|
||||||
|
this.http.request('/activityUser/addActivity?activityId=' + this.id, {}, "POST").then(res => {
|
||||||
|
uni.showToast({
|
||||||
|
title: '报名成功',
|
||||||
|
icon: "none",
|
||||||
|
});
|
||||||
|
this.getList()
|
||||||
|
}).catch(e => {
|
||||||
|
uni.showToast({
|
||||||
|
title: e.data.message,
|
||||||
|
icon: "none",
|
||||||
|
});
|
||||||
|
})
|
||||||
|
this.$refs.popup.close()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
page {
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.help_bg_box {
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.header {
|
||||||
|
padding: 40rpx 32rpx 32rpx;
|
||||||
|
border-bottom: 16rpx solid #F8F8F8;
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-size: 36rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
margin-bottom: 24rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.details {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #8E8F9E;
|
||||||
|
line-height: 40rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.activityDetails {
|
||||||
|
padding: 32rpx;
|
||||||
|
margin-bottom: 160rpx;
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-size: 24rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
margin-bottom: 24rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item_ul {
|
||||||
|
.item_li {
|
||||||
|
padding-bottom: 32rpx;
|
||||||
|
margin-bottom: 32rpx;
|
||||||
|
border-bottom: 2rpx solid #F1F1F1;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.standard {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 16rpx;
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
width: 24rpx;
|
||||||
|
height: 24rpx;
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
text {
|
||||||
|
font-size: 24rpx;
|
||||||
|
// color: #251B1D;
|
||||||
|
color: $gray;
|
||||||
|
margin-left: 8rpx;
|
||||||
|
line-height: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
font-size: 24rpx;
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.operation {
|
||||||
|
display: flex;
|
||||||
|
// justify-content: space-between;
|
||||||
|
padding: 32rpx 32rpx 48rpx;
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
right: 0;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
box-shadow: 0px -4px 10px 1px rgba(192, 192, 192, 0.12);
|
||||||
|
|
||||||
|
.collection {
|
||||||
|
flex: 1;
|
||||||
|
margin-left: 24rpx;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
border: 1px solid #99241B;
|
||||||
|
color: #99241B;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.apply {
|
||||||
|
flex: 1;
|
||||||
|
background-color: $red;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
&::after {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,59 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
|
||||||
|
<view class="art_act_itm" v-for="(v,i) in 3" :key="i" @click="goActDeat(i)">
|
||||||
|
<image src="../../static/artWork.png" mode=""></image>
|
||||||
|
<view class="title">
|
||||||
|
露凝而白|鸿雁来清秋满怀
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
goActDeat(id){
|
||||||
|
uni.navigateTo({
|
||||||
|
url:`/pages/ActivitiesDetail/ActivitiesDetail?id=${id}`
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
page{
|
||||||
|
width: calc(100% - 32px);
|
||||||
|
margin: 0px 16px;
|
||||||
|
}
|
||||||
|
image{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.art_act_itm{
|
||||||
|
margin-top: 12px;
|
||||||
|
height: 164px;
|
||||||
|
border-radius: 8px;
|
||||||
|
border: 1px solid transparnt;
|
||||||
|
position: relative;
|
||||||
|
.title{
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
background: #000000;
|
||||||
|
border-radius: 0px 0px 8px 8px;
|
||||||
|
opacity: 0.3;
|
||||||
|
height: 44px;
|
||||||
|
color: #FFFFFF;
|
||||||
|
line-height: 44px;
|
||||||
|
font-size: 14px;
|
||||||
|
padding-left: 12px;
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,58 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<view class="art_race_itm" v-for="(v,i) in 6" @click="goRaceDetail(i)">
|
||||||
|
<image style="width: 100%; height: 296rpx;" src="../../static/artRace/race1.png" mode=""></image>
|
||||||
|
<view class="art_race_bot">
|
||||||
|
<text class="art_title">艺起战疫</text>
|
||||||
|
<text class="art_race_con u-line-2">寒冬虽冷,美术工作者们以画传心,心是热的;疫情虽紧,艺术家们以笔 墨为歌,信心是充足的。在市委宣传部和市递正能量,吹响新时代的...</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
goRaceDetail(id){
|
||||||
|
console.log(id);
|
||||||
|
uni.navigateTo({
|
||||||
|
url:"/pages/ArtRace/ArtRaceDetail?id="+String(id),
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
page{
|
||||||
|
background-color: #F4F5F7;
|
||||||
|
}
|
||||||
|
.art_race_itm{
|
||||||
|
border-radius: 16rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
width: calc(100% - 64rpx);
|
||||||
|
margin: 24rpx auto;
|
||||||
|
|
||||||
|
.art_race_bot{
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 24rpx;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
.art_title{
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
.art_race_con{
|
||||||
|
font-size: 20rpx;
|
||||||
|
color: $gray;
|
||||||
|
margin-bottom: 24rpx;
|
||||||
|
margin-top: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,197 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<!-- 导航栏 -->
|
||||||
|
<view class="navbar">
|
||||||
|
<view class="status_bar" :style="{'height':statusHeight+'px'}"></view>
|
||||||
|
<view class="apptitle" :style="{'height':titleHeight+'px'}">
|
||||||
|
<image src="../../static/blackArrow.png" mode="" class="backImg" @click="back"></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!--导航栏ed -->
|
||||||
|
|
||||||
|
<view class="art_race_itm">
|
||||||
|
<image style="width: 100%; height: 440rpx;" src="../../static/artRace/race1.png" mode=""></image>
|
||||||
|
<view class="art_race_bot">
|
||||||
|
<text class="art_title">艺起战疫</text>
|
||||||
|
<text class="art_race_con ">寒冬虽冷,美术工作者们以画传心,心是热的;疫情虽紧,艺术家们以笔 墨为歌,信心是充足的。在市委宣传部和市递正能量,吹响新时代的...</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="race_itm_con">
|
||||||
|
<view class="race_type_box">
|
||||||
|
<text class="race_type_titl">比赛类型:</text>
|
||||||
|
<text class="race_type_con">书画</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="race_type_box">
|
||||||
|
<text class="race_type_titl">比赛形式:</text>
|
||||||
|
<text class="race_type_con">线上投稿</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
<view class="race_type_box">
|
||||||
|
<text class="race_type_titl">投稿开始时间:</text>
|
||||||
|
<text class="race_type_con">2021-02-02</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="race_type_box">
|
||||||
|
<text class="race_type_titl">投稿结束时间:</text>
|
||||||
|
<text class="race_type_con">2021-02-02</text>
|
||||||
|
</view>
|
||||||
|
<view class="race_type_box">
|
||||||
|
<text class="race_type_titl">审评结束时间:</text>
|
||||||
|
<text class="race_type_con">2021-02-02</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- 红色按钮 -->
|
||||||
|
<view class="operation">
|
||||||
|
<button type="default" class="next" @click="throwWork">立即投稿</button>
|
||||||
|
</view>
|
||||||
|
<!-- 红色按钮ed -->
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
statusHeight: 0,
|
||||||
|
titleHeight: 50,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
back() {
|
||||||
|
uni.navigateBack()
|
||||||
|
},
|
||||||
|
throwWork() {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: "/pages/ArtRace/ThrowWork"
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onReady() {
|
||||||
|
const systemMsg = uni.getSystemInfoSync();
|
||||||
|
this.statusHeight = systemMsg.statusBarHeight
|
||||||
|
|
||||||
|
// #ifdef MP-WEIXIN
|
||||||
|
const menuButtonInfo = uni.getMenuButtonBoundingClientRect() //胶囊
|
||||||
|
this.titleHeight = menuButtonInfo.height + (menuButtonInfo.top - systemMsg.statusBarHeight) * 2
|
||||||
|
this.topHeight = this.statusHeight + this.titleHeight
|
||||||
|
// #endif
|
||||||
|
|
||||||
|
// #ifndef MP-WEIXIN
|
||||||
|
//除了小程序
|
||||||
|
this.topHeight = this.statusHeight + this.titleHeight
|
||||||
|
// #endif
|
||||||
|
},
|
||||||
|
onLoad(opt) {
|
||||||
|
console.log(opt.id);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
page {
|
||||||
|
background-color: #F4F5F7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.art_race_itm {
|
||||||
|
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
|
||||||
|
.art_race_bot {
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 24rpx;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
|
||||||
|
.art_title {
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.art_race_con {
|
||||||
|
font-size: 20rpx;
|
||||||
|
color: $gray;
|
||||||
|
margin-bottom: 24rpx;
|
||||||
|
margin-top: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.race_itm_con {
|
||||||
|
height: 1000rpx;
|
||||||
|
margin-top: 16rpx;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
|
||||||
|
.race_type_box {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 14px;
|
||||||
|
|
||||||
|
.race_type_titl {
|
||||||
|
color: $gray;
|
||||||
|
}
|
||||||
|
|
||||||
|
.race_type_con {}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
z-index: 999;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
.apptitle {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 0 32rpx;
|
||||||
|
|
||||||
|
.backImg {
|
||||||
|
width: 40rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
margin-right: 32rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.operation {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 32rpx 32rpx 48rpx;
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
right: 0;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
box-shadow: 0px -4px 10px 1px rgba(192, 192, 192, 0.12);
|
||||||
|
|
||||||
|
.next {
|
||||||
|
width: calc(100% - 48rpx);
|
||||||
|
height: 80rpx;
|
||||||
|
line-height: 80rpx;
|
||||||
|
|
||||||
|
background-color: #99241B;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
|
||||||
|
border: none;
|
||||||
|
|
||||||
|
button {
|
||||||
|
&::after {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,167 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<u--form :model="model2" :rules="rules" ref="form2">
|
||||||
|
<u-form-item prop="userInfo.name" ref="item2" class="data_itm"></u-form-item>
|
||||||
|
</u--form>
|
||||||
|
|
||||||
|
<u--input style="padding: 32rpx;" placeholder="请输入作品名称" border="none" clearable></u--input>
|
||||||
|
|
||||||
|
|
||||||
|
<u--textarea style="padding: 32rpx; height: 200rpx;" v-model="value" placeholder="请输入作品说明" border="none"></u--textarea>
|
||||||
|
<view class="gap">
|
||||||
|
作品内容可上传图片/视频/音频等
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<u-upload class="upload" accept="media" width="172rpx" height="172rpx" :fileList="fileList3"
|
||||||
|
@afterRead="afterRead" @delete="deletePic" name="3" multiple :maxCount="2">
|
||||||
|
<image style="width: 172rpx;height: 172rpx;" src="../../static/improveData/jia.png"></image>
|
||||||
|
</u-upload>
|
||||||
|
|
||||||
|
|
||||||
|
<view class="operation">
|
||||||
|
<button type="default" class="next" @click="throwMyWork">投稿</button>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<view class="zhanwei">
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
value: '',
|
||||||
|
fileList3: [],
|
||||||
|
model2:{
|
||||||
|
workName:'',
|
||||||
|
workDesc:''
|
||||||
|
},
|
||||||
|
rules:{
|
||||||
|
|
||||||
|
}
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
throwMyWork() {
|
||||||
|
uni.showToast({
|
||||||
|
title:"投稿作品"
|
||||||
|
})
|
||||||
|
/* uni.navigateTo({
|
||||||
|
url: "/pages/PublishWorks/PublishWorksNext"
|
||||||
|
}) */
|
||||||
|
},
|
||||||
|
// 删除图片
|
||||||
|
deletePic(event) {
|
||||||
|
this[`fileList${event.name}`].splice(event.index, 1)
|
||||||
|
},
|
||||||
|
// 新增图片
|
||||||
|
async afterRead(event) {
|
||||||
|
// 当设置 mutiple 为 true 时, file 为数组格式,否则为对象格式
|
||||||
|
let lists = [].concat(event.file)
|
||||||
|
let fileListLen = this[`fileList${event.name}`].length
|
||||||
|
lists.map((item) => {
|
||||||
|
this[`fileList${event.name}`].push({
|
||||||
|
...item,
|
||||||
|
status: 'uploading',
|
||||||
|
message: '上传中'
|
||||||
|
})
|
||||||
|
})
|
||||||
|
for (let i = 0; i < lists.length; i++) {
|
||||||
|
const result = await this.uploadFilePromise(lists[i].url)
|
||||||
|
let item = this[`fileList${event.name}`][fileListLen]
|
||||||
|
this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
|
||||||
|
status: 'success',
|
||||||
|
message: '',
|
||||||
|
url: result
|
||||||
|
}))
|
||||||
|
fileListLen++
|
||||||
|
}
|
||||||
|
},
|
||||||
|
uploadFilePromise(url) {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
let a = uni.uploadFile({
|
||||||
|
url: 'http://192.168.2.21:7001/upload', // 仅为示例,非真实的接口地址
|
||||||
|
filePath: url,
|
||||||
|
name: 'file',
|
||||||
|
formData: {
|
||||||
|
user: 'test'
|
||||||
|
},
|
||||||
|
success: (res) => {
|
||||||
|
setTimeout(() => {
|
||||||
|
resolve(res.data.data)
|
||||||
|
}, 1000)
|
||||||
|
}
|
||||||
|
});
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.gap {
|
||||||
|
font-size: 24rpx;
|
||||||
|
|
||||||
|
color: #AFADB0;
|
||||||
|
height: 80rpx;
|
||||||
|
background: #F5F5F5;
|
||||||
|
border-radius: 0px 0px 0px 0px;
|
||||||
|
opacity: 1;
|
||||||
|
line-height: 80rpx;
|
||||||
|
padding: 0 32rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.upload {
|
||||||
|
padding: 32rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.operation {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 32rpx 32rpx 48rpx;
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
right: 0;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
box-shadow: 0px -4px 10px 1px rgba(192, 192, 192, 0.12);
|
||||||
|
|
||||||
|
.next {
|
||||||
|
width: calc(100% - 48rpx);
|
||||||
|
height: 80rpx;
|
||||||
|
line-height: 80rpx;
|
||||||
|
|
||||||
|
background-color: #99241B;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
|
||||||
|
border: none;
|
||||||
|
|
||||||
|
button {
|
||||||
|
&::after {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.zhanwei {
|
||||||
|
height: 460rpx;
|
||||||
|
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,202 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<u-search height=42 margin="12px 0" searchIconColor="#251B1D" shape="square" :showAction="false"
|
||||||
|
v-model="artValue" placeholder="请输入名家名称"></u-search>
|
||||||
|
|
||||||
|
|
||||||
|
<u-tabs :scrollable="false" :list="list1" :activeStyle="{
|
||||||
|
color: '#251B1D',
|
||||||
|
fontWeight: 'bold',
|
||||||
|
transform: 'scale(1.05)'
|
||||||
|
}" :inactiveStyle="{
|
||||||
|
color: '#AFADB0 ',
|
||||||
|
transform: 'scale(1)'
|
||||||
|
}" itemStyle=" height: 50px; ">
|
||||||
|
</u-tabs>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<view class="artworks">
|
||||||
|
<view class="art_item" v-for="(v,i) in isLoveList" :key="i">
|
||||||
|
<view class="art_item_top">
|
||||||
|
<image src="../../static/artWork.png" mode=""></image>
|
||||||
|
<view class="like" @click="like(i)">
|
||||||
|
<view :class=" isLoveList[i] ? 'img_selected' : 'img'">
|
||||||
|
<!-- 红心 -->
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class=" art_item_bott">
|
||||||
|
<view class="title">
|
||||||
|
摄影作品自由生活向美而生作品
|
||||||
|
</view>
|
||||||
|
<view class="sub_title">
|
||||||
|
摄影作品
|
||||||
|
</view>
|
||||||
|
<view class="img_box">
|
||||||
|
<view class=" puber">
|
||||||
|
<view class="avtor">
|
||||||
|
<image src="../../static/artWork.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="autor">
|
||||||
|
谢xx
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="time">
|
||||||
|
58分钟前
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
isLoveList:[true,false,true,false],
|
||||||
|
artValue: '',
|
||||||
|
list1: [{
|
||||||
|
name: '全部',
|
||||||
|
}, {
|
||||||
|
name: '书法',
|
||||||
|
}, {
|
||||||
|
name: '绘画'
|
||||||
|
}, {
|
||||||
|
name: '雕刻'
|
||||||
|
}, {
|
||||||
|
name: '摄影'
|
||||||
|
}, {
|
||||||
|
name: '其他'
|
||||||
|
}]
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
like(i){
|
||||||
|
|
||||||
|
this.$set(this.isLoveList, i,!this.isLoveList[i])
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
/deep/ .u-tabs__wrapper__nav__item__text {
|
||||||
|
font-size: 28rpx;
|
||||||
|
}
|
||||||
|
/deep/ .u-tabs__wrapper__nav__line {
|
||||||
|
height: 14px!important;
|
||||||
|
width: 40px!important;
|
||||||
|
background-image: url(../../static/scrollLine.png);
|
||||||
|
background-color:transparent!important;
|
||||||
|
bottom: 2px!important;
|
||||||
|
}
|
||||||
|
page {
|
||||||
|
width: calc(100% - 32px);
|
||||||
|
margin: 0 16px ;
|
||||||
|
}
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.art_item {
|
||||||
|
margin-top: 16px;
|
||||||
|
border: 1px solid transparent;
|
||||||
|
.art_item_top {
|
||||||
|
position: relative;
|
||||||
|
height: 192px;
|
||||||
|
overflow: hidden;
|
||||||
|
border-radius: 8px;
|
||||||
|
|
||||||
|
.like {
|
||||||
|
position: absolute;
|
||||||
|
top: calc(100% - 40px);
|
||||||
|
left: calc(100% - 40px);
|
||||||
|
width: 32px;
|
||||||
|
height: 32px;
|
||||||
|
background-color: white;
|
||||||
|
z-index: 10;
|
||||||
|
border-radius: 50%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
.img{
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
background:url(../../static/spaceHeart.png) center/100% no-repeat ;
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
.img_selected{
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
background:url(../../static/redHerart.png) center/100% no-repeat ;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.art_item_bott {
|
||||||
|
.title {
|
||||||
|
margin-top: 12px;
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #251B1D;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sub_title {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #AFADB0;
|
||||||
|
margin-top: 12px;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.img_box {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.puber {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.avtor {
|
||||||
|
border-radius: 12px;
|
||||||
|
overflow: hidden;
|
||||||
|
width: 24px;
|
||||||
|
height: 24px;
|
||||||
|
margin-right: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.autor {
|
||||||
|
color: #251B1D;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.time {
|
||||||
|
color: #AFADB0;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,117 @@
|
||||||
|
<template>
|
||||||
|
<view class="reward">
|
||||||
|
|
||||||
|
<view class="reward_itm" v-for="(v,i) in fightVirusList" :key="i">
|
||||||
|
<view class="reward_top">
|
||||||
|
<image class="reward_work_img" :src="v.workImgUrl" mode="">
|
||||||
|
</image>
|
||||||
|
</view>
|
||||||
|
<view class="reward_bottm">
|
||||||
|
<text class="rewardWorkTitle">{{v.workTitle}}</text>
|
||||||
|
<view class="avator_box">
|
||||||
|
<image class="avator_img_small" :src="v.avatorUrl" mode="">
|
||||||
|
</image>
|
||||||
|
<text class="autor_name">{{v.author}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
fightVirusList: [{
|
||||||
|
id: 1,
|
||||||
|
author: "谢万里",
|
||||||
|
workImgUrl: '../../static/RewardWork/fightVirus.png',
|
||||||
|
avatorUrl: '../../static/RewardWork/avator.png',
|
||||||
|
workTitle: '致敬英雄'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 2,
|
||||||
|
author: "谢万里",
|
||||||
|
workImgUrl: '../../static/RewardWork/fightVirus1.png',
|
||||||
|
avatorUrl: '../../static/RewardWork/avator.png',
|
||||||
|
workTitle: '致敬英雄'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 3,
|
||||||
|
author: "谢万里",
|
||||||
|
workImgUrl: '../../static/RewardWork/fightVirus1.png',
|
||||||
|
avatorUrl: '../../static/RewardWork/avator.png',
|
||||||
|
workTitle: '致敬英雄'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 4,
|
||||||
|
author: "谢万里",
|
||||||
|
workImgUrl: '../../static/RewardWork/fightVirus.png',
|
||||||
|
avatorUrl: '../../static/RewardWork/avator.png',
|
||||||
|
workTitle: '致敬英雄'
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
]
|
||||||
|
};
|
||||||
|
},
|
||||||
|
onLoad(opt) {
|
||||||
|
console.log(opt.id);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
page {
|
||||||
|
background-color: #F4F5F7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.reward {
|
||||||
|
padding: 24rpx;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.reward_itm {
|
||||||
|
margin-top: 20rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
.reward_top {
|
||||||
|
.reward_work_img {
|
||||||
|
width: 344rpx;
|
||||||
|
height: 344rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.reward_bottm {
|
||||||
|
padding-left: 16rpx;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
|
||||||
|
.rewardWorkTitle {
|
||||||
|
|
||||||
|
font-size: 24rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.avator_box {
|
||||||
|
padding: 20rpx 0rpx;
|
||||||
|
|
||||||
|
.avator_img_small {
|
||||||
|
width: 32rpx;
|
||||||
|
height: 32rpx;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
.autor_name {
|
||||||
|
color: #AFADB0;
|
||||||
|
font-size: 20rpx;
|
||||||
|
margin-left: 4rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,208 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<view class="person_des bg_col_cirle_margin">
|
||||||
|
<image style="width: 46rpx; height: 46rpx;" src="../../static/DataSearch/Delet.png" mode=""></image>
|
||||||
|
<view class="person_con">
|
||||||
|
<view class="person_con_t">
|
||||||
|
<view class="info_txt">
|
||||||
|
<text>王文瑞</text> <text>18733663311</text>
|
||||||
|
</view>
|
||||||
|
<image style="width: 46rpx; height: 46rpx;" src="../../static/rightArrow.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="addr">
|
||||||
|
高新产业园
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="goods_box bg_col_cirle_margin">
|
||||||
|
<view class="goods_itm">
|
||||||
|
<view class="goods_itm_top">
|
||||||
|
<image style="width: 46rpx; height: 46rpx;" src="../../static/DataSearch/Delet.png" mode=""></image>
|
||||||
|
<text class="goods_itm_top_title">周科</text>
|
||||||
|
</view>
|
||||||
|
<view class="goods_itm_bott">
|
||||||
|
<image style="width: 148rpx; height: 156rpx;" src="../../static/DataSearch/TxtImg.png" mode="">
|
||||||
|
</image>
|
||||||
|
<view class="goods_itm_bott_left">
|
||||||
|
<text style="font-weight: 600;">绘画作品</text>
|
||||||
|
<view class="goods_itm_bott_left_count">
|
||||||
|
<text>x1</text> <text>¥80</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="price_box bg_col_cirle_margin">
|
||||||
|
<view class="price_tit">
|
||||||
|
价格明细
|
||||||
|
</view>
|
||||||
|
<view class="price_total">
|
||||||
|
<text>商品总价</text>
|
||||||
|
<text>¥80</text>
|
||||||
|
</view>
|
||||||
|
<view class="express_price">
|
||||||
|
<text>快递费</text>
|
||||||
|
<text>¥8</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
<view class="pay_methods bg_col_cirle_margin">
|
||||||
|
<text>支付方式</text>
|
||||||
|
<view class="pay_right">
|
||||||
|
<image style="width: 32rpx; height: 32rpx;" src="../../static/DataSearch/Delet.png" mode=""></image>
|
||||||
|
<text>微信支付</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
<view class="bottom_opration">
|
||||||
|
<view class="txt">
|
||||||
|
<text>合计 :</text> <text class="total_prc_color">¥88</text>
|
||||||
|
</view>
|
||||||
|
<view class="pay_button">
|
||||||
|
立即支付
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
page{
|
||||||
|
background-color: #F4F5F7;
|
||||||
|
}
|
||||||
|
image{
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
.person_des {
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.person_con {
|
||||||
|
flex: 1;
|
||||||
|
margin-left: 24rpx;
|
||||||
|
|
||||||
|
.person_con_t {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
.info_txt{
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 32rpx;
|
||||||
|
margin-bottom: 16rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods_box {
|
||||||
|
|
||||||
|
.goods_itm {
|
||||||
|
.goods_itm_top{
|
||||||
|
.goods_itm_top_title{
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods_itm_bott{
|
||||||
|
margin-top: 16rpx;
|
||||||
|
display: flex;
|
||||||
|
.goods_itm_bott_left{
|
||||||
|
flex: 1;
|
||||||
|
margin-left: 16rpx;
|
||||||
|
.goods_itm_bott_left_count{
|
||||||
|
color: $gray;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.price_box{
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
.price_tit{
|
||||||
|
font-weight: 600;
|
||||||
|
border-bottom: 1rpx #E0E0E0 solid;
|
||||||
|
padding-bottom: 32rpx;
|
||||||
|
}
|
||||||
|
.price_total{
|
||||||
|
padding: 24rpx 0;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.express_price{
|
||||||
|
padding: 24rpx 0;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.pay_methods{
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
// 辅助
|
||||||
|
.bg_col_cirle_margin{
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
margin-top: 16rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
width: calc(100% - 64rpx);
|
||||||
|
margin: 16rpx auto;
|
||||||
|
padding: 32rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
.bottom_opration{
|
||||||
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
padding: 32rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
justify-content: space-between;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
height: 166rpx;
|
||||||
|
.txt{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
.total_prc_color{
|
||||||
|
font-weight: 600;
|
||||||
|
color: #FF6600;
|
||||||
|
font-size: 44rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.pay_button{
|
||||||
|
background-color: $red;
|
||||||
|
color: #FFFFFF;
|
||||||
|
width: 284rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,320 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
|
||||||
|
<view class="search_box">
|
||||||
|
<u-search height=42 margin="12px 0" searchIconColor="black" bgColor="#f8f8f8" searchIconSize="40rpx"
|
||||||
|
shape="square" :showAction="false" v-model="dataVal" placeholder="请输入资料名称"></u-search>
|
||||||
|
<view class="car_box" v-if="false">
|
||||||
|
<image src="../../static/DataSearch/chexboxs.png" mode=""></image>
|
||||||
|
<text style="font-size: 20rpx;">选择</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<view class="itm" v-for="(v,i) in folderList" :key="i">
|
||||||
|
<view class="fileImg">
|
||||||
|
<image src="../../static/DataSearch/Floder.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="data_detail_box" @click="GofileDetail(i)">
|
||||||
|
|
||||||
|
<view class="file_title">
|
||||||
|
{{v.folderName}}
|
||||||
|
</view>
|
||||||
|
<view class="file_time">
|
||||||
|
2021-12-18 17:08
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="moreImg" @click="clickDot(i)" style="position: relative;" :ref="'tankuang'+String(i)">
|
||||||
|
<image src="../../static/DataSearch/moreFCUN.png" mode=""></image>
|
||||||
|
<view class="poup_edit_box" v-if="i===dotNum">
|
||||||
|
<view class="poup_edit" @click="editDir">
|
||||||
|
<image style="width: 32rpx;height: 32rpx; margin-right: 4rpx;"
|
||||||
|
src="../../static/DataSearch/dirEdit.png" mode="">
|
||||||
|
</image> 编辑目录
|
||||||
|
</view>
|
||||||
|
<view class="poup_del" @click="delDir">
|
||||||
|
<image style="width: 32rpx; height: 32rpx;margin-right: 4rpx;"
|
||||||
|
src="../../static/DataSearch/dirDel.png" mode="">
|
||||||
|
</image> 删除目录
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="moreImg" v-if="false">
|
||||||
|
<image src="../../static/DataSearch/radioImg.png" v-if="false" mode=""></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<view class="bottm" @click="show=!show">
|
||||||
|
<image src="../../static/DataSearch/zhanKai.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 加号弹出框 -->
|
||||||
|
|
||||||
|
<u-popup :show="show" closeOnClickOverlay @close="() => show = false" @open="open" round=5>
|
||||||
|
<view class="tan_con">
|
||||||
|
<view class="tit">
|
||||||
|
上传文件
|
||||||
|
</view>
|
||||||
|
<view class="up_itm_box">
|
||||||
|
|
||||||
|
<view class="img_itm">
|
||||||
|
<view class="img">
|
||||||
|
<image src="../../static/DataSearch/UploadImg.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="Up_tit">
|
||||||
|
上传图片
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
<view class="img_itm">
|
||||||
|
<view class="img">
|
||||||
|
<image src="../../static/DataSearch/uploadDoc.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="Up_tit">
|
||||||
|
上传文档
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<view class="img_itm">
|
||||||
|
<view class="img">
|
||||||
|
<image src="../../static/DataSearch/UploadVideo.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="Up_tit">
|
||||||
|
上传视频
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="img_itm">
|
||||||
|
<view class="img">
|
||||||
|
<image src="../../static/DataSearch/UploadMusic.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="Up_tit">
|
||||||
|
上传音频
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</u-popup>
|
||||||
|
<!-- 加号 ed -->
|
||||||
|
<!-- 三个点 中 删除目录 的弹出确认删除 -->
|
||||||
|
<u-modal width="550rpx" confirmText="确认删除" confirmColor='#E34D59' :show="showModel" showCancelButton
|
||||||
|
@confirm="confirmModel" @cancel="() => showModel = false">
|
||||||
|
<text style="font-size: 32rpx; font-weight: 600;color: #251B1D;margin: 25rpx 0;">确认删除目录</text>
|
||||||
|
</u-modal>
|
||||||
|
|
||||||
|
<!-- 三个点ed -->
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
tempNum: '',
|
||||||
|
dataVal: "",
|
||||||
|
show: false,
|
||||||
|
dotNum: '',
|
||||||
|
showModel: false,
|
||||||
|
folderList: [{
|
||||||
|
id: 1,
|
||||||
|
folderName: "资料查找"
|
||||||
|
}, {
|
||||||
|
id: 2,
|
||||||
|
folderName: "珍贵资料"
|
||||||
|
}, {
|
||||||
|
id: 3,
|
||||||
|
folderName: "影音文件夹"
|
||||||
|
}, {
|
||||||
|
id: 4,
|
||||||
|
folderName: "怀旧文件夹"
|
||||||
|
}, {
|
||||||
|
id: 5,
|
||||||
|
folderName: "资料查找"
|
||||||
|
}]
|
||||||
|
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
confirmModel() {
|
||||||
|
this.showModel = false;
|
||||||
|
console.log("++++++",this);
|
||||||
|
// this 打印不出来 ref 无法用
|
||||||
|
},
|
||||||
|
clickDot(num) {
|
||||||
|
this.dotNum = num
|
||||||
|
this.tempNum = Number(num)
|
||||||
|
},
|
||||||
|
editDir() {
|
||||||
|
|
||||||
|
uni.showToast({
|
||||||
|
title: "编辑目录"
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
},
|
||||||
|
delDir() {
|
||||||
|
|
||||||
|
this.showModel = true
|
||||||
|
},
|
||||||
|
GofileDetail(id) {
|
||||||
|
|
||||||
|
uni.navigateTo({
|
||||||
|
url: "/pages/folderDetail/folderDetail?id=" + String(id)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search_box {
|
||||||
|
padding: 32rpx;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.car_box {
|
||||||
|
width: 24px;
|
||||||
|
height: 24px;
|
||||||
|
margin-left: 12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.itm {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 32rpx;
|
||||||
|
height: 140rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
.fileImg {
|
||||||
|
width: 48rpx;
|
||||||
|
height: 48rpx;
|
||||||
|
margin-right: 24rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.data_detail_box {
|
||||||
|
flex: 1;
|
||||||
|
|
||||||
|
.file_title {
|
||||||
|
color: $black;
|
||||||
|
font-size: 28rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file_time {
|
||||||
|
color: $gray;
|
||||||
|
font-size: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.moreImg {
|
||||||
|
width: 40rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
|
||||||
|
.poup_edit_box {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-around;
|
||||||
|
position: absolute;
|
||||||
|
top: calc(50% + 20rpx);
|
||||||
|
right: calc(50% - 20rpx);
|
||||||
|
width: 260rpx;
|
||||||
|
height: 168rpx;
|
||||||
|
background: #FFFFFF;
|
||||||
|
|
||||||
|
box-shadow: 0px 4px 20px 1px rgba(0, 0, 0, 0.12);
|
||||||
|
border-radius: 4px 4px 4px 4px;
|
||||||
|
z-index: 99;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 24rpx;
|
||||||
|
|
||||||
|
.poup_edit {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.poup_del {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.bottm {
|
||||||
|
width: 96rpx;
|
||||||
|
height: 96rpx;
|
||||||
|
position: fixed;
|
||||||
|
bottom: 160rpx;
|
||||||
|
left: calc(100% - 122rpx);
|
||||||
|
border-radius: 50%;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.tan_con {
|
||||||
|
padding: 32rpx;
|
||||||
|
|
||||||
|
.tit {
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #251B1D;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.up_itm_box {
|
||||||
|
margin: 50rpx;
|
||||||
|
padding: 32rpx;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.img_itm {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.img {
|
||||||
|
width: 64rpx;
|
||||||
|
height: 64rpx;
|
||||||
|
margin-bottom: 24rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.Up_tit {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #251B1D;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,180 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<!-- 导航栏 -->
|
||||||
|
<view class="navbar">
|
||||||
|
<view class="status_bar" :style="{'height':statusHeight+'px'}"></view>
|
||||||
|
<view class="apptitle" :style="{'height':titleHeight+'px'}">
|
||||||
|
<image src="../../static/blackArrow.png" mode="" class="backImg" @click="back"></image>
|
||||||
|
<u-search height=42 margin="12px 0" searchIconColor="#251B1D" shape="square" :showAction="false"
|
||||||
|
v-model="searcOrderValue" placeholder="搜素我的订单"></u-search>
|
||||||
|
<view class="zz" :style="{'width':jiWidth+'px'}">
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!--导航栏ed -->
|
||||||
|
<view class="zhan" :style="{'height':(statusHeight+titleHeight+10)+'px'}">
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="top_tab_box" >
|
||||||
|
|
||||||
|
<view class="top_two_box">
|
||||||
|
<text>我买到的</text>
|
||||||
|
<text>我卖出的</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<u-tabs :scrollable="false" lineWidth="50rpx" lineColor="#99241B" :list="list1" :activeStyle="{
|
||||||
|
color: '#251B1D',
|
||||||
|
fontWeight: 'bold',
|
||||||
|
transform: 'scale(1.05)'
|
||||||
|
}" :inactiveStyle="{
|
||||||
|
color: '#AFADB0 ',
|
||||||
|
transform: 'scale(1)'
|
||||||
|
}" itemStyle=" height: 50px; ">
|
||||||
|
|
||||||
|
</u-tabs>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="order_box" v-for="(v,i) in 3">
|
||||||
|
<view class="order_itm_box">
|
||||||
|
<view class="order_itm_top" style="display: flex; justify-content: space-between;">
|
||||||
|
<view class="order_itm_top_left">
|
||||||
|
<image style="width: 36rpx; height: 36rpx;" src="../../static/DataSearch/Delet.png" mode="">
|
||||||
|
</image> <text>周科</text>
|
||||||
|
</view>
|
||||||
|
<text style="color: #FF6600;">买家已付款</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="order_itm_botm">
|
||||||
|
<image src="../../static/artRace/race2.png" style="width: 148rpx; height: 148rpx;" mode=""></image>
|
||||||
|
<view class="work_desc">
|
||||||
|
<view class="tit">
|
||||||
|
乡间小路
|
||||||
|
</view>
|
||||||
|
<view class="count">
|
||||||
|
<text style="color:#AFADB0;">x1</text>
|
||||||
|
<view class="ss">
|
||||||
|
<text style="color:#AFADB0;">合计</text>¥88
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="opt_box">
|
||||||
|
<u-button style="width: 100rpx;" shape="circle" size="mini" plain type="success">退款
|
||||||
|
</u-button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
statusHeight: 0,
|
||||||
|
titleHeight: 50,
|
||||||
|
jiWidth: 0,
|
||||||
|
list1: [{
|
||||||
|
name: '全部',
|
||||||
|
}, {
|
||||||
|
name: '待付款',
|
||||||
|
}, {
|
||||||
|
name: '待发货'
|
||||||
|
}, {
|
||||||
|
name: '已完成'
|
||||||
|
}],
|
||||||
|
searcOrderValue: ''
|
||||||
|
};
|
||||||
|
},
|
||||||
|
onReady() {
|
||||||
|
const systemMsg = uni.getSystemInfoSync();
|
||||||
|
this.statusHeight = systemMsg.statusBarHeight
|
||||||
|
|
||||||
|
// #ifdef MP-WEIXIN
|
||||||
|
const menuButtonInfo = uni.getMenuButtonBoundingClientRect() //胶囊
|
||||||
|
this.jiWidth = menuButtonInfo.width
|
||||||
|
this.titleHeight = menuButtonInfo.height + (menuButtonInfo.top - systemMsg.statusBarHeight) * 2
|
||||||
|
this.topHeight = this.statusHeight + this.titleHeight
|
||||||
|
// #endif
|
||||||
|
|
||||||
|
// #ifndef MP-WEIXIN
|
||||||
|
//除了小程序
|
||||||
|
this.topHeight = this.statusHeight + this.titleHeight
|
||||||
|
// #endif
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
page {
|
||||||
|
background-color: #F4F5F7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
z-index: 999;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
.apptitle {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 0 32rpx;
|
||||||
|
|
||||||
|
.backImg {
|
||||||
|
width: 40rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
margin-right: 32rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.top_tab_box {
|
||||||
|
.top_two_box {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.order_box {
|
||||||
|
.order_itm_box {
|
||||||
|
padding: 32rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
margin: 32rpx 32rpx 0rpx 32rpx;
|
||||||
|
border: 1px solid #FFFFFF;
|
||||||
|
|
||||||
|
.order_itm_top {
|
||||||
|
|
||||||
|
.order_itm_top_left {}
|
||||||
|
}
|
||||||
|
|
||||||
|
.order_itm_botm {
|
||||||
|
margin-top: 16rpx;
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.work_desc {
|
||||||
|
flex: 1;
|
||||||
|
|
||||||
|
.tit {}
|
||||||
|
|
||||||
|
.count {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.opt_box {}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,301 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- 导航栏 -->
|
||||||
|
<view class="navbar" >
|
||||||
|
<view class="status_bar" :style="{'height':statusHeight+'px'}"></view>
|
||||||
|
<view class="apptitle" :style="{'height':titleHeight+'px'}">
|
||||||
|
<image src="../../static/orderLeftArrow.png" mode="" class="backImg" @click="back"></image>
|
||||||
|
<view class="barLabel">
|
||||||
|
我的积分
|
||||||
|
</view>
|
||||||
|
<view class="zhan">
|
||||||
|
<!-- 占位 -->
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!--导航栏ed -->
|
||||||
|
|
||||||
|
<!-- 顶部背景区 -->
|
||||||
|
<view class="point_top">
|
||||||
|
<image style="width: 100%; height: 100%;" src="../../static/Mypoints/PointsBg.png" mode=""></image>
|
||||||
|
|
||||||
|
<view class="points_count"
|
||||||
|
>
|
||||||
|
<view class="points_count_itm">
|
||||||
|
<view class="tt1" >
|
||||||
|
可用积分
|
||||||
|
</view>
|
||||||
|
<view class="tt2" >
|
||||||
|
586
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="points_count_itm" style="margin-left:200rpx ;">
|
||||||
|
<view class="tt1" >
|
||||||
|
年度积分总量
|
||||||
|
</view>
|
||||||
|
<view class="tt2" >
|
||||||
|
6853
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="mult">
|
||||||
|
|
||||||
|
<!-- 限时任务区 -->
|
||||||
|
<view class="pointBox">
|
||||||
|
<view class="P_title">
|
||||||
|
<text class="L_title">限时任务</text>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
<view class="piont_itm">
|
||||||
|
<view class="piont_itm_L">
|
||||||
|
<image style="width: 64rpx; height: 64rpx; " src="../../static/Mypoints/cloud.png" mode="">
|
||||||
|
</image>
|
||||||
|
<view class="content">
|
||||||
|
<view class="tit">
|
||||||
|
浏览每一日
|
||||||
|
</view>
|
||||||
|
<view class="con">
|
||||||
|
+3积分
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="operation">
|
||||||
|
<u-button type="default" plain size="small" color="#99241B"> 去完成</u-button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- 积分任务区 -->
|
||||||
|
<view class="pointBox">
|
||||||
|
<view class="P_title">
|
||||||
|
<text class="L_title">积分任务</text>
|
||||||
|
<view class="right_arr_box" style="color: gray; display: flex;align-items: center;">
|
||||||
|
|
||||||
|
<image class="R_arr" src="../../static/Mypoints/rightArrow.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
<view class="piont_itm" v-for="(v,i) in 5" :key="i">
|
||||||
|
<view class="piont_itm_L">
|
||||||
|
<image style="width: 64rpx; height: 64rpx; " src="../../static/Mypoints/cloud.png" mode="">
|
||||||
|
</image>
|
||||||
|
<view class="content">
|
||||||
|
<view class="tit">
|
||||||
|
浏览每一日
|
||||||
|
</view>
|
||||||
|
<view class="con">
|
||||||
|
+3积分
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="operation">
|
||||||
|
<u-button v-if="i==0||i==1||i==2" type="default" plain size="small" color="#AFADB0"> 已完成
|
||||||
|
</u-button>
|
||||||
|
<u-button v-if="i==3||i==4" type="default" plain size="small" color="#99241B "> 去完成</u-button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- 积分明细区 -->
|
||||||
|
<view class="pointBox">
|
||||||
|
|
||||||
|
<view class="P_title">
|
||||||
|
<text class="L_title">积分明细</text>
|
||||||
|
<view class="right_arr_box" style="color: gray; display: flex;align-items: center;">
|
||||||
|
<text>点击查看明细</text>
|
||||||
|
<image class="R_arr" src="../../static/Mypoints/rightArrow.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
statusHeight: 0,
|
||||||
|
titleHeight: 50,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
back(){
|
||||||
|
uni.navigateBack()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onReady() {
|
||||||
|
const systemMsg = uni.getSystemInfoSync();
|
||||||
|
this.statusHeight = systemMsg.statusBarHeight
|
||||||
|
|
||||||
|
// #ifdef MP-WEIXIN
|
||||||
|
const menuButtonInfo = uni.getMenuButtonBoundingClientRect() //胶囊
|
||||||
|
this.titleHeight = menuButtonInfo.height + (menuButtonInfo.top - systemMsg.statusBarHeight) * 2
|
||||||
|
this.topHeight = this.statusHeight + this.titleHeight
|
||||||
|
// #endif
|
||||||
|
|
||||||
|
// #ifndef MP-WEIXIN
|
||||||
|
//除了小程序
|
||||||
|
this.topHeight = this.statusHeight + this.titleHeight
|
||||||
|
// #endif
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
page {
|
||||||
|
background-color: #F8F8F8;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.navbar {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
z-index: 999;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
color: #FFFFFF;
|
||||||
|
.apptitle {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 0 32rpx;
|
||||||
|
|
||||||
|
.backImg {
|
||||||
|
width: 40rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
margin-right: 32rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.barLabel {
|
||||||
|
flex: 1;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 32rpx;
|
||||||
|
}
|
||||||
|
.zhan{
|
||||||
|
width: 40rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.point_top {
|
||||||
|
height: 560rpx;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.return {
|
||||||
|
position: absolute;
|
||||||
|
top: 40rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
width: calc(100% - 64rpx);
|
||||||
|
margin: 0 32rpx;
|
||||||
|
|
||||||
|
.Nav_title {
|
||||||
|
color: #FFFFFF;
|
||||||
|
font-size: 32rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.points_count{
|
||||||
|
display: flex; position: absolute;bottom: 240rpx; border: 1px solid transparnet; width:calc(100% - 80rpx) ; margin: 0 40rpx;
|
||||||
|
.points_count_itm{
|
||||||
|
.tt1{color: #ACAEB7; font-size: 32rpx;}
|
||||||
|
.tt2{
|
||||||
|
color: #FFFFFF; font-size: 48rpx; margin-top: 16rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mult {
|
||||||
|
position: absolute;
|
||||||
|
top: 400rpx;
|
||||||
|
width: calc(100% - 64rpx);
|
||||||
|
margin: 0 32rpx;
|
||||||
|
|
||||||
|
.pointBox {
|
||||||
|
margin-bottom: 24rpx;
|
||||||
|
padding: 24rpx;
|
||||||
|
border: 1px solid transparnet;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
border-radius: 8px;
|
||||||
|
|
||||||
|
.P_title {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.piont_itm {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-top: 40rpx;
|
||||||
|
|
||||||
|
.piont_itm_L {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.content {
|
||||||
|
margin-left: 24rpx;
|
||||||
|
|
||||||
|
.tit {
|
||||||
|
color: $black;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 28rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.con {
|
||||||
|
color: $gray;
|
||||||
|
font-size: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.operation {}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.R_arr {
|
||||||
|
width: 48rpx;
|
||||||
|
height: 48rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.L_title {
|
||||||
|
color: $black;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 32rpx;
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,267 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<view class="page-section">
|
||||||
|
<view class="page-section-spacing">
|
||||||
|
<swiper class="swiper" :autoplay="autoplay" :interval="interval" indicator-dots :duration="duration">
|
||||||
|
<swiper-item v-for="(v,i) in img" :key="i">
|
||||||
|
<view class="swiper_box">
|
||||||
|
<image class="swiper_img" :src='img[i]' mode="aspectFill"></image>
|
||||||
|
</view>
|
||||||
|
</swiper-item>
|
||||||
|
</swiper>
|
||||||
|
</view>
|
||||||
|
<view class="return" @click="back()">
|
||||||
|
|
||||||
|
<image src="../../static/orderLeftArrow.png" mode="scaleToFill"></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- 定位卡片 -->
|
||||||
|
<view class="positon_box">
|
||||||
|
|
||||||
|
<!-- 顶部卡片 -->
|
||||||
|
|
||||||
|
<view class="topcard">
|
||||||
|
<view class="free_box">
|
||||||
|
<view style="font-weight: bold;font-size: 44rpx;color: #FF6600;">
|
||||||
|
<!-- {{serveList.type}} -->
|
||||||
|
25 <text style="font-size: 24rpx;">积分</text>
|
||||||
|
</view>
|
||||||
|
<view class="" style="display: flex; align-items: center; justify-content: center;">
|
||||||
|
<!-- <image src="../../static/DunIcon.png" style="width: 32rpx;height: 32rpx;" mode=""></image> -->
|
||||||
|
<view class="sale_count" style="color: gray; font-size: 12px;">
|
||||||
|
月销量48
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<text style="font-weight: 400; font-size: 24rpx;color: #AFADB0;">
|
||||||
|
{{serveList.score}}
|
||||||
|
</text>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
<view class="guandao">
|
||||||
|
{{serveList.title}}
|
||||||
|
</view>
|
||||||
|
<view style="font-size: 24rpx; margin-bottom: 16rpx;">
|
||||||
|
<text style="color: #AFADB0;">作者:</text>
|
||||||
|
<text>{{serveList.publisher}} 周科</text>
|
||||||
|
</view>
|
||||||
|
<view style="font-size: 24rpx;">
|
||||||
|
<text style="color: #AFADB0;">上传时间:</text>
|
||||||
|
<text>{{serveList.createdAt}} 2021-02-24 </text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 服务卡片 -->
|
||||||
|
<view class=" serve_card">
|
||||||
|
<view class="serve_ind">
|
||||||
|
作品详情
|
||||||
|
</view>
|
||||||
|
<view class="serve_dec">
|
||||||
|
{{serveList.content}}
|
||||||
|
象山全域旅游摄影图片征集活动获奖照片,全面展示象山岁月 沧桑和现代时尚之美
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="operation">
|
||||||
|
<view class="start_icon" style="width: 60rpx;height: 80rpx; ">
|
||||||
|
<view style="width: 40rpx; height: 40rpx;" class="col_icon ">
|
||||||
|
<image style="width: 100%; height: 100%;" src="../../static/star.png"></image>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="col_txt" style="font-size: 20rpx; width: 60rpx;">
|
||||||
|
收藏
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="btn_contain" style="display: flex;">
|
||||||
|
<button type="default" class="addCar" @click="colection()">加入购物车</button>
|
||||||
|
<button type="default" class="buy" @click="appointment()">立即购买</button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
id: '',
|
||||||
|
indicatorDots: true,
|
||||||
|
autoplay: true,
|
||||||
|
interval: 5000,
|
||||||
|
duration: 500,
|
||||||
|
serveList: [],
|
||||||
|
img: ["../../static/orderDetail.png", "../../static/orderDetail.png"],
|
||||||
|
bookId: '',
|
||||||
|
collId: '',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
back() {
|
||||||
|
uni.navigateBack()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad(option) {
|
||||||
|
console.log(option.id);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
/deep/ uni-swiper .uni-swiper-dots-horizontal {
|
||||||
|
bottom: 120rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
page {
|
||||||
|
background-color: #F4F5F7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.positon_box {
|
||||||
|
position: fixed;
|
||||||
|
top: 400rpx;
|
||||||
|
padding: 0 24rpx;
|
||||||
|
width: calc(100% - 48rpx);
|
||||||
|
|
||||||
|
.topcard {
|
||||||
|
border: 2rpx solid #FFFFFF;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 32rpx 24rpx;
|
||||||
|
|
||||||
|
.free_box {
|
||||||
|
border: 2rpx solid #FFFFFF;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.guandao {
|
||||||
|
font-size: 36rpx;
|
||||||
|
color: #251B1D;
|
||||||
|
font-weight: 600;
|
||||||
|
margin-top: 28rpx;
|
||||||
|
margin-bottom: 32rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.serve_card {
|
||||||
|
border: 1rpx solid #FFFFFF;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 32rpx 24rpx;
|
||||||
|
margin-top: 24rpx;
|
||||||
|
|
||||||
|
.serve_ind {
|
||||||
|
color: #251B1D;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.serve_dec {
|
||||||
|
font-size: 24rpx;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #AFADB0;
|
||||||
|
margin-top: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.page-section {
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.return {
|
||||||
|
position: absolute;
|
||||||
|
left: 24rpx;
|
||||||
|
top: 110rpx;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 48rpx;
|
||||||
|
height: 48rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
swiper {
|
||||||
|
height: 500rpx;
|
||||||
|
|
||||||
|
.swiper_box {
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
width: 100%;
|
||||||
|
height: 500rpx;
|
||||||
|
|
||||||
|
.swiper_img {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
// position: absolute;
|
||||||
|
// left: 50%;
|
||||||
|
// top: 50%;
|
||||||
|
// transform: translate(-50%,-50%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.operation {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 32rpx 32rpx 48rpx;
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
right: 0;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
box-shadow: 0px -4px 10px 1px rgba(192, 192, 192, 0.12);
|
||||||
|
|
||||||
|
|
||||||
|
.addCar {
|
||||||
|
width: 284rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
line-height: 80rpx;
|
||||||
|
// flex: 0 0 240rpx;
|
||||||
|
margin-right: 24rpx;
|
||||||
|
background-color: #F1F7FF;
|
||||||
|
color: #99241B;
|
||||||
|
font-size: 24rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
border: 1px solid #99241B;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.buy {
|
||||||
|
width: 284rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
line-height: 80rpx;
|
||||||
|
// flex: 1;
|
||||||
|
background-color: #99241B;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 24rpx;
|
||||||
|
// font-weight: bold;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
button {
|
||||||
|
&::after {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,43 @@
|
||||||
|
<template>
|
||||||
|
<view >
|
||||||
|
<view class="express_contain" v-for="(v,i) in 5" :key="i">
|
||||||
|
<view class="express_contain_content">
|
||||||
|
关于启动2021年 度区上规模民营企业调查及拟推荐“民 营企业500强”的通知
|
||||||
|
</view>
|
||||||
|
<view class="express_contain_sub">
|
||||||
|
区工商联办 2021/04/12
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.express_contain {
|
||||||
|
padding: 20px 16px;
|
||||||
|
.express_contain_content {
|
||||||
|
color: #32333B;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 14px;
|
||||||
|
font-family: PingFang SC-Semibold, PingFang SC;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.express_contain_sub {
|
||||||
|
margin-top: 12px;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #8E8F9E;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,157 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<!-- 发布作品 -->
|
||||||
|
|
||||||
|
<u--input style="padding: 32rpx;" placeholder="请输入作品名称" border="bottom" clearable></u--input>
|
||||||
|
<u--input style="padding: 32rpx;" placeholder="请选择作品类型" border="bottom" clearable>
|
||||||
|
<u-icon slot="suffix" name="arrow-right"></u-icon>
|
||||||
|
</u--input>
|
||||||
|
|
||||||
|
<u--textarea style="padding: 32rpx;" v-model="value" placeholder="请输入作品说明" border="none"></u--textarea>
|
||||||
|
<view class="gap">
|
||||||
|
作品内容可上传图片/视频/音频等
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<u-upload class="upload" accept="media" width="172rpx" height="172rpx" :fileList="fileList3"
|
||||||
|
@afterRead="afterRead" @delete="deletePic" name="3" multiple :maxCount="2">
|
||||||
|
<image style="width: 172rpx;height: 172rpx;" src="../../static/improveData/jia.png"></image>
|
||||||
|
</u-upload>
|
||||||
|
|
||||||
|
|
||||||
|
<view class="operation">
|
||||||
|
<button type="default" class="next" @click="next">下一步</button>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<view class="zhanwei">
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
value: '',
|
||||||
|
fileList3: [],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
next() {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: "/pages/PublishWorks/PublishWorksNext"
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 删除图片
|
||||||
|
deletePic(event) {
|
||||||
|
this[`fileList${event.name}`].splice(event.index, 1)
|
||||||
|
},
|
||||||
|
// 新增图片
|
||||||
|
async afterRead(event) {
|
||||||
|
// 当设置 mutiple 为 true 时, file 为数组格式,否则为对象格式
|
||||||
|
let lists = [].concat(event.file)
|
||||||
|
let fileListLen = this[`fileList${event.name}`].length
|
||||||
|
lists.map((item) => {
|
||||||
|
this[`fileList${event.name}`].push({
|
||||||
|
...item,
|
||||||
|
status: 'uploading',
|
||||||
|
message: '上传中'
|
||||||
|
})
|
||||||
|
})
|
||||||
|
for (let i = 0; i < lists.length; i++) {
|
||||||
|
const result = await this.uploadFilePromise(lists[i].url)
|
||||||
|
let item = this[`fileList${event.name}`][fileListLen]
|
||||||
|
this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
|
||||||
|
status: 'success',
|
||||||
|
message: '',
|
||||||
|
url: result
|
||||||
|
}))
|
||||||
|
fileListLen++
|
||||||
|
}
|
||||||
|
},
|
||||||
|
uploadFilePromise(url) {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
let a = uni.uploadFile({
|
||||||
|
url: 'http://192.168.2.21:7001/upload', // 仅为示例,非真实的接口地址
|
||||||
|
filePath: url,
|
||||||
|
name: 'file',
|
||||||
|
formData: {
|
||||||
|
user: 'test'
|
||||||
|
},
|
||||||
|
success: (res) => {
|
||||||
|
setTimeout(() => {
|
||||||
|
resolve(res.data.data)
|
||||||
|
}, 1000)
|
||||||
|
}
|
||||||
|
});
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.gap {
|
||||||
|
font-size: 24rpx;
|
||||||
|
|
||||||
|
color: #AFADB0;
|
||||||
|
height: 80rpx;
|
||||||
|
background: #F5F5F5;
|
||||||
|
border-radius: 0px 0px 0px 0px;
|
||||||
|
opacity: 1;
|
||||||
|
line-height: 80rpx;
|
||||||
|
padding: 0 32rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.upload {
|
||||||
|
padding: 32rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.operation {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 32rpx 32rpx 48rpx;
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
right: 0;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
box-shadow: 0px -4px 10px 1px rgba(192, 192, 192, 0.12);
|
||||||
|
|
||||||
|
.next {
|
||||||
|
width: calc(100% - 48rpx);
|
||||||
|
height: 80rpx;
|
||||||
|
line-height: 80rpx;
|
||||||
|
|
||||||
|
background-color: #99241B;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
|
||||||
|
border: none;
|
||||||
|
|
||||||
|
button {
|
||||||
|
&::after {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.zhanwei {
|
||||||
|
height: 460rpx;
|
||||||
|
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,185 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<view class="bg">
|
||||||
|
<image src="../../static/puplishBG.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
<view class="rightBox" @click="showSex=true">
|
||||||
|
<text class="right_titl" style="color: #251B1D; font-weight: 600;margin-left: 32rpx;"> 作品使用权限</text>
|
||||||
|
<u--input fontSize="28rpx" border="none" readonly v-model="v1" disabledColor="#ffffff"
|
||||||
|
placeholder="请选择作品使用权限" inputAlign="right">
|
||||||
|
<u-icon slot="suffix" name="arrow-right"></u-icon>
|
||||||
|
</u--input>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="sub_ti_box" v-if="v1=='付费购买'" >
|
||||||
|
<text class="right_titl">使用费用</text>
|
||||||
|
<u--input placeholder="请输入使用费用" inputAlign="right" border="none" type="number" value=""></u--input> <text
|
||||||
|
style="margin-left: 16rpx;">元</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="sub_ti_box" v-if="v1=='积分购买'" >
|
||||||
|
<text class="right_titl">使用积分</text>
|
||||||
|
<u--input placeholder="请输入使用积分" inputAlign="right" type="number" border="none" value=""></u--input> <text style="margin-left: 16rpx;">积分</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<u-popup :show="showSex" @close="close" @open="open" closeOnClickOverlay :round="5"
|
||||||
|
customStyle="padding: 16px;">
|
||||||
|
<u-radio-group @change="selectForm" v-model="radiovalue7" :borderBottom="true" placement="column"
|
||||||
|
iconPlacement="right">
|
||||||
|
<u-radio :customStyle="{marginBottom: '16px' }" v-for="(item, index) in radiolist7" :key="index"
|
||||||
|
:label="item.name" labelSize="28rpx" labelColor="#231F1C" :name="item.name" activeColor="#99241B ">
|
||||||
|
</u-radio>
|
||||||
|
<u-button class="custom-style" style="background-color:#99241B ; color: #FFFFFF; margin-top: 32rpx;"
|
||||||
|
type="default" @click="showSex=false">确认</u-button>
|
||||||
|
</u-radio-group>
|
||||||
|
</u-popup>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<view class="operation">
|
||||||
|
<button type="default" class="collection" @click="goPre">上一步</button>
|
||||||
|
<button type="default" class="apply" @click="cfmPub()">确认发布</button>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
showSex: false,
|
||||||
|
v1: "",
|
||||||
|
radiovalue7: '',
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
radiolist7: [{
|
||||||
|
name: '免费使用',
|
||||||
|
disabled: false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '付费购买',
|
||||||
|
disabled: false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '积分购买',
|
||||||
|
disabled: false
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
name: '面议',
|
||||||
|
disabled: false
|
||||||
|
}
|
||||||
|
],
|
||||||
|
radio: '',
|
||||||
|
switchVal: false
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
goPre() {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: "/pages/PublishWorks/PublishWorks"
|
||||||
|
})
|
||||||
|
},
|
||||||
|
cfmPub() {
|
||||||
|
|
||||||
|
uni.showToast({
|
||||||
|
title: '确认发布',
|
||||||
|
duration: 2000
|
||||||
|
});
|
||||||
|
},
|
||||||
|
sexSelect(e) {
|
||||||
|
this.model1.userInfo.rights = e.name
|
||||||
|
|
||||||
|
} ,
|
||||||
|
selectForm(form) {
|
||||||
|
|
||||||
|
this.v1 = form
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg {
|
||||||
|
height: 520rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.rightBox {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
height: 104rpx;
|
||||||
|
border: 1px solid transparent;
|
||||||
|
margin-top: 16rpx;
|
||||||
|
|
||||||
|
}
|
||||||
|
.sub_ti_box{
|
||||||
|
display: flex; align-items: center; margin: 0 32rpx;
|
||||||
|
padding: 32rpx 0;
|
||||||
|
.right_titl{
|
||||||
|
font-weight: 600;
|
||||||
|
color: $black;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.operation {
|
||||||
|
display: flex;
|
||||||
|
padding: 32rpx 32rpx 48rpx;
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
right: 0;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
box-shadow: 0px -4px 10px 1px rgba(192, 192, 192, 0.12);
|
||||||
|
|
||||||
|
.collection {
|
||||||
|
|
||||||
|
flex: 1;
|
||||||
|
margin-right: 24rpx;
|
||||||
|
background-color: #F5F5F5;
|
||||||
|
color: #251B1D;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.apply {
|
||||||
|
flex: 1;
|
||||||
|
|
||||||
|
background-color: $red;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
&::after {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ff {
|
||||||
|
padding-top: 16px;
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,241 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
|
||||||
|
<!-- 导航栏 -->
|
||||||
|
<view class="navbar">
|
||||||
|
<view class="status_bar" :style="{'height':statusHeight+'px'}"></view>
|
||||||
|
<view class="apptitle" :style="{'height':titleHeight+'px'}">
|
||||||
|
<image src="../../static/blackArrow.png" mode="" class="backImg" @click="back"></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!--导航栏ed -->
|
||||||
|
|
||||||
|
<view class="select_bg">
|
||||||
|
<image src="../../static/selectID/selectIdBG.png" mode=""></image>
|
||||||
|
<view class="tips">
|
||||||
|
<view class="selct_tips">
|
||||||
|
请选择您的身份
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="select_sm_tips">
|
||||||
|
选择身份后不能修改哦!
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<view class="itm_id_contain" v-for="(v,i) in selectList" :key="i">
|
||||||
|
<view :class=" id === i ? ' itm_id_selected' :'itm_id'" @click="confirm_id(i)">
|
||||||
|
<view>
|
||||||
|
<!-- 政协委员 -->
|
||||||
|
{{v}}
|
||||||
|
</view>
|
||||||
|
<view class="gou">
|
||||||
|
<image src="../../static/selectID/gouXuan.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<view class="operation">
|
||||||
|
<button type="default" class="next" @click="next">下一步</button>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="zhan">
|
||||||
|
<!-- zhanwei -->
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
id:8,
|
||||||
|
statusHeight: 0,
|
||||||
|
titleHeight: 50,
|
||||||
|
selectList: ["协会会员", "文艺人才", "文艺志愿者", "服务商", ]
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
next() {
|
||||||
|
console.log("下一步");
|
||||||
|
if(this.id<8){
|
||||||
|
var that=this
|
||||||
|
uni.navigateTo({
|
||||||
|
url:`/pages/improveData/improveData?id=${that.id}`
|
||||||
|
})
|
||||||
|
}else{
|
||||||
|
|
||||||
|
uni.showToast({
|
||||||
|
title: '请选择身份',
|
||||||
|
duration: 2000,
|
||||||
|
icon:'error'
|
||||||
|
});
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
back() {
|
||||||
|
uni.navigateBack()
|
||||||
|
},
|
||||||
|
confirm_id(id){
|
||||||
|
this.id=id
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onReady() {
|
||||||
|
const systemMsg = uni.getSystemInfoSync();
|
||||||
|
this.statusHeight = systemMsg.statusBarHeight
|
||||||
|
|
||||||
|
// #ifdef MP-WEIXIN
|
||||||
|
const menuButtonInfo = uni.getMenuButtonBoundingClientRect() //胶囊
|
||||||
|
this.titleHeight = menuButtonInfo.height + (menuButtonInfo.top - systemMsg.statusBarHeight) * 2
|
||||||
|
this.topHeight = this.statusHeight + this.titleHeight
|
||||||
|
// #endif
|
||||||
|
|
||||||
|
// #ifndef MP-WEIXIN
|
||||||
|
//除了小程序
|
||||||
|
this.topHeight = this.statusHeight + this.titleHeight
|
||||||
|
// #endif
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.zhan{
|
||||||
|
height: 160rpx;
|
||||||
|
}
|
||||||
|
.select_bg {
|
||||||
|
height: 408rpx;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.tips {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 100rpx;
|
||||||
|
left: 32rpx;
|
||||||
|
|
||||||
|
.selct_tips {
|
||||||
|
color: $black;
|
||||||
|
font-size: 48rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.select_sm_tips {
|
||||||
|
margin-top: 16rpx;
|
||||||
|
color: #868785;
|
||||||
|
font-size: 28rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.itm_id_contain {
|
||||||
|
|
||||||
|
padding: 32rpx;
|
||||||
|
|
||||||
|
.itm_id {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
height: 180rpx;
|
||||||
|
background-color: #FAFAFA;
|
||||||
|
padding: 24rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
font-size: 36rpx;
|
||||||
|
color: $black;
|
||||||
|
font-weight: 600;
|
||||||
|
|
||||||
|
.gou {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.itm_id_selected {
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
font-weight: 600;
|
||||||
|
color: $red;
|
||||||
|
background-color: #FBF0EF;
|
||||||
|
border: 1px solid #99241B;
|
||||||
|
height: 180rpx;
|
||||||
|
padding: 24rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
font-size: 36rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
|
||||||
|
.gou {
|
||||||
|
width: 48rpx;
|
||||||
|
height: 48rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.operation {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 32rpx 32rpx 48rpx;
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
right: 0;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
box-shadow: 0px -4px 10px 1px rgba(192, 192, 192, 0.12);
|
||||||
|
|
||||||
|
.next {
|
||||||
|
width: calc(100% - 48rpx);
|
||||||
|
height: 80rpx;
|
||||||
|
line-height: 80rpx;
|
||||||
|
|
||||||
|
background-color: #99241B;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
|
||||||
|
border: none;
|
||||||
|
|
||||||
|
button {
|
||||||
|
&::after {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.navbar {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
z-index: 999;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
.apptitle {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 0 32rpx;
|
||||||
|
|
||||||
|
.backImg {
|
||||||
|
width: 40rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
margin-right: 32rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,137 @@
|
||||||
|
<template>
|
||||||
|
<view class="page">
|
||||||
|
<view class="pageTtitle">
|
||||||
|
<view class="status_bar" :style="{'height':statusHeight+'px'}"></view>
|
||||||
|
<view class="apptitle" :style="{'height':titleHeight+'px'}">
|
||||||
|
动态
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view :style="{'height':zwHeight+'px'}"></view>
|
||||||
|
<view class="activity" v-for="(v,i) in num" :key="i">
|
||||||
|
<view class="left">
|
||||||
|
<view class="content">
|
||||||
|
<view class="title">
|
||||||
|
<text class="zd">置顶</text>
|
||||||
|
送万福、进万家文艺惠民 暖人心嫁得好风扇电机接收到删掉就惊世毒妃
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="clidate">
|
||||||
|
<view class="cliNum">点击量:15万</view>
|
||||||
|
<view class="date">2022-01-11</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="right">
|
||||||
|
<image src="../../static/icon12.jpg" mode=""></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<tabbar tabbarId='2'></tabbar>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
statusHeight: 0,
|
||||||
|
titleHeight: 50,
|
||||||
|
zwHeight: 0,
|
||||||
|
num:4
|
||||||
|
};
|
||||||
|
},
|
||||||
|
onReady() {
|
||||||
|
const systemMsg = uni.getSystemInfoSync();
|
||||||
|
this.statusHeight = systemMsg.statusBarHeight
|
||||||
|
|
||||||
|
// #ifdef MP-WEIXIN
|
||||||
|
const menuButtonInfo = uni.getMenuButtonBoundingClientRect() //胶囊
|
||||||
|
this.titleHeight = menuButtonInfo.height + (menuButtonInfo.top - systemMsg.statusBarHeight) * 2
|
||||||
|
this.zwHeight = this.statusHeight + this.titleHeight
|
||||||
|
// #endif
|
||||||
|
|
||||||
|
// #ifndef MP-WEIXIN
|
||||||
|
//除了微信小程序
|
||||||
|
this.zwHeight = this.statusHeight + this.titleHeight
|
||||||
|
// #endif
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.zd {
|
||||||
|
width: 30px;
|
||||||
|
height: 16px;
|
||||||
|
line-height: 16px;
|
||||||
|
margin-right: 4px;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 10px;
|
||||||
|
background: #F57369;
|
||||||
|
color: #FFFFFF;
|
||||||
|
border-radius: 2px 2px 2px 2px;
|
||||||
|
display: inline-block;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.page {
|
||||||
|
padding:0 16px;
|
||||||
|
padding-bottom:55px;
|
||||||
|
.pageTtitle {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
padding: 0 16px;
|
||||||
|
z-index: 999;
|
||||||
|
box-sizing:border-box;
|
||||||
|
.apptitle {
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: 800;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.activity {
|
||||||
|
display: flex;
|
||||||
|
padding-top:10px;
|
||||||
|
padding-bottom:10px;
|
||||||
|
border-bottom:1px solid #F5F5F5;
|
||||||
|
&:last-of-type{
|
||||||
|
border-bottom:none;
|
||||||
|
}
|
||||||
|
.left {
|
||||||
|
flex: 1;
|
||||||
|
display:flex;
|
||||||
|
flex-direction:column;
|
||||||
|
justify-content:space-between;
|
||||||
|
.content {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.clidate {
|
||||||
|
margin-top: 6px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
font-size: 12px;
|
||||||
|
color: #8E8F9E;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.right {
|
||||||
|
margin-left: 10px;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 124px;
|
||||||
|
height: 93px;
|
||||||
|
border-radius:4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,122 @@
|
||||||
|
<template>
|
||||||
|
<view class="layout">
|
||||||
|
<search></search>
|
||||||
|
<view class="screen">
|
||||||
|
<view class="date" @click="show = true">
|
||||||
|
<text>{{dateTime}}</text>
|
||||||
|
<u-icon name="arrow-down-fill" size="10" color="#007aff"></u-icon>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- 年月日 -->
|
||||||
|
<u-datetime-picker ref="datetimePicker" :formatter="formatter" :show="show" v-model="defaultTime" mode="date"
|
||||||
|
@confirm="confirmDate" @cancel="show = false" :closeOnClickOverlay="true" @close="show = false">
|
||||||
|
</u-datetime-picker>
|
||||||
|
<view class="shelves">
|
||||||
|
<view class="shelves-item">
|
||||||
|
<image src="../../static/icon12.jpg" mode="widthFix" class="shelves-img"></image>
|
||||||
|
<view class="name">作品名称</view>
|
||||||
|
</view>
|
||||||
|
<view class="" style="width:16px;"></view>
|
||||||
|
<view class="shelves-item">
|
||||||
|
<image src="../../static/icon12.jpg" mode="widthFix" class="shelves-img"></image>
|
||||||
|
<view class="name">作品名称</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import search from "@/components/search/search.vue"
|
||||||
|
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
search
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
dateTime: '',
|
||||||
|
defaultTime: Number(new Date()),
|
||||||
|
show: false,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
onReady() {
|
||||||
|
let date = new Date()
|
||||||
|
let Y = date.getFullYear()
|
||||||
|
let M = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : (date.getMonth() + 1)
|
||||||
|
let D = date.getDate() < 10 ? ('0' + date.getDate()) : date.getDate()
|
||||||
|
this.dateTime = Y + '-' + M + '-' + D
|
||||||
|
// #ifdef MP-WEIXIN
|
||||||
|
// 微信小程序设置格式
|
||||||
|
this.$refs.datetimePicker.setFormatter(this.formatter)
|
||||||
|
// #endif
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
confirmDate(val) {
|
||||||
|
let date = new Date(val.value)
|
||||||
|
var Y = date.getFullYear()
|
||||||
|
var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1)
|
||||||
|
const D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate())
|
||||||
|
this.dateTime = Y + '-' + M + '-' + D
|
||||||
|
this.show = false
|
||||||
|
},
|
||||||
|
formatter(type, value) {
|
||||||
|
if (type === 'year') {
|
||||||
|
return `${value}年`
|
||||||
|
}
|
||||||
|
if (type === 'month') {
|
||||||
|
return `${value}月`
|
||||||
|
}
|
||||||
|
if (type === 'day') {
|
||||||
|
return `${value}日`
|
||||||
|
}
|
||||||
|
return value
|
||||||
|
},
|
||||||
|
},
|
||||||
|
onLoad(option){
|
||||||
|
console.log(option.id);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.layout {
|
||||||
|
padding: 8px 16px;
|
||||||
|
|
||||||
|
.screen {
|
||||||
|
margin-top:12px;
|
||||||
|
display: flex;
|
||||||
|
.date {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
color: #007aff;
|
||||||
|
padding: 2px 10px;
|
||||||
|
border: 1px solid #007aff;
|
||||||
|
border-radius: 24px;
|
||||||
|
.text {
|
||||||
|
margin-right: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.shelves {
|
||||||
|
display: flex;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
.shelves-item {
|
||||||
|
width: 50%;
|
||||||
|
margin-top: 16px;
|
||||||
|
|
||||||
|
.shelves-img {
|
||||||
|
border-radius: 8px 8px 8px 8px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.name {
|
||||||
|
font-weight: 800;
|
||||||
|
font-size: 16px;
|
||||||
|
margin-top: 6px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,243 @@
|
||||||
|
<template>
|
||||||
|
<view class="famous_arts">
|
||||||
|
<view class="ding">
|
||||||
|
<view class="top">
|
||||||
|
|
||||||
|
<view class="left">
|
||||||
|
<view class="avator">
|
||||||
|
<image src="../../static/MoneyIco.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="people">
|
||||||
|
<view class="art_name">
|
||||||
|
吕茂盛
|
||||||
|
</view>
|
||||||
|
<view class="aer_Staff">
|
||||||
|
书法家
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="talk" @click="goTalk">
|
||||||
|
<image class="concat_ico" src="../../static/FamousArts/Talk.png" mode=""></image>
|
||||||
|
发起聊天
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- tabs -->
|
||||||
|
<u-tabs @click="clickTab" :scrollable="false" :list="list1" :activeStyle="{
|
||||||
|
color: '#251B1D',
|
||||||
|
fontWeight: 'bold',
|
||||||
|
transform: 'scale(1.05)'
|
||||||
|
}" :inactiveStyle="{
|
||||||
|
color: '#AFADB0 ',
|
||||||
|
transform: 'scale(1)'
|
||||||
|
}" itemStyle=" height: 50px; ">
|
||||||
|
</u-tabs>
|
||||||
|
<!-- tabs ed -->
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="famous_bot" v-show="id=='1'">
|
||||||
|
<view class="famous_bot_itm" v-for="(v,i) in 5" :key="i">
|
||||||
|
<view class="ico">
|
||||||
|
<image src="../../static/FamousArts/redStart.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="con">
|
||||||
|
中国书法作家协会
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
<view class="famous_bot" v-show="id=='2'">
|
||||||
|
<view class="famous_bot_itm" v-for="(v,i) in 5" :key="i">
|
||||||
|
<view class="ico" style="padding-right: 8rpx;">
|
||||||
|
<image style="width: 32rpx; height: 32rpx; vertical-align: bottom;"
|
||||||
|
src="../../static/FamousArts/goldCup.png"></image>
|
||||||
|
</view>
|
||||||
|
<view class="con" style="line-height: 50rpx;">
|
||||||
|
省文联主办的“与党同心庆祝十八大——全党党 外知识分子书画摄影作品展”获优秀作品奖
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
<view class="famous_bot" style="" v-show="id=='3'">
|
||||||
|
<view class="famous_bot_itm" style="display: block;" v-for="(v,i) in 5" :key="i">
|
||||||
|
<view class="works">
|
||||||
|
<image src="../../static/maqian.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="works_name">
|
||||||
|
司马迁书信
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
id: "3",
|
||||||
|
list1: [{
|
||||||
|
name: '艺术成就',
|
||||||
|
id: '1'
|
||||||
|
}, {
|
||||||
|
name: '荣誉奖项',
|
||||||
|
id: '2'
|
||||||
|
}, {
|
||||||
|
name: '代表作',
|
||||||
|
id: '3'
|
||||||
|
}]
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
clickTab(itm) {
|
||||||
|
this.id = itm.id
|
||||||
|
},
|
||||||
|
goTalk(){
|
||||||
|
uni.showToast({
|
||||||
|
title:"发起聊天"
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad(option) {
|
||||||
|
console.log(option.id);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
/deep/ .u-tabs__wrapper__nav__item__text {
|
||||||
|
font-size: 28rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
/deep/ .u-tabs__wrapper__nav__line {
|
||||||
|
height: 14px !important;
|
||||||
|
width: 40px !important;
|
||||||
|
background-image: url(../../static/scrollLine.png);
|
||||||
|
background-color: transparent !important;
|
||||||
|
bottom: 2px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
page {
|
||||||
|
background-color: #F4F5F7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ding {
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
border: 1px solid transparnt;
|
||||||
|
padding: 32rpx;
|
||||||
|
|
||||||
|
.top {
|
||||||
|
border: 1px solid transparnt;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-bottom: 32px;
|
||||||
|
|
||||||
|
.left {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.avator {
|
||||||
|
width: 160rpx;
|
||||||
|
height: 160rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.people {
|
||||||
|
margin-left: 16rpx;
|
||||||
|
|
||||||
|
.art_name {
|
||||||
|
font-weight: 600;
|
||||||
|
color: #000000;
|
||||||
|
font-size: 40rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.aer_Staff {
|
||||||
|
margin-top: 16rpx;
|
||||||
|
color: #000000;
|
||||||
|
font-size: 32rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.talk {
|
||||||
|
border: 1px solid #99241B;
|
||||||
|
font-size: 24rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
border-radius: 10rpx;
|
||||||
|
color: #99241B;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 16rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
.concat_ico {
|
||||||
|
width: 32rpx;
|
||||||
|
height: 32rpx;
|
||||||
|
margin-right: 8rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.famous_bot {
|
||||||
|
padding: 32rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
width: calc(100% - 64rpx);
|
||||||
|
margin: 24rpx 32rpx 0 32rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
.famous_bot_itm {
|
||||||
|
display: flex;
|
||||||
|
margin-bottom: 16rpx;
|
||||||
|
|
||||||
|
.ico {
|
||||||
|
width: 24rpx;
|
||||||
|
height: 24rpx;
|
||||||
|
flex-shrink: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.con {
|
||||||
|
margin-left: 8rpx;
|
||||||
|
color: $black;
|
||||||
|
font-size: 28rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.works {
|
||||||
|
height: 380rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.works_name {
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: $black;
|
||||||
|
font-weight: 600;
|
||||||
|
margin: 32rpx 0rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,519 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
|
||||||
|
<view class="search_box">
|
||||||
|
|
||||||
|
<u-search height=42 margin="12px 0" searchIconColor="black" bgColor="#f8f8f8" searchIconSize="40rpx"
|
||||||
|
shape="square" :showAction="false" v-model="dataVal" placeholder="请输入资料名称"></u-search>
|
||||||
|
<view class="car_box " @click="isSelect=false">
|
||||||
|
<view class="dd" v-if="isSelect">
|
||||||
|
<image src="../../static/DataSearch/chexboxs.png" mode=""></image>
|
||||||
|
<text style="font-size: 20rpx;">选择</text>
|
||||||
|
</view>
|
||||||
|
<view class="dd" v-if="!isSelect" @click="moreSelected">
|
||||||
|
|
||||||
|
<checkbox-group @change="allChoose">
|
||||||
|
<label class="wr" style="display: flex; flex-direction: column;align-items: center; justify-content: space-around;">
|
||||||
|
<checkbox value="all" :checked="allChecked?true:false" />
|
||||||
|
<text style="font-size: 15rpx;margin-top: 8rpx;">全选</text>
|
||||||
|
</label>
|
||||||
|
</checkbox-group>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
<checkbox-group @change="changeCheckbox">
|
||||||
|
<view class="itm" v-for="(item,index) in checkboxData" :key="item.value">
|
||||||
|
<view class="fileImg">
|
||||||
|
<image src="../../static/DataSearch/musicImg.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="data_detail_box">
|
||||||
|
|
||||||
|
<view class="file_title">
|
||||||
|
<!-- 资料查找 -->
|
||||||
|
{{item.label}}
|
||||||
|
</view>
|
||||||
|
<view class="file_time">
|
||||||
|
2021-12-18 17:08 220KB
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="moreImg" v-if="isSelect" @click="delFile(index)">
|
||||||
|
<image src="../../static/DataSearch/dirDel.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="moreImg" style="width: 32rpx;height: 32rpx;" v-if="!isSelect">
|
||||||
|
|
||||||
|
<label class="wr">
|
||||||
|
<checkbox :value="String(item.value)" :checked="checkedArr.includes(String(item.value))" />
|
||||||
|
</label>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</checkbox-group>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- 底部对文件的操作栏 -->
|
||||||
|
<view class="bottom_tab" v-if="!isSelect">
|
||||||
|
|
||||||
|
<view class="bottom_wx" v-if="checkedArr.length > 0 ? false: true">
|
||||||
|
<view class="bottom_tab_itm">
|
||||||
|
<view class="bottom_tab_itm_img">
|
||||||
|
<image src="../../static/DataSearch/dowm.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="bottom_tab_itm_txt">
|
||||||
|
下载
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
<view class="bottom_tab_itm">
|
||||||
|
<view class="bottom_tab_itm_img">
|
||||||
|
<image src="../../static/DataSearch/share.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="bottom_tab_itm_txt">
|
||||||
|
分享
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="bottom_tab_itm">
|
||||||
|
<view class="bottom_tab_itm_img">
|
||||||
|
<image src="../../static/DataSearch/Delet.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="bottom_tab_itm_txt">
|
||||||
|
删除
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
<view class="bottom_yx" v-if="checkedArr.length > 0">
|
||||||
|
<view class="bottom_tab_itm">
|
||||||
|
<view class="bottom_tab_itm_img">
|
||||||
|
<image src="../../static/DataSearch/dowmSelected.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="bottom_tab_itm_txt">
|
||||||
|
下载
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
<view class="bottom_tab_itm">
|
||||||
|
<view class="bottom_tab_itm_img">
|
||||||
|
<image src="../../static/DataSearch/shareSelected.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="bottom_tab_itm_txt">
|
||||||
|
分享
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="bottom_tab_itm">
|
||||||
|
<view class="bottom_tab_itm_img">
|
||||||
|
<image src="../../static/DataSearch/Deletselected.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="bottom_tab_itm_txt">
|
||||||
|
删除
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- 底部对文件的操作栏 ed -->
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<view class="bottm" @click="zhanKai">
|
||||||
|
<image src="../../static/DataSearch/zhanKai.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 弹出框 加号的弹出框-->
|
||||||
|
|
||||||
|
<u-popup :show="show" closeOnClickOverlay @close="() => show = false" @open="open" round=5>
|
||||||
|
<view class="tan_con">
|
||||||
|
<view class="tit">
|
||||||
|
上传文件
|
||||||
|
</view>
|
||||||
|
<view class="up_itm_box">
|
||||||
|
|
||||||
|
<view class="img_itm">
|
||||||
|
<view class="img">
|
||||||
|
<image src="../../static/DataSearch/UploadImg.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="Up_tit">
|
||||||
|
上传图片
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
<view class="img_itm">
|
||||||
|
<view class="img">
|
||||||
|
<image src="../../static/DataSearch/uploadDoc.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="Up_tit">
|
||||||
|
上传文档
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="img_itm">
|
||||||
|
<view class="img">
|
||||||
|
<image src="../../static/DataSearch/UploadVideo.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="Up_tit">
|
||||||
|
上传视频
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="img_itm">
|
||||||
|
<view class="img">
|
||||||
|
<image src="../../static/DataSearch/UploadMusic.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="Up_tit">
|
||||||
|
上传音频
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</u-popup>
|
||||||
|
<!-- 弹出框 底部 加号的弹出框 ed-->
|
||||||
|
<!-- 删除 标 删除文件 的弹出确认删除 -->
|
||||||
|
<u-modal width="550rpx" confirmText="确认删除" confirmColor='#E34D59' :show="showModel" showCancelButton
|
||||||
|
@confirm="fileOprModelConfirm" @cancel="() => showModel = false">
|
||||||
|
<text style="font-size: 32rpx; font-weight: 600;color: #251B1D;margin: 25rpx 0;">确认删除文件</text>
|
||||||
|
</u-modal>
|
||||||
|
|
||||||
|
<!-- 三个点ed -->
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
tempNum: '',
|
||||||
|
dataVal: "",
|
||||||
|
isSelect: true,
|
||||||
|
show: false,
|
||||||
|
showModel: false,
|
||||||
|
allSelect: true,
|
||||||
|
checkboxData: [{
|
||||||
|
'value': 0,
|
||||||
|
'label': '选项一'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'value': 1,
|
||||||
|
'label': '选项二'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'value': 2,
|
||||||
|
'label': '选项三'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'value': 3,
|
||||||
|
'label': '选项四'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'value': 4,
|
||||||
|
'label': '选项五'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'value': 5,
|
||||||
|
'label': '选项六'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'value': 6,
|
||||||
|
'label': '选项七'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'value': 7,
|
||||||
|
'label': '选项八'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'value': 8,
|
||||||
|
'label': '选项九'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'value': 9,
|
||||||
|
'label': '选项十'
|
||||||
|
}
|
||||||
|
],
|
||||||
|
allChecked: false,
|
||||||
|
checkedArr: [], //复选框选中的值
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
delFile(index) {
|
||||||
|
console.log(index);
|
||||||
|
this.tempNum = Number(index)
|
||||||
|
this.showModel = true
|
||||||
|
|
||||||
|
|
||||||
|
},
|
||||||
|
fileOprModelConfirm() {
|
||||||
|
this.showModel = false;
|
||||||
|
var num = this.tempNum
|
||||||
|
this.checkboxData.splice(num, 1)
|
||||||
|
},
|
||||||
|
zhanKai() {
|
||||||
|
console.log("展开");
|
||||||
|
// this.allChecked=false
|
||||||
|
this.isSelect = true
|
||||||
|
this.show = true
|
||||||
|
this.checkedArr = []
|
||||||
|
this.allChecked = false
|
||||||
|
},
|
||||||
|
moreSelected() {
|
||||||
|
this.allSelect = !this.allSelect
|
||||||
|
},
|
||||||
|
checkboxChange(e) {
|
||||||
|
console.log(e.detail.value);
|
||||||
|
|
||||||
|
},
|
||||||
|
// 多选复选框改变事件
|
||||||
|
changeCheckbox(e) {
|
||||||
|
this.checkedArr = e.detail.value;
|
||||||
|
// 如果选择的数组中有值,并且长度等于列表的长度,就是全选
|
||||||
|
if (this.checkedArr.length > 0 && this.checkedArr.length == this.checkboxData.length) {
|
||||||
|
this.allChecked = true;
|
||||||
|
} else {
|
||||||
|
this.allChecked = false;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 全选事件
|
||||||
|
allChoose(e) {
|
||||||
|
let chooseItem = e.detail.value;
|
||||||
|
// 全选
|
||||||
|
if (chooseItem[0] == 'all') {
|
||||||
|
this.allChecked = true;
|
||||||
|
for (let item of this.checkboxData) {
|
||||||
|
let itemVal = String(item.value);
|
||||||
|
if (!this.checkedArr.includes(itemVal)) {
|
||||||
|
this.checkedArr.push(itemVal);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
// 取消全选
|
||||||
|
this.allChecked = false;
|
||||||
|
this.checkedArr = [];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
onLoad(opt) {
|
||||||
|
console.log(opt.id);
|
||||||
|
},
|
||||||
|
options: {
|
||||||
|
styleIsolation: 'shared'
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.wr {
|
||||||
|
/deep/ .uni-checkbox-input {
|
||||||
|
border-radius: 50% !important;
|
||||||
|
color: #4CD964 !important;
|
||||||
|
width: 32rpx;
|
||||||
|
height: 32rpx;
|
||||||
|
|
||||||
|
}
|
||||||
|
checkbox{
|
||||||
|
border-radius: 50% !important;
|
||||||
|
color: #4CD964 !important;
|
||||||
|
width: 32rpx!important;
|
||||||
|
height: 32rpx!important;
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/* #ifdef MP-WEIXIN */
|
||||||
|
checkbox .wx-checkbox-input {
|
||||||
|
border-radius: 50% !important;
|
||||||
|
color: #ffffff !important;
|
||||||
|
width: 32rpx;
|
||||||
|
height: 32rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
checkbox .wx-checkbox-input.wx-checkbox-input-checked {
|
||||||
|
color: #fff;
|
||||||
|
background: #4CD964;
|
||||||
|
width: 32rpx;
|
||||||
|
height: 32rpx;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
/* .wx-checkbox-input.wx-checkbox-input-checked {
|
||||||
|
border: none !important;
|
||||||
|
} */
|
||||||
|
|
||||||
|
/* #endif*/
|
||||||
|
|
||||||
|
|
||||||
|
/deep/ .uni-checkbox-input-checked::before {
|
||||||
|
background-color: #4CD964!important ;
|
||||||
|
color: #FFFFFF!important;
|
||||||
|
border-radius: 50%;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.search_box {
|
||||||
|
padding: 32rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
.car_box {
|
||||||
|
width: 48rpx;
|
||||||
|
height: 48rpx;
|
||||||
|
margin-left: 24rpx;
|
||||||
|
|
||||||
|
.dd {
|
||||||
|
width: 48rpx;
|
||||||
|
height: 48rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.itm {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 48rpx;
|
||||||
|
height: 140rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
.fileImg {
|
||||||
|
width: 48rpx;
|
||||||
|
height: 48rpx;
|
||||||
|
margin-right: 24rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.data_detail_box {
|
||||||
|
flex: 1;
|
||||||
|
|
||||||
|
.file_title {
|
||||||
|
color: $black;
|
||||||
|
font-size: 28rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file_time {
|
||||||
|
color: $gray;
|
||||||
|
font-size: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.moreImg {
|
||||||
|
width: 40rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.bottom_tab {
|
||||||
|
height: 170rpx;
|
||||||
|
// border: 1px solid red;
|
||||||
|
|
||||||
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
.bottom_wx {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
color: #AFADB0;
|
||||||
|
background-color: #F7F7F7;
|
||||||
|
height: 170rpx;
|
||||||
|
|
||||||
|
.bottom_tab_itm {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.bottom_tab_itm_img {
|
||||||
|
width: 32rpx;
|
||||||
|
height: 32rpx;
|
||||||
|
margin-right: 8rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.bottom_yx {
|
||||||
|
color: $black;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
background-color: #F7F7F7;
|
||||||
|
height: 170rpx;
|
||||||
|
|
||||||
|
.bottom_tab_itm {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.bottom_tab_itm_img {
|
||||||
|
width: 32rpx;
|
||||||
|
height: 32rpx;
|
||||||
|
margin-right: 8rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.tan_con {
|
||||||
|
padding: 32rpx;
|
||||||
|
|
||||||
|
.tit {
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #251B1D;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.up_itm_box {
|
||||||
|
margin: 50rpx;
|
||||||
|
padding: 32rpx;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.img_itm {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.img {
|
||||||
|
width: 64rpx;
|
||||||
|
height: 64rpx;
|
||||||
|
margin-bottom: 24rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.Up_tit {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #251B1D;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.bottm {
|
||||||
|
border-radius: 50%;
|
||||||
|
overflow: hidden;
|
||||||
|
width: 96rpx;
|
||||||
|
height: 96rpx;
|
||||||
|
position: fixed;
|
||||||
|
bottom: 160rpx;
|
||||||
|
right: 32rpx;
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,429 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
|
||||||
|
<u--form :model="model1" ref="form1">
|
||||||
|
|
||||||
|
<!-- 完善资料 -->
|
||||||
|
<!-- 这里加了 v-for 导致 ref 失效 -->
|
||||||
|
<view class="data_itm_box" >
|
||||||
|
|
||||||
|
<u-form-item prop="userInfo.name" ref="item1" class="data_itm">
|
||||||
|
<text class="label_t">姓名</text>
|
||||||
|
<u--input style="padding: 32rpx;" placeholder="请填写姓名" inputAlign="right" clearable
|
||||||
|
v-model="model1.userInfo.name" border="none"></u--input>
|
||||||
|
</u-form-item>
|
||||||
|
|
||||||
|
<u-form-item prop="userInfo.sex" ref="item1" @click="showSex=true" class="data_itm">
|
||||||
|
<text class="label_t">性别</text>
|
||||||
|
<u--input style="padding: 32rpx;" placeholder="请填选择性别" v-model="model1.userInfo.sex" readonly
|
||||||
|
inputAlign="right" border="none">
|
||||||
|
<u-icon slot="suffix" name="arrow-right"></u-icon>
|
||||||
|
</u--input>
|
||||||
|
|
||||||
|
</u-form-item>
|
||||||
|
|
||||||
|
<u-form-item ref="item1" @click="showBirthday=true" class="data_itm">
|
||||||
|
<text class="label_t">出生日期</text>
|
||||||
|
<u--input style="padding: 32rpx;" placeholder="请填选择出生日期" v-model="model1.userInfo.birthday" readonly
|
||||||
|
inputAlign="right" border="none">
|
||||||
|
<u-icon slot="suffix" name="calendar"></u-icon>
|
||||||
|
</u--input>
|
||||||
|
|
||||||
|
</u-form-item>
|
||||||
|
|
||||||
|
<u-form-item prop="userInfo.idCOde" ref="item1" class="data_itm">
|
||||||
|
<text class="label_t">身份证号</text>
|
||||||
|
<u--input style="padding: 32rpx;" placeholder="请输入身份证号码" inputAlign="right" clearable
|
||||||
|
v-model="model1.userInfo.idCOde" border="none"></u--input>
|
||||||
|
</u-form-item>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<view class="data_itm_box">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<u-form-item ref="item1" @click="zuShow=true" class="data_itm">
|
||||||
|
<text class="label_t">民族</text>
|
||||||
|
<u--input style="padding: 32rpx;" placeholder="请选择民族" v-model="zuValue" readonly inputAlign="right"
|
||||||
|
border="none">
|
||||||
|
<u-icon slot="suffix" name="arrow-right"></u-icon>
|
||||||
|
</u--input>
|
||||||
|
</u-form-item>
|
||||||
|
|
||||||
|
<u-form-item ref="item1" @click="jigaunShow=true" class="data_itm">
|
||||||
|
<text class="label_t">籍贯</text>
|
||||||
|
<u--input style="padding: 32rpx;" placeholder="请选择籍贯" v-model="jiguan" readonly inputAlign="right"
|
||||||
|
border="none">
|
||||||
|
<u-icon slot="suffix" name="arrow-right"></u-icon>
|
||||||
|
</u--input>
|
||||||
|
</u-form-item>
|
||||||
|
|
||||||
|
<u-form-item ref="item1" @click="zhengzhiShow=true" class="data_itm">
|
||||||
|
<text class="label_t">政治面貌</text>
|
||||||
|
<u--input style="padding: 32rpx;" placeholder="请选择政治面貌" v-model="zhengzhiValue" readonly
|
||||||
|
inputAlign="right" border="none">
|
||||||
|
<u-icon slot="suffix" name="arrow-right"></u-icon>
|
||||||
|
</u--input>
|
||||||
|
</u-form-item>
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<view class="data_itm_box">
|
||||||
|
<u-form-item prop="userInfo.phoneNum" ref="item1" class="data_itm">
|
||||||
|
<text class="label_t">联系电话</text>
|
||||||
|
<u--input style="padding: 32rpx;" placeholder="请输入联系电话" inputAlign="right" clearable
|
||||||
|
v-model="model1.userInfo.phoneNum" border="none"></u--input>
|
||||||
|
</u-form-item>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<view class="data_itm_box">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<view class="data_itm">
|
||||||
|
<view class="data_itm_key label_t">
|
||||||
|
照片上传
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<u-upload class="upload" accept="image" width="172rpx" height="172rpx" :fileList="fileList3"
|
||||||
|
@afterRead="afterRead" @delete="deletePic" name="3" multiple :maxCount="2">
|
||||||
|
<image style="width: 172rpx;height: 172rpx;" src="../../static/improveData/jia.png"></image>
|
||||||
|
</u-upload>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
<view class="operation">
|
||||||
|
<button type="default" class="next" @click="submit">登录</button>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</u--form>
|
||||||
|
<!-- form ed -->
|
||||||
|
<!-- 性别弹框区 -->
|
||||||
|
<u-popup :show="showSex" @close="close" @open="open" closeOnClickOverlay :round="5"
|
||||||
|
customStyle="padding: 16px;">
|
||||||
|
<u-radio-group @change="selectForm" v-model="radiovalue7" :borderBottom="true" placement="column"
|
||||||
|
iconPlacement="right">
|
||||||
|
<u-radio :customStyle="{marginBottom: '16px' }" v-for="(item, index) in radiolist7" :key="index+100*2"
|
||||||
|
:label="item.name" labelSize="28rpx" labelColor="#231F1C" :name="item.name" activeColor="#99241B ">
|
||||||
|
</u-radio>
|
||||||
|
<u-button class="custom-style" style="background-color:#99241B ; color: #FFFFFF; margin-top: 32rpx;"
|
||||||
|
type="default" @click="showSex=false">确认</u-button>
|
||||||
|
</u-radio-group>
|
||||||
|
</u-popup>
|
||||||
|
<!-- 弹框区 ed -->
|
||||||
|
<!-- 日期选择器 -->
|
||||||
|
<u-datetime-picker confirmColor="#99241B" :minDate="-2207520000000" :show="showBirthday"
|
||||||
|
:value="model1.userInfo.birthday" mode="date" closeOnClickOverlay @confirm="birthdayConfirm"
|
||||||
|
@cancel="birthdayClose" @close="birthdayClose"></u-datetime-picker>
|
||||||
|
<!-- 日期选择器ed -->
|
||||||
|
<!-- 民族选择器 -->
|
||||||
|
<u-picker :show="zuShow" confirmColor="#99241B" @change="selctZU" @confirm="confimZu" immediateChange
|
||||||
|
:columns="Zucolumns"></u-picker>
|
||||||
|
<!-- 民族选择器 ed-->
|
||||||
|
<!-- 政治面貌选择器 -->
|
||||||
|
<u-picker :show="zhengzhiShow" confirmColor="#99241B" @change="selctZU" @confirm="confimZheng" immediateChange
|
||||||
|
:columns="Zhengcolumns"></u-picker>
|
||||||
|
<!-- 政治面貌选择器 ed-->
|
||||||
|
|
||||||
|
<!-- 籍贯面貌选择器 -->
|
||||||
|
<u-picker :show="jigaunShow" confirmColor="#99241B" @change="selctJi" @confirm="confimJi" immediateChange
|
||||||
|
:columns="Jicolumns"></u-picker>
|
||||||
|
<!-- 籍贯面貌选择器 ed-->
|
||||||
|
<view class="zhan_w">
|
||||||
|
<!-- zhanwei -->
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
zhengzhiShow: false,
|
||||||
|
zhengzhiValue: '',
|
||||||
|
zuValue: "",
|
||||||
|
zuShow: false,
|
||||||
|
Zucolumns: [
|
||||||
|
["汉族", "朝鲜族"],
|
||||||
|
],
|
||||||
|
Zhengcolumns: [
|
||||||
|
["群众", "党员", '共青团员'],
|
||||||
|
],
|
||||||
|
|
||||||
|
Jicolumns: [
|
||||||
|
["河南", "浙江", '上海'],
|
||||||
|
],
|
||||||
|
|
||||||
|
fileList3: [],
|
||||||
|
|
||||||
|
jiguan: '',
|
||||||
|
jigaunShow: false,
|
||||||
|
showBirthday: false,
|
||||||
|
sex: '',
|
||||||
|
showSex: false,
|
||||||
|
radiovalue7: '',
|
||||||
|
radiolist7: [{
|
||||||
|
name: '男'
|
||||||
|
}, {
|
||||||
|
name: '女'
|
||||||
|
}],
|
||||||
|
model1: {
|
||||||
|
userInfo: {
|
||||||
|
name: '',
|
||||||
|
sex: '',
|
||||||
|
birthday: "",
|
||||||
|
idCOde: '',
|
||||||
|
zuValue: '',
|
||||||
|
zhengzhiValue: '',
|
||||||
|
phoneNum: '',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
rules: {
|
||||||
|
'userInfo.name': [{
|
||||||
|
type: 'string',
|
||||||
|
required: true,
|
||||||
|
message: '请填写姓名',
|
||||||
|
trigger: ['blur', 'change']
|
||||||
|
}, {
|
||||||
|
// 此为同步验证,可以直接返回true或者false,如果是异步验证,稍微不同,见下方说明
|
||||||
|
validator: (rule, value, callback) => {
|
||||||
|
// 调用uView自带的js验证规则,详见:https://www.uviewui.com/js/test.html
|
||||||
|
return uni.$u.test.chinese(value);
|
||||||
|
},
|
||||||
|
message: "姓名必须为中文",
|
||||||
|
// 触发器可以同时用blur和change,二者之间用英文逗号隔开
|
||||||
|
trigger: ["change", "blur"],
|
||||||
|
}],
|
||||||
|
'userInfo.sex': {
|
||||||
|
type: 'string',
|
||||||
|
max: 1,
|
||||||
|
required: true,
|
||||||
|
message: '请选择男或女',
|
||||||
|
trigger: ['blur', 'change']
|
||||||
|
},
|
||||||
|
'userInfo.idCOde': [{
|
||||||
|
required: true,
|
||||||
|
message: '请输入身份证号号',
|
||||||
|
trigger: ['change', 'blur'],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
// 自定义验证函数,见上说明
|
||||||
|
validator: (rule, value, callback) => {
|
||||||
|
return uni.$u.test.idCard(value);
|
||||||
|
},
|
||||||
|
message: '身份证号码格式不正确',
|
||||||
|
|
||||||
|
trigger: ['change', 'blur'],
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"userInfo.phoneNum": [{
|
||||||
|
required: true,
|
||||||
|
message: '请输入联系电话',
|
||||||
|
trigger: ['change', 'blur'],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
|
||||||
|
validator: (rule, value, callback) => {
|
||||||
|
return uni.$u.test.mobile(value);
|
||||||
|
},
|
||||||
|
message: '手机号码不正确',
|
||||||
|
trigger: ['change', 'blur'],
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},onLoad(option) {
|
||||||
|
console.log(option.id);
|
||||||
|
},
|
||||||
|
|
||||||
|
onReady() {
|
||||||
|
|
||||||
|
this.$refs.form1.setRules(this.rules);
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
sexSelect(e) {
|
||||||
|
this.model1.userInfo.sex = e.name
|
||||||
|
// this.$refs.form1.validateField('userInfo.sex')
|
||||||
|
},
|
||||||
|
selectForm(sex) {
|
||||||
|
|
||||||
|
this.model1.userInfo.sex = sex
|
||||||
|
},
|
||||||
|
birthdayConfirm(e) {
|
||||||
|
this.showBirthday = false
|
||||||
|
this.model1.userInfo.birthday = uni.$u.timeFormat(e.value, 'yyyy-mm-dd')
|
||||||
|
// this.$refs.form1.validateField('userInfo.birthday')
|
||||||
|
},
|
||||||
|
birthdayClose() {
|
||||||
|
this.showBirthday = false
|
||||||
|
// this.$refs.form1.validateField('userInfo.birthday')
|
||||||
|
},
|
||||||
|
selctZU(e) {
|
||||||
|
console.log(e);
|
||||||
|
},
|
||||||
|
selctJi(e) {
|
||||||
|
console.log(e);
|
||||||
|
},
|
||||||
|
confimZu(e) {
|
||||||
|
this.zuShow = false
|
||||||
|
this.zuValue = e.value[0]
|
||||||
|
// console.log(e.value[0]);
|
||||||
|
},
|
||||||
|
confimZheng(e) {
|
||||||
|
this.zhengzhiShow = false
|
||||||
|
this.zhengzhiValue = e.value[0]
|
||||||
|
},
|
||||||
|
confimJi(e) {
|
||||||
|
this.jigaunShow = false
|
||||||
|
this.jiguan = e.value[0]
|
||||||
|
},
|
||||||
|
// 删除图片
|
||||||
|
deletePic(event) {
|
||||||
|
this[`fileList${event.name}`].splice(event.index, 1)
|
||||||
|
},
|
||||||
|
// 新增图片
|
||||||
|
async afterRead(event) {
|
||||||
|
// 当设置 mutiple 为 true 时, file 为数组格式,否则为对象格式
|
||||||
|
let lists = [].concat(event.file)
|
||||||
|
let fileListLen = this[`fileList${event.name}`].length
|
||||||
|
lists.map((item) => {
|
||||||
|
this[`fileList${event.name}`].push({
|
||||||
|
...item,
|
||||||
|
status: 'uploading',
|
||||||
|
message: '上传中'
|
||||||
|
})
|
||||||
|
})
|
||||||
|
for (let i = 0; i < lists.length; i++) {
|
||||||
|
const result = await this.uploadFilePromise(lists[i].url)
|
||||||
|
let item = this[`fileList${event.name}`][fileListLen]
|
||||||
|
this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
|
||||||
|
status: 'success',
|
||||||
|
message: '',
|
||||||
|
url: result
|
||||||
|
}))
|
||||||
|
fileListLen++
|
||||||
|
}
|
||||||
|
},
|
||||||
|
uploadFilePromise(url) {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
let a = uni.uploadFile({
|
||||||
|
url: 'http://192.168.2.21:7001/upload', // 仅为示例,非真实的接口地址
|
||||||
|
filePath: url,
|
||||||
|
name: 'file',
|
||||||
|
formData: {
|
||||||
|
user: 'test'
|
||||||
|
},
|
||||||
|
success: (res) => {
|
||||||
|
setTimeout(() => {
|
||||||
|
resolve(res.data.data)
|
||||||
|
}, 1000)
|
||||||
|
}
|
||||||
|
});
|
||||||
|
})
|
||||||
|
},
|
||||||
|
submit() {
|
||||||
|
this.$refs.form1.validate().then(res => {
|
||||||
|
uni.$u.toast('Thanks your helping')
|
||||||
|
}).catch(errors => {
|
||||||
|
uni.$u.toast('您的资料还未补充完整')
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
page {
|
||||||
|
background-color: #F5F5F5;
|
||||||
|
}
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.upload {
|
||||||
|
padding-top: 32rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.data_itm_box {
|
||||||
|
margin-bottom: 16rpx;
|
||||||
|
border: 1px solid transparent;
|
||||||
|
padding: 0 32rpx;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
|
||||||
|
.data_itm {
|
||||||
|
.label_t {
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: $black;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.upload_box {
|
||||||
|
width: 166rpx;
|
||||||
|
height: 166rpx;
|
||||||
|
margin-left: 32rpx;
|
||||||
|
position: relative;
|
||||||
|
background-color: #F8F8F8;
|
||||||
|
margin-bottom: 64rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.operation {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 32rpx 32rpx 48rpx;
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
right: 0;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
box-shadow: 0px -4px 10px 1px rgba(192, 192, 192, 0.12);
|
||||||
|
z-index: 99;
|
||||||
|
|
||||||
|
.next {
|
||||||
|
width: calc(100% - 48rpx);
|
||||||
|
height: 80rpx;
|
||||||
|
line-height: 80rpx;
|
||||||
|
|
||||||
|
background-color: #99241B;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 600;
|
||||||
|
|
||||||
|
border: none;
|
||||||
|
|
||||||
|
button {
|
||||||
|
&::after {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.zhan_w {
|
||||||
|
height: 160rpx;
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,47 @@
|
||||||
|
<template>
|
||||||
|
<view class="content">
|
||||||
|
<u-button type="primary" text="确定"></u-button>
|
||||||
|
<tabbar tabbarId='3'></tabbar>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
title: 'Hello'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad() {
|
||||||
|
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.content {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo {
|
||||||
|
height: 200rpx;
|
||||||
|
width: 200rpx;
|
||||||
|
margin: 200rpx auto 50rpx auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-area {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-size: 36rpx;
|
||||||
|
color: #8f8f94;
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,248 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<view class="navbar" v-show="opCalue>0" :style="{'opacity':opCalue}">
|
||||||
|
<view class="status_bar" :style="{'height':statusHeight+'px'}"></view>
|
||||||
|
<view class="apptitle" :style="{'height':titleHeight+'px'}">
|
||||||
|
<image src="../../static/blackArrow.png" mode="" class="backImg" @click="back"></image>
|
||||||
|
<view class="barLabel">
|
||||||
|
文艺之家
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<u-swiper :list="list" indicator indicatorMode="dot" circular height="240"></u-swiper>
|
||||||
|
<view class="layout">
|
||||||
|
<view class="activityColumn">
|
||||||
|
<view class="banEle">
|
||||||
|
<view class="title">
|
||||||
|
文创展厅
|
||||||
|
</view>
|
||||||
|
<text class="more">
|
||||||
|
更多
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
<u-scroll-list :indicator="false">
|
||||||
|
<view class="scroll-list">
|
||||||
|
<view class="scroll-list__goods-item" v-for="(item, index) in list2" :key="index"
|
||||||
|
:class="[(index === 9) && 'scroll-list__goods-item--no-margin-right']" @click="GoWorksShow(index)">
|
||||||
|
<image class="scroll-list__goods-item__image" :src="item.image"></image>
|
||||||
|
<view class="scroll-list__goods-item__view overEllipsis">{{ item.title }}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</u-scroll-list>
|
||||||
|
</view>
|
||||||
|
<view class="activityColumn">
|
||||||
|
<view class="banEle">
|
||||||
|
<view class="title">
|
||||||
|
活动剪影
|
||||||
|
</view>
|
||||||
|
<!-- <text class="more">
|
||||||
|
更多
|
||||||
|
</text> -->
|
||||||
|
</view>
|
||||||
|
<view class="activity" v-for="(v,i) in num" :key="i">
|
||||||
|
<view class="left">
|
||||||
|
<view class="content">
|
||||||
|
<view class="title">
|
||||||
|
送万福、进万家文艺惠民 暖人心嫁得好风扇电机接收到删掉就惊世毒妃
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="clidate">
|
||||||
|
<view class="cliNum">点击量:15万</view>
|
||||||
|
<view class="date">2022-01-11</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="right">
|
||||||
|
<image src="../../static/icon12.jpg" mode=""></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
statusHeight: 0,
|
||||||
|
titleHeight: 50,
|
||||||
|
opCalue:0,
|
||||||
|
list: [
|
||||||
|
'https://cdn.uviewui.com/uview/swiper/swiper3.png',
|
||||||
|
'https://cdn.uviewui.com/uview/swiper/swiper2.png'
|
||||||
|
],
|
||||||
|
list2: [{
|
||||||
|
image: 'https://cdn.uviewui.com/uview/swiper/swiper2.png',
|
||||||
|
title: '艺起战疫获奖作品展示',
|
||||||
|
}, {
|
||||||
|
image: 'https://cdn.uviewui.com/uview/swiper/swiper1.png',
|
||||||
|
title: '嘉禾'
|
||||||
|
}],
|
||||||
|
num: 4
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
back(){
|
||||||
|
uni.navigateBack()
|
||||||
|
},
|
||||||
|
GoWorksShow(id){
|
||||||
|
uni.navigateTo({
|
||||||
|
url:"/pages/AwardWinningWork/AwardWinningWork?id="+String(id)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onPageScroll(e) {
|
||||||
|
let scrollTop = e.scrollTop
|
||||||
|
this.opCalue = (scrollTop - 60) / 100
|
||||||
|
},
|
||||||
|
onReady() {
|
||||||
|
const systemMsg = uni.getSystemInfoSync();
|
||||||
|
this.statusHeight = systemMsg.statusBarHeight
|
||||||
|
|
||||||
|
// #ifdef MP-WEIXIN
|
||||||
|
const menuButtonInfo = uni.getMenuButtonBoundingClientRect() //胶囊
|
||||||
|
this.titleHeight = menuButtonInfo.height + (menuButtonInfo.top - systemMsg.statusBarHeight) * 2
|
||||||
|
this.zwHeight = this.statusHeight + this.titleHeight
|
||||||
|
// #endif
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.navbar {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
z-index: 999;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background: #FFFFFF;
|
||||||
|
.apptitle {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 0 16px;
|
||||||
|
|
||||||
|
.backImg {
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
margin-right: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.barLabel {
|
||||||
|
flex: 1;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.layout {
|
||||||
|
padding: 0 16px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
.activityColumn {
|
||||||
|
margin-top: 20px;
|
||||||
|
|
||||||
|
.banEle {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-size: 16px;
|
||||||
|
line-height: 20px;
|
||||||
|
font-weight: 800;
|
||||||
|
}
|
||||||
|
|
||||||
|
.more {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #AFADB0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.u-scroll-list {
|
||||||
|
padding-bottom: 0 !important;
|
||||||
|
|
||||||
|
.scroll-list {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
&__goods-item {
|
||||||
|
margin-right: 16px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
&__image {
|
||||||
|
width: 200px;
|
||||||
|
height: 139px;
|
||||||
|
border-radius: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&__view {
|
||||||
|
background-color: rgba(0, 0, 0, 0.4);
|
||||||
|
color: #FFFFFF;
|
||||||
|
border-radius: 0px 0px 8px 8px;
|
||||||
|
font-size: 12px;
|
||||||
|
letter-spacing: 1px;
|
||||||
|
height: 32px;
|
||||||
|
line-height: 32px;
|
||||||
|
padding: 0 10px;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.activity {
|
||||||
|
display: flex;
|
||||||
|
padding-top: 10px;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
border-bottom: 1px solid #F5F5F5;
|
||||||
|
|
||||||
|
&:last-of-type {
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.content {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.clidate {
|
||||||
|
margin-top: 6px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
font-size: 12px;
|
||||||
|
color: #8E8F9E;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.right {
|
||||||
|
margin-left: 10px;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 124px;
|
||||||
|
height: 93px;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,228 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<view class="navbar" :style="{'opacity':opCalue}">
|
||||||
|
<view class="status_bar" :style="{'height':statusHeight+'px'}"></view>
|
||||||
|
<view class="apptitle" :style="{'height':titleHeight+'px'}">
|
||||||
|
<image src="../../static/blackArrow.png" mode="" class="backImg" @click="back"></image>
|
||||||
|
<view class="barLabel">
|
||||||
|
{{pageTitle}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="liter">
|
||||||
|
<view class="abnavbar">
|
||||||
|
<view class="status_bar" :style="{'height':statusHeight+'px'}"></view>
|
||||||
|
<view class="apptitle" :style="{'height':titleHeight+'px'}">
|
||||||
|
<image src="../../static/leftArrow.png" mode="" class="backImg" @click="back"></image>
|
||||||
|
<view class="barLabel">
|
||||||
|
{{pageTitle}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<image src="../../static/help/helpBg.png" mode="" class="helpBg"></image>
|
||||||
|
<view class="group" :style="{'top':topHeight+'px'}">
|
||||||
|
<view class="group-item" v-for="(v,i) in list">
|
||||||
|
<image :src="v.imgUrl" mode="" class="itemImg"></image>
|
||||||
|
<view class="word">
|
||||||
|
<view class="title">
|
||||||
|
{{v.title}}
|
||||||
|
</view>
|
||||||
|
<view class="remark">
|
||||||
|
{{v.remark}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<image src="../../static/rightArrow.png" mode="" class="rightArrow"></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
statusHeight: 0,
|
||||||
|
titleHeight: 50,
|
||||||
|
topHeight: 0,
|
||||||
|
opCalue:0,
|
||||||
|
pageTitle:"文艺援助",
|
||||||
|
list: [{
|
||||||
|
id: 1,
|
||||||
|
imgUrl: '../../static/help/help1.png',
|
||||||
|
title: '文艺维权',
|
||||||
|
remark: '文艺维权'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 2,
|
||||||
|
imgUrl: '../../static/help/help5.png',
|
||||||
|
title: '就业创业',
|
||||||
|
remark: '就业创业'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 3,
|
||||||
|
imgUrl: '../../static/help/help2.png',
|
||||||
|
title: '职称评审',
|
||||||
|
remark: '职称评审'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 4,
|
||||||
|
imgUrl: '../../static/help/help4.png',
|
||||||
|
title: '艺术考级',
|
||||||
|
remark: '艺术考级'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 5,
|
||||||
|
imgUrl: '../../static/help/help3.png',
|
||||||
|
title: '会员培训',
|
||||||
|
remark: '会员培训'
|
||||||
|
},
|
||||||
|
]
|
||||||
|
};
|
||||||
|
},
|
||||||
|
onPageScroll(e) {
|
||||||
|
let scrollTop = e.scrollTop
|
||||||
|
console.log(scrollTop)
|
||||||
|
this.opCalue = (scrollTop - 20) / 40
|
||||||
|
},
|
||||||
|
onReady() {
|
||||||
|
const systemMsg = uni.getSystemInfoSync();
|
||||||
|
this.statusHeight = systemMsg.statusBarHeight
|
||||||
|
|
||||||
|
// #ifdef MP-WEIXIN
|
||||||
|
const menuButtonInfo = uni.getMenuButtonBoundingClientRect() //胶囊
|
||||||
|
this.titleHeight = menuButtonInfo.height + (menuButtonInfo.top - systemMsg.statusBarHeight) * 2
|
||||||
|
this.topHeight = this.statusHeight + this.titleHeight
|
||||||
|
// #endif
|
||||||
|
|
||||||
|
// #ifndef MP-WEIXIN
|
||||||
|
//除了小程序
|
||||||
|
this.topHeight = this.statusHeight + this.titleHeight
|
||||||
|
// #endif
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
back(){
|
||||||
|
uni.navigateBack()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
page {
|
||||||
|
background-color: #F4F5F7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
z-index: 999;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
.apptitle {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 0 16px;
|
||||||
|
|
||||||
|
.backImg {
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
margin-right: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.barLabel {
|
||||||
|
flex: 1;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.liter {
|
||||||
|
position: relative;
|
||||||
|
.abnavbar {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
z-index: 10;
|
||||||
|
box-sizing: border-box;
|
||||||
|
color: #FFFFFF;
|
||||||
|
|
||||||
|
.apptitle {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 0 16px;
|
||||||
|
|
||||||
|
.backImg {
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
margin-right: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.barLabel {
|
||||||
|
flex: 1;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.helpBg {
|
||||||
|
width: 100%;
|
||||||
|
height: 240px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group {
|
||||||
|
padding: 16px;
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
z-index: 10;
|
||||||
|
|
||||||
|
.group-item {
|
||||||
|
margin-top: 12px;
|
||||||
|
padding:24px 12px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
border-radius: 8px 8px 8px 8px;
|
||||||
|
|
||||||
|
.itemImg {
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
margin-right: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.word {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
flex: 1;
|
||||||
|
|
||||||
|
.title {
|
||||||
|
color: #2E3221;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.remark {
|
||||||
|
margin-top: 8px;
|
||||||
|
color: #AFADB0;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.rightArrow {
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
margin-left: 12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,245 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<view class="navbar" :style="{'opacity':opCalue}">
|
||||||
|
<view class="status_bar" :style="{'height':statusHeight+'px'}"></view>
|
||||||
|
<view class="apptitle" :style="{'height':titleHeight+'px'}">
|
||||||
|
<image src="../../static/blackArrow.png" mode="" class="backImg" @click="back"></image>
|
||||||
|
<view class="barLabel">
|
||||||
|
{{pageTitle}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="liter">
|
||||||
|
<view class="abnavbar">
|
||||||
|
<view class="status_bar" :style="{'height':statusHeight+'px'}"></view>
|
||||||
|
<view class="apptitle" :style="{'height':titleHeight+'px'}">
|
||||||
|
<image src="../../static/leftArrow.png" mode="" class="backImg" @click="back"></image>
|
||||||
|
<view class="barLabel">
|
||||||
|
{{pageTitle}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<image src="../../static/help/helpBg.png" mode="" class="helpBg"></image>
|
||||||
|
<view class="group" :style="{'top':topHeight+'px'}">
|
||||||
|
<view class="group-item">
|
||||||
|
<view class="codeTitle">公众号链接/二维码</view>
|
||||||
|
<view class="codeImg">
|
||||||
|
<view class="codeEle">
|
||||||
|
<image src="../../static/icon12.jpg" mode="" class="code"></image>
|
||||||
|
</view>
|
||||||
|
<view class="remark">
|
||||||
|
识别二维码跳转至公众号
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="group-item">
|
||||||
|
<view class="codeTitle">自媒体链接/二维码</view>
|
||||||
|
<view class="codeImg">
|
||||||
|
<view class="codeEle">
|
||||||
|
<image src="../../static/icon12.jpg" mode="" class="code"></image>
|
||||||
|
</view>
|
||||||
|
<view class="remark">
|
||||||
|
识别二维码跳转至自媒体
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
statusHeight: 0,
|
||||||
|
titleHeight: 50,
|
||||||
|
topHeight: 0,
|
||||||
|
opCalue: 0,
|
||||||
|
pageTitle: "媒体宣传",
|
||||||
|
list: [{
|
||||||
|
id: 1,
|
||||||
|
imgUrl: '../../static/help/help1.png',
|
||||||
|
title: '文艺维权',
|
||||||
|
remark: '文艺维权'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 2,
|
||||||
|
imgUrl: '../../static/help/help5.png',
|
||||||
|
title: '就业创业',
|
||||||
|
remark: '就业创业'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 3,
|
||||||
|
imgUrl: '../../static/help/help2.png',
|
||||||
|
title: '职称评审',
|
||||||
|
remark: '职称评审'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 4,
|
||||||
|
imgUrl: '../../static/help/help4.png',
|
||||||
|
title: '艺术考级',
|
||||||
|
remark: '艺术考级'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 5,
|
||||||
|
imgUrl: '../../static/help/help3.png',
|
||||||
|
title: '会员培训',
|
||||||
|
remark: '会员培训'
|
||||||
|
},
|
||||||
|
]
|
||||||
|
};
|
||||||
|
},
|
||||||
|
onPageScroll(e) {
|
||||||
|
let scrollTop = e.scrollTop
|
||||||
|
// console.log(scrollTop)
|
||||||
|
this.opCalue = (scrollTop - 20) / 40
|
||||||
|
},
|
||||||
|
onReady() {
|
||||||
|
const systemMsg = uni.getSystemInfoSync();
|
||||||
|
this.statusHeight = systemMsg.statusBarHeight
|
||||||
|
|
||||||
|
// #ifdef MP-WEIXIN
|
||||||
|
const menuButtonInfo = uni.getMenuButtonBoundingClientRect() //胶囊
|
||||||
|
this.titleHeight = menuButtonInfo.height + (menuButtonInfo.top - systemMsg.statusBarHeight) * 2
|
||||||
|
this.topHeight = this.statusHeight + this.titleHeight
|
||||||
|
// #endif
|
||||||
|
|
||||||
|
// #ifndef MP-WEIXIN
|
||||||
|
//除了小程序
|
||||||
|
this.topHeight = this.statusHeight + this.titleHeight
|
||||||
|
// #endif
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
back() {
|
||||||
|
uni.navigateBack()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
page {
|
||||||
|
background-color: #F4F5F7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
z-index: 999;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
|
||||||
|
.apptitle {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 0 16px;
|
||||||
|
|
||||||
|
.backImg {
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
margin-right: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.barLabel {
|
||||||
|
flex: 1;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.liter {
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.abnavbar {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
z-index: 10;
|
||||||
|
box-sizing: border-box;
|
||||||
|
color: #FFFFFF;
|
||||||
|
|
||||||
|
.apptitle {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 0 16px;
|
||||||
|
|
||||||
|
.backImg {
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
margin-right: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.barLabel {
|
||||||
|
flex: 1;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.helpBg {
|
||||||
|
width: 100%;
|
||||||
|
height: 240px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.group {
|
||||||
|
padding: 16px;
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
z-index: 10;
|
||||||
|
|
||||||
|
.group-item {
|
||||||
|
background: #FFFFFF;
|
||||||
|
border-radius: 8px 8px 8px 8px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 0 20px;
|
||||||
|
margin-top: 20px;
|
||||||
|
|
||||||
|
.codeTitle {
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: 800;
|
||||||
|
padding: 20px 0;
|
||||||
|
border-bottom: 1px dashed #DBDBDB;
|
||||||
|
}
|
||||||
|
|
||||||
|
.codeImg {
|
||||||
|
text-align: center;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
padding: 20px 0;
|
||||||
|
|
||||||
|
.codeEle {
|
||||||
|
width: 148px;
|
||||||
|
height: 148px;
|
||||||
|
background: #f6f6f6;
|
||||||
|
box-sizing: border-box;
|
||||||
|
border-radius: 2px 2px 2px 2px;
|
||||||
|
padding: 6px;
|
||||||
|
|
||||||
|
.code {
|
||||||
|
max-width: 100%;
|
||||||
|
max-height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.remark {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #AFADB0;
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,154 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<view class="fun">
|
||||||
|
<view class="fun-Item" v-for="(v,i) in list" :key="i" @click="SwitchPage(i)">
|
||||||
|
|
||||||
|
<image :src="v.imgUrl" mode=""></image>
|
||||||
|
<view class="label">{{v.label}}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
list: [{
|
||||||
|
imgUrl: '../../static/moreFun/moreFun5.png',
|
||||||
|
label: '文艺活动'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imgUrl: '../../static/moreFun/moreFun6.png',
|
||||||
|
label: '积分使用'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imgUrl: '../../static/moreFun/moreFun7.png',
|
||||||
|
label: '文艺商城'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imgUrl: '../../static/moreFun/moreFun8.png',
|
||||||
|
label: '文艺之家'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imgUrl: '../../static/moreFun/moreFun9.png',
|
||||||
|
label: '文艺援助'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imgUrl: '../../static/moreFun/moreFun1.png',
|
||||||
|
label: '媒体宣传'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imgUrl: '../../static/moreFun/moreFun3.png',
|
||||||
|
label: '机构设置'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imgUrl: '../../static/moreFun/moreFun4.png',
|
||||||
|
label: '资料查找'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imgUrl: '../../static/moreFun/moreFun2.png',
|
||||||
|
label: '驾驶舱'
|
||||||
|
}, {
|
||||||
|
imgUrl: '../../static/icon13.png',
|
||||||
|
label: '文艺比赛'
|
||||||
|
},
|
||||||
|
]
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
SwitchPage(id) {
|
||||||
|
switch (id) {
|
||||||
|
case 0:
|
||||||
|
uni.navigateTo({
|
||||||
|
url: "/pages/ArtActivities/ArtActivities"
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
case 1:
|
||||||
|
uni.navigateTo({
|
||||||
|
url: "/pages/MyPoints/MyPoints"
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
case 2:
|
||||||
|
uni.navigateTo({
|
||||||
|
url: "/pages/shop/Shop"
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
case 3:
|
||||||
|
uni.navigateTo({
|
||||||
|
url: "/pages/literFamily/literFamily"
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
case 4:
|
||||||
|
uni.navigateTo({
|
||||||
|
url: "/pages/literHelp/literHelp"
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
case 5:
|
||||||
|
uni.navigateTo({
|
||||||
|
url: "/pages/mediaProp/mediaProp"
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
case 6:
|
||||||
|
uni.navigateTo({
|
||||||
|
url: "/pages/mediaProp/mediaProp"
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
case 7:
|
||||||
|
uni.navigateTo({
|
||||||
|
url: "/pages/DataSearch/DataSearch"
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
case 8:
|
||||||
|
uni.navigateTo({
|
||||||
|
url: "/pages/DataSearch/DataSearch"
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
case 9:
|
||||||
|
uni.navigateTo({
|
||||||
|
url: "/pages/ArtRace/ArtRace"
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
page {
|
||||||
|
background-color: #F4F5F7;
|
||||||
|
padding: 16px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fun {
|
||||||
|
background: #FFFFFF;
|
||||||
|
border-radius: 8px 8px 8px 8px;
|
||||||
|
padding: 0 16px;
|
||||||
|
padding-bottom: 16px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
|
||||||
|
.fun-Item {
|
||||||
|
width: 25%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
text-align: center;
|
||||||
|
|
||||||
|
image {
|
||||||
|
margin-top: 16px;
|
||||||
|
width: 48px;
|
||||||
|
height: 48px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.label {
|
||||||
|
margin-top: 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,257 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<view class="top">
|
||||||
|
<image class="bg" src="../../static/MyBg.png" mode=""></image>
|
||||||
|
<view class="avator_box">
|
||||||
|
<view class="tou">
|
||||||
|
<image class="avtor" src="../../static/MoneyIco.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="user_name">
|
||||||
|
<view class="user_name_de">
|
||||||
|
谢加息
|
||||||
|
</view>
|
||||||
|
<view class="words">
|
||||||
|
学而不思则罔,思不学则殆
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="arrow">
|
||||||
|
<image src="../../static/rightArrow.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- 内容区 -->
|
||||||
|
<view class="content_area">
|
||||||
|
<view class="fans_box">
|
||||||
|
<view class="fans_itm">
|
||||||
|
<view class="nums">
|
||||||
|
568
|
||||||
|
</view>
|
||||||
|
<view class="itms_name">
|
||||||
|
关注
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="fans_itm">
|
||||||
|
<view class="nums">
|
||||||
|
568
|
||||||
|
</view>
|
||||||
|
<view class="itms_name">
|
||||||
|
收藏
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="fans_itm">
|
||||||
|
<view class="nums">
|
||||||
|
568
|
||||||
|
</view>
|
||||||
|
<view class="itms_name">
|
||||||
|
粉丝
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="jifen_box">
|
||||||
|
<view class="jifen_box_itm">
|
||||||
|
<view class="ji_ico">
|
||||||
|
<image src="../../static/MoneyIco.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
<view class="ji_word_box" @click="gopointsPg">
|
||||||
|
<view class="ji_word_title">
|
||||||
|
积分
|
||||||
|
</view>
|
||||||
|
<view class="ji_con">
|
||||||
|
积分 686
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="jifen_box_itm">
|
||||||
|
<view class="ji_ico">
|
||||||
|
<image src="../../static/DunIcon.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="ji_word_box" @click="goOrderDetails">
|
||||||
|
<view class="ji_word_title">
|
||||||
|
我的交易
|
||||||
|
</view>
|
||||||
|
<view class="ji_con">
|
||||||
|
作品交易订单
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<view class="content_bott">
|
||||||
|
<view class="content_bott_itm" v-for="(v,i) in itmes" :key="i">
|
||||||
|
<view class="content_bott_wods">
|
||||||
|
<!-- 我的作品 -->
|
||||||
|
{{v}}
|
||||||
|
</view>
|
||||||
|
<view class="content_bott_arrow">
|
||||||
|
<image src="../../static/rightArrow.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<tabbar tabbarId='5'></tabbar>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
itmes:["我的作品","活动管理","消息","设置"]
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
gopointsPg(){
|
||||||
|
uni.navigateTo({
|
||||||
|
url:"/pages/MyPoints/MyPoints"
|
||||||
|
})
|
||||||
|
},
|
||||||
|
goOrderDetails(){
|
||||||
|
uni.navigateTo({
|
||||||
|
url:"/pages/OrderDetail/OrderDetail"
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
page{
|
||||||
|
background-color: #F4F5F7 ;
|
||||||
|
}
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.top {
|
||||||
|
height: 192px;
|
||||||
|
border: 1px solid transparent;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.avator_box {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
box-sizing: border-box;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0px;
|
||||||
|
height: 80px;
|
||||||
|
border: 1px solid transparent;
|
||||||
|
width: 100%;
|
||||||
|
padding: 2px 16px;
|
||||||
|
|
||||||
|
.tou {
|
||||||
|
width: 72px;
|
||||||
|
height: 72px;
|
||||||
|
border: 1px solid transparent;
|
||||||
|
border-radius: 50%;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.user_name {
|
||||||
|
flex-grow: 1;
|
||||||
|
|
||||||
|
margin-left: 12px;
|
||||||
|
|
||||||
|
.user_name_de {
|
||||||
|
color: #251B1D;
|
||||||
|
font-size: 20px;
|
||||||
|
font-weight: 600;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.words {
|
||||||
|
margin-top: 8px;
|
||||||
|
color: #AFADB0;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.arrow {
|
||||||
|
width: 24px;
|
||||||
|
height: 24px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.content_area{
|
||||||
|
padding: 0 16px;
|
||||||
|
.fans_box{
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: center;
|
||||||
|
height: 80px;
|
||||||
|
border: 1px solid transparent;
|
||||||
|
border-radius: 8px;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
.fans_itm{
|
||||||
|
.nums{ color: #251B1D ; font-weight: bold; font-family: DIN-Bold, DIN; font-size: 16px;}
|
||||||
|
.itms_name{color: #AFADB0 ; font-size: 12px; margin-top: 8px;}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.jifen_box{
|
||||||
|
|
||||||
|
padding: 16px 0px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
.jifen_box_itm{
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 12px;
|
||||||
|
display: flex;
|
||||||
|
width: 166px;
|
||||||
|
height: 68px;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
border-radius: 8px;
|
||||||
|
.ji_ico{
|
||||||
|
width: 22px;
|
||||||
|
height: 22px;
|
||||||
|
border-radius: 50%;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.ji_word_box{
|
||||||
|
margin-left: 8px;
|
||||||
|
.ji_word_title{font-size: 14px;
|
||||||
|
color: #251B1D;
|
||||||
|
font-weight: 600;}
|
||||||
|
.ji_con{ color: #AFADB0 ; font-size: 12px; font-weight: 400; margin-top: 4px;}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.content_bott{
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 16px;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
border-radius: 8px;
|
||||||
|
.content_bott_itm{
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
margin: 26px 0px;
|
||||||
|
.content_bott_wods{
|
||||||
|
font-size: 14px;
|
||||||
|
color: #251B1D;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content_bott_arrow{
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,340 @@
|
||||||
|
<template>
|
||||||
|
<view class="layout">
|
||||||
|
<view class="status_bar" :style="{'height':statusHeight+'px'}"></view>
|
||||||
|
<view class="apptitle" :style="{'height':titleHeight+'px'}">
|
||||||
|
<image src="../../static/icon10.png" mode="" class="logo"></image>
|
||||||
|
<image src="../../static/icon11.png" mode="" class="appname"></image>
|
||||||
|
</view>
|
||||||
|
<view style="padding:12px 0;">
|
||||||
|
<search></search>
|
||||||
|
</view>
|
||||||
|
<u-swiper :list="list" indicator indicatorMode="line" circular></u-swiper>
|
||||||
|
<view class="menus">
|
||||||
|
<u-grid :border="false" col="4">
|
||||||
|
<u-grid-item v-for="(listItem,listIndex) in menus" @click="cliGridItem" :name="listItem.id"
|
||||||
|
:key="listIndex">
|
||||||
|
<image :src="listItem.imgUrl" mode="" class="menusImg"></image>
|
||||||
|
<text class="grid-text">{{listItem.title}}</text>
|
||||||
|
</u-grid-item>
|
||||||
|
</u-grid>
|
||||||
|
</view>
|
||||||
|
<view class="group">
|
||||||
|
<view class="groupTitle">
|
||||||
|
<view class="title">
|
||||||
|
每日一赏
|
||||||
|
</view>
|
||||||
|
<view class="more" @click="navigateToFun('/pages/enjoy/enjoy')">
|
||||||
|
更多
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="remark">
|
||||||
|
为您推荐最优秀的作品
|
||||||
|
</view>
|
||||||
|
<view class="scrollEle">
|
||||||
|
<u-scroll-list :indicator="false">
|
||||||
|
<view class="scroll-list">
|
||||||
|
<view class="scroll-list__goods-item" v-for="(item, index) in enjoyList" :key="index"
|
||||||
|
:class="[(index === 9) && 'scroll-list__goods-item--no-margin-right']" @click="ToEnjoy(index)">
|
||||||
|
<image class="scroll-list__goods-item__image" :src="item.thumb"></image>
|
||||||
|
<text class="scroll-list__goods-item__text">{{ item.labelName }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</u-scroll-list>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="group">
|
||||||
|
<view class="groupTitle">
|
||||||
|
<view class="title">
|
||||||
|
文艺名家
|
||||||
|
</view>
|
||||||
|
<view class="more">
|
||||||
|
更多
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="remark">
|
||||||
|
象山县著名艺术家
|
||||||
|
</view>
|
||||||
|
<view class="scrollEle">
|
||||||
|
<u-scroll-list :indicator="false">
|
||||||
|
<view class="scroll-list">
|
||||||
|
<view class="scroll-list__goods-item" v-for="(item, index) in writerList" :key="index"
|
||||||
|
:class="[(index === 9) && 'scroll-list__goods-item--no-margin-right']" @click="famouserDetaol(index)" >
|
||||||
|
<image class="scroll-list__goods-item__image" :src="item.thumb"></image>
|
||||||
|
<text class="scroll-list__goods-item__text">{{ item.labelName }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</u-scroll-list>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="group">
|
||||||
|
<view class="groupTitle">
|
||||||
|
<view class="title">
|
||||||
|
热门活动
|
||||||
|
</view>
|
||||||
|
<view class="more">
|
||||||
|
更多
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="remark">
|
||||||
|
最精彩的文艺活动
|
||||||
|
</view>
|
||||||
|
<view class="scrollEle">
|
||||||
|
<u-swiper :list="list2" keyName="image" showTitle :autoplay="false" circular></u-swiper>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<u-gap height="5" bgColor="#ffffff"></u-gap>
|
||||||
|
<tabbar tabbarId='1'></tabbar>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import search from "@/components/search/search.vue"
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
search
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
statusHeight: 0,
|
||||||
|
titleHeight: 50,
|
||||||
|
list: [
|
||||||
|
'https://cdn.uviewui.com/uview/swiper/swiper3.png',
|
||||||
|
'https://cdn.uviewui.com/uview/swiper/swiper2.png',
|
||||||
|
],
|
||||||
|
list2: [{
|
||||||
|
image: 'https://cdn.uviewui.com/uview/swiper/swiper2.png',
|
||||||
|
title: '昨夜星辰昨夜风,画楼西畔桂堂东',
|
||||||
|
}, {
|
||||||
|
image: 'https://cdn.uviewui.com/uview/swiper/swiper1.png',
|
||||||
|
title: '身无彩凤双飞翼,心有灵犀一点通'
|
||||||
|
}],
|
||||||
|
menus: [{
|
||||||
|
id: 1,
|
||||||
|
imgUrl: '../../static/icon2.png',
|
||||||
|
title: '政策速递'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 2,
|
||||||
|
imgUrl: '../../static/icon4.png',
|
||||||
|
title: '文艺活动'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 3,
|
||||||
|
imgUrl: '../../static/icon3.png',
|
||||||
|
title: '文艺作品'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 4,
|
||||||
|
imgUrl: '../../static/icon5.png',
|
||||||
|
title: '积分使用'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 5,
|
||||||
|
imgUrl: '../../static/icon6.png',
|
||||||
|
title: '文艺之家'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 6,
|
||||||
|
imgUrl: '../../static/icon7.png',
|
||||||
|
title: '文艺援助'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 7,
|
||||||
|
imgUrl: '../../static/icon8.png',
|
||||||
|
title: '媒体宣传'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 8,
|
||||||
|
imgUrl: '../../static/icon1.png',
|
||||||
|
title: '更多功能'
|
||||||
|
},
|
||||||
|
],
|
||||||
|
enjoyList: [{
|
||||||
|
labelName: '策马崩腾',
|
||||||
|
thumb: '../../static/icon12.jpg'
|
||||||
|
}, {
|
||||||
|
labelName: '潇潇洒洒',
|
||||||
|
thumb: '../../static/icon12.jpg'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
labelName: '小燕子',
|
||||||
|
thumb: '../../static/icon12.jpg'
|
||||||
|
}
|
||||||
|
],
|
||||||
|
writerList: [{
|
||||||
|
labelName: '张三',
|
||||||
|
thumb: '../../static/icon12.jpg'
|
||||||
|
}, {
|
||||||
|
labelName: '李四',
|
||||||
|
thumb: '../../static/icon12.jpg'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
labelName: '小燕子',
|
||||||
|
thumb: '../../static/icon12.jpg'
|
||||||
|
}
|
||||||
|
],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
onReady() {
|
||||||
|
const systemMsg = uni.getSystemInfoSync();
|
||||||
|
this.statusHeight = systemMsg.statusBarHeight
|
||||||
|
// #ifdef MP-WEIXIN
|
||||||
|
const menuButtonInfo = uni.getMenuButtonBoundingClientRect() //胶囊
|
||||||
|
this.titleHeight = menuButtonInfo.height + (menuButtonInfo.top - systemMsg.statusBarHeight) * 2
|
||||||
|
// #endif
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
navigateToFun(url){
|
||||||
|
uni.navigateTo({
|
||||||
|
url
|
||||||
|
});
|
||||||
|
},
|
||||||
|
cliGridItem(name) {
|
||||||
|
|
||||||
|
switch (name) {
|
||||||
|
case 1:
|
||||||
|
uni.navigateTo({
|
||||||
|
url: "/pages/PolicyExpress/PolicyExpress"
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
case 2:
|
||||||
|
uni.navigateTo({
|
||||||
|
url: "/pages/ArtActivities/ArtActivities"
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
case 3:
|
||||||
|
uni.navigateTo({
|
||||||
|
url: "/pages/ArtWorks/ArtWorks"
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
case 4:
|
||||||
|
uni.navigateTo({
|
||||||
|
url: "/pages/MyPoints/MyPoints"
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
case 5:
|
||||||
|
uni.navigateTo({
|
||||||
|
url: "/pages/literFamily/literFamily"
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
case 6:
|
||||||
|
uni.navigateTo({
|
||||||
|
url: "/pages/literHelp/literHelp"
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
case 7:
|
||||||
|
uni.navigateTo({
|
||||||
|
url: "/pages/mediaProp/mediaProp"
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
case 8:
|
||||||
|
uni.navigateTo({
|
||||||
|
url: "/pages/moreFun/moreFun"
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
,famouserDetaol(id){
|
||||||
|
uni.navigateTo({
|
||||||
|
url:"/pages/famousArts/famousArts?id="+String(id)
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
,ToEnjoy(id){
|
||||||
|
uni.navigateTo({
|
||||||
|
url:"/pages/enjoy/enjoy?id="+String(id)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.layout {
|
||||||
|
padding: 0 16px;
|
||||||
|
padding-bottom: 50px;
|
||||||
|
|
||||||
|
.apptitle {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.logo {
|
||||||
|
width: 24px;
|
||||||
|
height: 20px;
|
||||||
|
margin-right: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.appname {
|
||||||
|
height: 17px;
|
||||||
|
width: 52px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.menus {
|
||||||
|
.menusImg {
|
||||||
|
margin-top: 16px;
|
||||||
|
width: 48px;
|
||||||
|
height: 48px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.grid-text {
|
||||||
|
margin-top: 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.group {
|
||||||
|
padding-top: 20px;
|
||||||
|
|
||||||
|
.groupTitle {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: 800;
|
||||||
|
}
|
||||||
|
|
||||||
|
.more {
|
||||||
|
color: #AFADB0;
|
||||||
|
font-size: 12px;
|
||||||
|
align-self: flex-end;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.remark {
|
||||||
|
margin-top: 4px;
|
||||||
|
font-size: 12px;
|
||||||
|
color: #AFADB0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.scrollEle {
|
||||||
|
padding-top: 14px;
|
||||||
|
|
||||||
|
.u-scroll-list {
|
||||||
|
padding-bottom: 0;
|
||||||
|
|
||||||
|
.scroll-list {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
&__goods-item {
|
||||||
|
margin-right: 16px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
&__image {
|
||||||
|
width: 139px;
|
||||||
|
height: 139px;
|
||||||
|
border-radius: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&__text {
|
||||||
|
text-align: center;
|
||||||
|
margin-top: 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -0,0 +1,207 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<view class="search_box">
|
||||||
|
<u-search height=42 margin="12px 0" searchIconColor="#251B1D" shape="square" :showAction="false"
|
||||||
|
v-model="artValue" placeholder="请输入名家名称"></u-search>
|
||||||
|
<view class="car_box">
|
||||||
|
<image src="../../static/shop/car.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<u-tabs :scrollable="false" :list="list1" :activeStyle="{
|
||||||
|
color: '#251B1D',
|
||||||
|
fontWeight: 'bold',
|
||||||
|
transform: 'scale(1.05)'
|
||||||
|
}" :inactiveStyle="{
|
||||||
|
color: '#AFADB0 ',
|
||||||
|
transform: 'scale(1)'
|
||||||
|
}" itemStyle=" height: 50px; ">
|
||||||
|
<view slot="right" class="filter_icon" style="width: 40rpx; height: 40rpx; flex-shrink: 0;"
|
||||||
|
@click="Clickfilter">
|
||||||
|
<image src="../../static/shop/filter.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
</u-tabs>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<view class="artworks">
|
||||||
|
<view class="art_item" v-for="(v,i) in isLoveList" :key="i" @click="goOrderDet(i)">
|
||||||
|
<view class="art_item_top">
|
||||||
|
<image src="../../static/shop/picture.png" mode=""></image>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class=" art_item_bott">
|
||||||
|
<view class="title">
|
||||||
|
摄影作品自由生活向美而生作品
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="img_box">
|
||||||
|
<view class=" puber">
|
||||||
|
|
||||||
|
<view class="txt">
|
||||||
|
<text class="txt1">100</text> <text>积分</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="time">
|
||||||
|
12人已购
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<tabbar tabbarId='4'></tabbar>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
isLoveList: [true, false, true, false],
|
||||||
|
artValue: '',
|
||||||
|
list1: [{
|
||||||
|
name: '全部',
|
||||||
|
}, {
|
||||||
|
name: '书法',
|
||||||
|
}, {
|
||||||
|
name: '绘画'
|
||||||
|
}, {
|
||||||
|
name: '雕刻'
|
||||||
|
}, {
|
||||||
|
name: '摄影'
|
||||||
|
}, {
|
||||||
|
name: '其他'
|
||||||
|
}]
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
Clickfilter() {
|
||||||
|
console.log("触发筛选");
|
||||||
|
},
|
||||||
|
goOrderDet(id){
|
||||||
|
uni.navigateTo({
|
||||||
|
url:`/pages/OrderDetail/OrderDetail?id=${id}`
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.search_box {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.car_box {
|
||||||
|
width: 24px;
|
||||||
|
height: 24px;
|
||||||
|
margin-left: 12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/deep/ .u-tabs__wrapper__nav__item__text {
|
||||||
|
font-size: 24rpx;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
/deep/ .u-tabs__wrapper__nav__line {
|
||||||
|
height: 14px !important;
|
||||||
|
width: 40px !important;
|
||||||
|
background-image: url(../../static/scrollLine.png);
|
||||||
|
background-color: transparent !important;
|
||||||
|
bottom: 2px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
page {
|
||||||
|
width: calc(100% - 32px);
|
||||||
|
margin: 0 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.artworks {
|
||||||
|
|
||||||
|
.art_item {
|
||||||
|
margin-top: 16px;
|
||||||
|
border: 1px solid transparent;
|
||||||
|
width: calc(50% - 16px);
|
||||||
|
display: inline-block;
|
||||||
|
margin-left: 8px;
|
||||||
|
|
||||||
|
.art_item_top {
|
||||||
|
|
||||||
|
position: relative;
|
||||||
|
height: 192px;
|
||||||
|
overflow: hidden;
|
||||||
|
border-radius: 8px 8px 0px 0px;
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.art_item_bott {
|
||||||
|
padding: 12px;
|
||||||
|
|
||||||
|
.title {
|
||||||
|
// margin-top: 12px;
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #32333B;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.img_box {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 16px;
|
||||||
|
|
||||||
|
.puber {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.txt {
|
||||||
|
font-size: 10px;
|
||||||
|
font-family: PingFang SC-Regular, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #8E8F9E;
|
||||||
|
|
||||||
|
.txt1 {
|
||||||
|
color: #32333B;
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: 800;
|
||||||
|
font-family: DIN Alternate-Bold, DIN Alternate;
|
||||||
|
margin-right: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.time {
|
||||||
|
color: #AFADB0;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
After Width: | Height: | Size: 1.1 KiB |
After Width: | Height: | Size: 1.2 KiB |
After Width: | Height: | Size: 481 B |
After Width: | Height: | Size: 1.1 KiB |
After Width: | Height: | Size: 1.4 KiB |
After Width: | Height: | Size: 1.8 KiB |
After Width: | Height: | Size: 1.3 KiB |
After Width: | Height: | Size: 1.2 KiB |
After Width: | Height: | Size: 908 B |
After Width: | Height: | Size: 560 B |
After Width: | Height: | Size: 673 B |
After Width: | Height: | Size: 1.2 KiB |
After Width: | Height: | Size: 1.2 KiB |
After Width: | Height: | Size: 370 B |
After Width: | Height: | Size: 339 B |
After Width: | Height: | Size: 1.5 KiB |
After Width: | Height: | Size: 1.0 KiB |
After Width: | Height: | Size: 937 B |
After Width: | Height: | Size: 501 B |
After Width: | Height: | Size: 511 B |
After Width: | Height: | Size: 1.0 KiB |
After Width: | Height: | Size: 16 KiB |
After Width: | Height: | Size: 5.1 KiB |
After Width: | Height: | Size: 933 B |
After Width: | Height: | Size: 1.7 KiB |
After Width: | Height: | Size: 904 B |
After Width: | Height: | Size: 340 B |
After Width: | Height: | Size: 595 B |
After Width: | Height: | Size: 5.1 KiB |
After Width: | Height: | Size: 155 KiB |
After Width: | Height: | Size: 260 KiB |
After Width: | Height: | Size: 1.7 KiB |
After Width: | Height: | Size: 2.0 KiB |
After Width: | Height: | Size: 2.0 KiB |
After Width: | Height: | Size: 1.7 KiB |
After Width: | Height: | Size: 310 B |
After Width: | Height: | Size: 1.9 KiB |
After Width: | Height: | Size: 7.1 KiB |
After Width: | Height: | Size: 77 KiB |
After Width: | Height: | Size: 128 KiB |
After Width: | Height: | Size: 1.3 KiB |
After Width: | Height: | Size: 1.0 KiB |
After Width: | Height: | Size: 1.2 KiB |
After Width: | Height: | Size: 406 KiB |
After Width: | Height: | Size: 72 KiB |
After Width: | Height: | Size: 22 KiB |
After Width: | Height: | Size: 378 B |
After Width: | Height: | Size: 1.3 KiB |
After Width: | Height: | Size: 1.4 KiB |
After Width: | Height: | Size: 1.1 KiB |
After Width: | Height: | Size: 1.6 KiB |
After Width: | Height: | Size: 1.2 KiB |
After Width: | Height: | Size: 66 KiB |
After Width: | Height: | Size: 224 B |
After Width: | Height: | Size: 2.1 KiB |
After Width: | Height: | Size: 1.7 KiB |
After Width: | Height: | Size: 1.8 KiB |