From d27fbd63d7840787d7f3ca5333b6e24dc3a860d4 Mon Sep 17 00:00:00 2001 From: mh-two-thousand-and-two <17391232786@163.com> Date: 星期五, 29 三月 2024 18:43:30 +0800 Subject: [PATCH] 第二次提交 --- static/image/搜索.png | 0 components/table1/table1.vue | 24 static/image/search.svg | 1 static/initialize.css | 14 package-lock.json | 2 pages/repository/repository.vue | 513 +++--- pages/zhongyi/zhongyi.vue | 44 App.vue | 4 components/headNav/headNav.vue | 95 components/advancedSearch/advancedSearch.vue | 137 ++ components/footer/footer.vue | 46 pages/characterMap/characterMap.vue | 318 ++++ components/form/form.vue | 63 static/image/characterRelationBg.png | 0 pages/forgetPass/forgetPass.vue | 534 +++++++ pages/index/index.vue | 493 ++----- static/image/quote.svg | 1 static/image/logo.png | 0 static/image/重置密码.png | 0 pages.json | 48 pages/Login/Login.vue | 562 ++++++++ static/image/用户注册.png | 0 TCM_CharacterLibrary | 1 /dev/null | 20 pages/characterRelation/characterRelation.vue | 249 +++ pages/knowledgeBase/knowledgeBase.vue | 309 ++++ static/image/ProfileBg.png | 0 pages/Register/Register.vue | 555 ++++++++ static/image/profile.svg | 1 static/image/用户登录.png | 0 30 files changed, 3,322 insertions(+), 712 deletions(-) diff --git a/App.vue b/App.vue index 7863161..12fa864 100644 --- a/App.vue +++ b/App.vue @@ -20,6 +20,7 @@ @import '@/static/customicons.css'; // 璁剧疆鏁翠釜椤圭洰鐨勮儗鏅壊 @import '@/static/initialize.css'; + page { background-color: #f5f5f5; } @@ -30,5 +31,4 @@ color: #333; padding: 10px; } - -</style> +</style> \ No newline at end of file diff --git a/TCM_CharacterLibrary b/TCM_CharacterLibrary new file mode 160000 index 0000000..bd37b0a --- /dev/null +++ b/TCM_CharacterLibrary @@ -0,0 +1 @@ +Subproject commit bd37b0a842b37ab5e0eb016b82cd757c0cc7da2d diff --git a/components/advancedSearch/advancedSearch.vue b/components/advancedSearch/advancedSearch.vue new file mode 100644 index 0000000..a8f56f0 --- /dev/null +++ b/components/advancedSearch/advancedSearch.vue @@ -0,0 +1,137 @@ +<template> + <view style="height: 100% ;"> + <view class="flex flex-center" style="margin: 20rpx 0;"> + <luanqing-search class="search_bar" @onSearch="onSearch" :buttonText="buttonText" :isSearchTrue="isSearchTrue"></luanqing-search> + <view class="" v-if="isAvancedTrue" @click="isAvancedClick" + style="color:#244A7B ;font-size: .12rem;margin-left: .31rem;cursor: pointer;">楂樼骇鎼滅储 锕�</view> + </view> + <!-- 楂樼骇鎼滅储 --> + <view class="" v-if="isAdvancedSearch" style="padding: 0 1.24rem; margin-bottom: .18rem;"> + <view style="background-color: #fff;padding: .29rem;" class=""> + <h3>楂樼骇鎼滅储</h3> + <MyForm @submit="onSubmit" :from="from" /> + </view> + </view> + </view> +</template> + +<script> + import MyForm from '@/components/form/form.vue' + export default { + props:{ + isAvancedTrue:{ + type:Boolean, + default(){ + return true + } + },isSearchTrue:{ + type:Boolean, + default(){ + return true + } + },buttonText:{ + type:String, + default(){ + return '鎼滅储' + } + }, + + }, + components: { + MyForm + }, + name: "advancedSearch", + data() { + return { + // 楂樼骇鎼滅储鏄剧ず + isAdvancedSearch: false, + // 楂樼骇鎼滅储 + from: { + from: [{ + type: 'input', + label: '濮撳悕', + name: 'name', + value: '' + }, + { + type: 'select', + label: '鎬у埆', + value: '', + name: 'sex', + options: [{ + label: '鐢�', + value: '鐢�' + }, + { + label: '濂�', + value: '濂�' + } + ] + }, + { + type: 'input', + label: '鑱旂郴', + name: 'phone', + value: '' + }, + { + type: 'input', + label: '璇佷欢', + name: 'idNumber', + value: '' + }, + { + type: 'select', + label: '鐘舵��', + name: 'state', + value: '', + options: [{ + label: '鏈敵璇�', + value: '鏈敵璇�' + }, + { + label: '宸茬敵璇�', + value: '宸茬敵璇�' + }, + { + label: '宸插垹闄�', + value: '宸插垹闄�' + } + ] + } + ] + }, + + }; + }, + methods: { + isAvancedClick() { + this.isAdvancedSearch = !this.isAdvancedSearch + // this.$nextTick(() => { + + // var box1Height = document.querySelector('.fbox').offsetHeight; + // // let box2Height= document.querySelector('.fbox1').style.height = box1Height + 'px'; + // let box2Height = document.querySelector('.fbox1').offsetHeight + // console.log(box1Height, box2Height); + // if (box1Height <= box2Height) { + // document.querySelector('.fbox1').style.height = box1Height + 'px'; + // } + // }) + }, + onSearch(val) { + this.$emit('onSearch',val) + console.log(val); + }, + onSubmit(val) { + console.log(val); + }, + } + } +</script> + +<style> +.search_bar{ + width: 5rem; + height: .36rem; +} +</style> \ No newline at end of file diff --git a/components/footer/footer.vue b/components/footer/footer.vue new file mode 100644 index 0000000..e227a2a --- /dev/null +++ b/components/footer/footer.vue @@ -0,0 +1,46 @@ +<template> + <view class="BottomColumn flex flex-center"> + <view class="Bbar flex"> + <img style="display: block;margin-right: .22rem;width: .52rem;height: .52rem;" src="@/static/image/logo.png" alt="" srcset="" /> + <view class="font-family" style="color: #2C2C2C; font-size: .14rem;line-height: normal;font-weight: 600;"> + <view class=""> + 92017涓浗涓尰绉戝闄腑鍖昏嵂淇℃伅鐮旂┒鎵�鐗堟潈鎵�鏈変含ICP澶囦笟鏂瑰畨澶т笟鏂逛笟鏂� + </view> + <view class="">鍦板潃:鍖椾含甯備笢鍩庡尯涓滅洿闂ㄥ唴鍗楀皬琛�16鍙烽偖缂�:100700 + 鐢佃瘽:8610-64089611Email:tcmbase@126.com</view> + </view> + </view> + </view> +</template> + +<script> + export default { + name:"footer", + data() { + return { + + }; + } + } +</script> + +<style scoped> +.BottomColumn { + position: fixed; + left: 0px; + bottom: 0px; + padding: .19rem 0; + width: 100%; + background-color: #e6eff8; + font-size: 10px; + color: #000; + + .Bbar { + img { + width: 60rpx; + height: 60rpx; + border-radius: 50%; + } + } + } +</style> \ No newline at end of file diff --git a/components/form/form.vue b/components/form/form.vue new file mode 100644 index 0000000..9d79a6b --- /dev/null +++ b/components/form/form.vue @@ -0,0 +1,63 @@ +<template class=""> + <div> + <el-form size="mini" :inline="true" style="padding: 30rpx 30rpx 10rpx 30rpx" :model="from" + class="row demo-form-inline col-xs-12"> + <el-row :gutter="10"> + <el-form-item style="width: 30%;" v-for="(item, i) in from.from" :key="i" :label="item.label"> + <el-input v-if="item.type === 'input'" v-model="item.value" + :placeholder="item.label"></el-input> + <el-select v-else-if="item.type === 'select'" v-model="item.value" :placeholder="item.label"> + <el-option v-for="(option, optionIndex) in item.options" :key="optionIndex" + :label="option.label" :value="option.value"></el-option> + </el-select> + </el-form-item> + <!-- 鍏朵粬琛ㄥ崟椤圭渷鐣� --> + <!-- <el-form-item style="display:block; "> --> + <view class="flex flex-center"> + + <el-button style="background-color: #244A7B;color: #fff;" size="mini" @click="handleSubmit">鎻愪氦</el-button> + <el-button type="info" plain size="mini" @click="handleReset">閲嶇疆</el-button> + </view> + <!-- </el-form-item> --> + </el-row> + </el-form> + </div> +</template> +<script> + export default { + props: ['from'], + methods: { + handleSubmit() { + this.$message({ + message: '鏌ヨ鎴愬姛', + type: 'success' + }) + const result = this.from.from.reduce((obj, item) => { + obj[item.name] = item.value + return obj + }, {}) + // 鎻愪氦閫昏緫 + this.$emit('submit', result) // 鍙戦�� submit 浜嬩欢锛屽苟灏嗚〃鍗曟暟鎹綔涓哄弬鏁颁紶閫掔粰鐖剁粍浠� + }, + handleReset() { + this.from.from.forEach(item => { + item.value = '' + }) + // 閲嶇疆閫昏緫 + // this.$emit('reset') // 鍙戦�� reset 浜嬩欢缁欑埗缁勪欢 + } + } + } +</script> + +<style scoped> + .el-form--inline .el-form-item { + margin-right: 0; + } + ::v-deep .el-form-item__content{ + width: 80%; + } + ::v-deep .el-form-item__content div{ + width: 100%; + } +</style> \ No newline at end of file diff --git a/components/headNav/headNav.vue b/components/headNav/headNav.vue index 36226f6..2f106c4 100644 --- a/components/headNav/headNav.vue +++ b/components/headNav/headNav.vue @@ -1,38 +1,41 @@ <template> <view> <view class="NavTop flex" :style="{backgroundImage: 'url('+ bg + ')'}"> - <view class="" @click="menuNav = !menuNav"><img src="../../static/涓尰浜虹墿鐭ヨ瘑搴�0201/涓夋潯鏉�.png" alt="" /></view> - <view class="flex" style="font-size: 24rpx;letter-spacing: 5rpx;"> + <view class="" style="width: .34rem;height: .34rem;" @click="menuNav = !menuNav"><img + style="width: 100%;height: 100%;" src="../../static/涓尰浜虹墿鐭ヨ瘑搴�0201/涓夋潯鏉�.png" alt="" /></view> + <view class="flex" style="letter-spacing: 5rpx;"> <view class="logo"></view> - <view class="" style="margin-left: 26rpx;font-size: 30rpx;font-family: cursive;font-weight: 900;">涓尰鍖讳簨鍒跺害 + <view class="" style="margin-left: .19rem;font-size: .24rem;font-family: cursive;font-weight: 900;"> + 涓尰鍖讳簨鍒跺害 </view> - </view> + </view> <view class="NavTopr flex"> - <view class="search-container" style=""> + <view class="search-container" style="margin-right: .30rem;"> <view :class="{ 'expanded': isExpanded ,'search-bar':isExpanded}"> <input v-if="isExpanded" type="text" @blur="InputBlur" class="search-input" v-model="searchInput" placeholder="璇疯緭鍏ユ悳绱㈠唴瀹�" /> - <img style="background-color: #000;border-radius: 50%;margin-top: -4rpx;" class="search-logo" - @click="toggleSearch" src="@/static/image/search.png"></img> + <!-- <img + src=""></img> --> + <view class="search-logo" @click="toggleSearch" style="background-color: #000;border-radius: 50%;margin-top: -4rpx;"></view> </view> </view> <!-- <img style="border-radius: 50%;display: inline-block;" src="../../static/image/search.png" alt="" /> --> - <img src="@/static/image/people.png" style="display: inline-block;" alt="" /> - <img src="@/static/image/question.png" alt="" /> + <img src="@/static/image/profile.svg" alt="" /> + <img src="@/static/image/quote.svg" style="margin-right: 0;" alt="" /> </view> </view> <view class="mImage" :style="{backgroundImage: 'url('+ bg1 + ')'}"></view> - <el-dialog :visible.sync="menuNav" class="leftListBg" :modal="false" title="瀵硅瘽妗嗘爣棰�"> + <el-dialog :visible.sync="menuNav" class="leftListBg" :modal="false" title="瀵硅瘽妗嗘爣棰�"> <!-- 鑳屾櫙 --> <img class="leftListBgImage" src="@/static/image/leftListBg.png" alt="" /> <view class="" style="position: relative;z-index: 999;"> - <view class="flex" style="justify-content: center;margin: 90rpx 0;"> + <view class="flex" style="justify-content: center;margin: .52rem 0 .46rem 0;"> <img src="@/static/image/logo.png" style="width: 100rpx;height: 100rpx;"></img> </view> <el-menu default-active="1" active-text-color="#ffffff" class="el-menu-vertical-demo" @select="handleSelect"> <el-menu-item index="1" style=" border-radius: 30px;"> - <span slot="title" >棣栭〉</span> + <span slot="title">棣栭〉</span> </el-menu-item> <el-menu-item index="2"> <span slot="title">涓尰浜虹墿鏁版嵁搴�</span> @@ -64,15 +67,15 @@ export default { name: "headNav", props: { - bg:{ - type:String, - default(){ + bg: { + type: String, + default () { return '/static/image/topBg.png' } }, - bg1:{ - type:String, - default(){ + bg1: { + type: String, + default () { return '/static/image/line.png' } } @@ -103,15 +106,15 @@ // uni.navigateTo({ // url: '/pages/option3Page' // }); - }else if (index === '4') { + } else if (index === '4') { // uni.navigateTo({ // url: '/pages/option3Page' // }); - }else if (index === '5') { + } else if (index === '5') { // uni.navigateTo({ // url: '/pages/option3Page' // }); - }else if (index === '6') { + } else if (index === '6') { // uni.navigateTo({ // url: '/pages/option3Page' // }); @@ -146,18 +149,18 @@ .NavTop { /* background: url(@/static/image/topBg.png); */ background-size: 100% 100%; - padding: 25rpx; + padding: .16rem .24rem; color: #fff !important; img { - width: 30rpx; - height: 30rpx; + width: .1rem; + height: .1rem; vertical-align: middle; } .logo { - width: 40rpx; - height: 40rpx; + width: .32rem; + height: .32rem; background: url(@/static/image/logo.png) 0 0 no-repeat; background-size: 100% 100%; } @@ -166,7 +169,9 @@ vertical-align: top; img { - margin-right: 20rpx; + width: .34rem; + height: .34rem; + margin-right: .30rem; vertical-align: middle; } } @@ -174,7 +179,7 @@ .mImage { width: 100%; - height: 30rpx; + height: .2rem; /* background-image: url(@/static/image/line.png); */ background-size: cover; /* 鑳屾櫙鍥剧墖瑕嗙洊鏁翠釜鍏冪礌 */ @@ -230,13 +235,15 @@ } .search-logo { - width: 30rpx; + width: .34rem; /* logo鍥炬爣鐨勫搴� */ - height: 30rpx; + height: .34rem; /* logo鍥炬爣鐨勯珮搴� */ margin-left: 10rpx; /* 涓庤緭鍏ユ涔嬮棿鐨勯棿璺� */ cursor: pointer; + background-image: url(@/static/image/search.svg); + background-size: 100% 100%; } .leftListBg { @@ -260,29 +267,37 @@ ::v-deep .el-menu .is-active { background-color: #244A7B !important; border-radius: 30px; + + /* padding: 0 .14rem !important; */ } .el-menu-item { - line-height: 40px; - height: 40px; - margin: 20rpx 0; - - span { - vertical-align: top; - } + height: .34rem; + font-size: .16rem; + text-align: center; + font-weight: 500; + margin: .13rem .14rem !important; + display: flex; + justify-content: center; + align-items: center; } - ::v-deep .el-dialog__body{ + + ::v-deep .el-dialog__body { padding-top: 0 !important; } + ::v-deep .el-dialog { margin-top: 0 !important; position: fixed; top: 0; left: 0; height: 100vh; - width: 500rpx; + width: 2.51rem; } - ::v-deep .el-dialog__header{ + + ::v-deep .el-dialog__header { display: none; } + + /* ::v-deep .el-menu-vertical-demo */ </style> \ No newline at end of file diff --git a/components/header/header.vue b/components/header/header.vue deleted file mode 100644 index 8cb7a80..0000000 --- a/components/header/header.vue +++ /dev/null @@ -1,20 +0,0 @@ -<template> - <view> - - </view> -</template> - -<script> - export default { - name:"header", - data() { - return { - - }; - } - } -</script> - -<style> - -</style> \ No newline at end of file diff --git a/components/table1/table1.vue b/components/table1/table1.vue index 4f3549a..ac388df 100644 --- a/components/table1/table1.vue +++ b/components/table1/table1.vue @@ -1,8 +1,8 @@ <template> <div> - <el-table :max-height="height" :data="data" border> + <el-table :max-height="height" :data="data" > <el-table-column min-width="110" :sort-method="sortAge" v-for="column in columns" :key="column.prop" :label="column.label" header-align="center"> - <template slot-scope="scope"> + <template slot-scope="scope" class="font-family"> <template v-if="column.type === 'image'"> <el-image :src="scope.row[column.prop]" alt="鍔犺浇澶辫触"></el-image> </template> @@ -87,15 +87,29 @@ height: 70px; } /* 琛ㄥご */ +::v-deep .el-table__header{ + margin-bottom: .02rem; +} ::v-deep .el-table__header th { - background-color: #5879a4; + height: .3rem; + line-height: .3rem; + font-size: .14rem; + background-color: #597AA5; color: white; /* 琛ㄥご鏂囧瓧棰滆壊涓虹櫧鑹诧紝澧炲姞瀵规瘮搴� */ + margin-bottom: .02rem !important; } /* 琛ㄦ牸 */ ::v-deep .el-table__body td { - background-color: #ebf3fe; - color: #000; + background-color:#DDE8F6; + height: .3rem; + line-height: .3rem; + font-size: .14rem; + color: #2C2C2C !important; + border-bottom: .02rem solid #fff; } +/* ::v-deep .el-table__body { + border-bottom: .02rem solid #fff !important; +} */ ::v-deep .el-table .el-table__cell{ font-size: 9px; padding: 0; diff --git a/package-lock.json b/package-lock.json index 7583bce..400b1c9 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,5 +1,5 @@ { - "name": "antd-demo", + "name": "TCM_CharacterLibrary", "lockfileVersion": 2, "requires": true, "packages": { diff --git a/pages.json b/pages.json index 34fe10f..176830b 100644 --- a/pages.json +++ b/pages.json @@ -1,5 +1,14 @@ { - "pages": [ { + "pages": [ + { + "path" : "pages/Login/Login", + "style" : + { + "navigationBarTitleText" : "", + "enablePullDownRefresh" : false, + "navigationStyle": "custom" + } + },{ "path": "pages/index/index", "style": { // "navigationBarTitleText": "uni-app", @@ -76,6 +85,43 @@ "enablePullDownRefresh" : false, "navigationStyle": "custom" } + }, + { + "path" : "pages/characterRelation/characterRelation", + "style" : + { + "navigationBarTitleText" : "", + "enablePullDownRefresh" : false, + "navigationStyle": "custom" + } + }, + { + "path" : "pages/characterMap/characterMap", + "style" : + { + "navigationBarTitleText" : "", + "enablePullDownRefresh" : false, + "navigationStyle": "custom" + } + }, + + { + "path" : "pages/Register/Register", + "style" : + { + "navigationBarTitleText" : "", + "enablePullDownRefresh" : false, + "navigationStyle": "custom" + } + }, + { + "path" : "pages/forgetPass/forgetPass", + "style" : + { + "navigationBarTitleText" : "", + "enablePullDownRefresh" : false, + "navigationStyle": "custom" + } }], "globalStyle": { "navigationStyle": "custom" diff --git a/pages/Login/Login.vue b/pages/Login/Login.vue new file mode 100644 index 0000000..3ad6d66 --- /dev/null +++ b/pages/Login/Login.vue @@ -0,0 +1,562 @@ +<template> + <view class="container flex flex-center" style="align-items: flex-start;"> + <view class="repository relative"> + <view class="Ttop flex flex-center flex-wrap" style="flex-direction: column;"> + <view class=""></view> + <view class="" ref="Rtop"> + <text class="login"></text> + <text + style="font-size: .36rem;letter-spacing: 4rpx;vertical-align: middle;font-family: cursive;font-weight: bold;">涓浗鍖诲浜虹墿鐭ヨ瘑搴�</text> + </view> + <view></view> + </view> + <el-card> + <!-- 鐢ㄦ埛鐧诲綍 v-if="isLogin"--> + <view class="LoginTop" + style="display: flex; justify-content: space-between;margin-bottom: .47rem;align-items: center;"> + <!-- <view style="color: #244A7B;padding-bottom: .47rem;font-size: .3rem;font-weight: bold;">鐢ㄦ埛鐧诲綍</view> --> + <view class="LoginBg"></view> + <view class=""> </view> + </view> + <el-form :hide-required-asterisk="true" ref="formLogin1" label-position="top" :rules="rules1" + :model="loginData"> + <el-form-item label="鐧诲綍璐﹀彿" prop="loginID"> + <el-input v-model="loginData.loginID"></el-input> + </el-form-item> + <el-form-item label="鐧诲綍瀵嗙爜" prop="pass"> + <el-input v-model="loginData.pass"></el-input> + </el-form-item> + <el-form-item class="btn"> + <el-button class="font-family" + style="margin-top: .47rem; font-weight:900;font-size: .3rem; width: 100%;background-color:#244A7B;color: #fff;padding: .16rem;" + size="medium" @click="Login('formLogin1')">鐧诲綍</el-button> + </el-form-item> + <view class="" style="display: flex;font-size: .14rem;color: #244A7B;"> + <view class="" style="display: inline-block;cursor: pointer;" @click="forgetPass">蹇樿瀵嗙爜 + </view> + <view class="" style="display: inline-block;margin: 0 20rpx;"> | </view> + <view class="" style="display: inline-block;cursor: pointer;" @click="quickRegister">蹇�熸敞鍐� + </view> + </view> + </el-form> + </el-card> + </view> + <view class="hua"></view> + <!-- 搴曢儴浜虹墿鑳屾櫙鍥惧乏渚� --> + <view class="fff"></view> + <!-- 搴曢儴鑺辩殑鑳屾櫙鍥惧彸渚� --> + <view class="rrr"></view> + + <Footer1 /> + </view> +</template> + +<script> + import { + nextTick + } from "vue"; + import Footer1 from '@/components/footer/footer.vue' + export default { + components: { + Footer1 + }, + data() { + // 瀵嗙爜 + var validatePass = (rule, value, callback) => { + if (value === '') { + callback(new Error('璇疯緭鍏ュ瘑鐮�')); + } else { + if (this.registerData.checkPass !== '') { + this.$nextTick(() => { + this.$refs.formLogin.validateField('checkPass'); + }); + } + callback(); + } + }; + // 纭瀵嗙爜 + var validatePass2 = (rule, value, callback) => { + if (value === '') { + callback(new Error('璇峰啀娆¤緭鍏ュ瘑鐮�')); + } else if (value !== this.registerData.pass) { + callback(new Error('涓ゆ杈撳叆瀵嗙爜涓嶄竴鑷�!')); + } else { + callback(); + } + }; + return { + // 鐢ㄦ埛娉ㄥ唽 + isRegister: false, + // 鐢ㄦ埛鐧诲綍 + isLogin: true, + // 淇敼瀵嗙爜 + isAmendPass: false, + // 閲嶇疆瀵嗙爜 + isResetPass: false, + // 娉ㄥ唽鐢ㄦ埛璐﹀彿鐨勬牎楠� + rules: { + loginID: [{ + required: true, + message: '璇疯緭鍏ョ櫥褰曡处鍙�', + trigger: 'blur' + }], + pass: [{ + required: true, + message: '璇疯緭鍏ュ瘑鐮�', + trigger: 'blur' + }, + { + min: 6, + max: 12, + message: '瀵嗙爜闀垮害鍦� 6 鍒� 12 涓瓧绗�', + trigger: 'blur' + }, + { + validator: validatePass, + trigger: 'blur' + } + ], + checkPass: [{ + validator: validatePass2, + trigger: 'blur' + }], + cellphoneORmailbox: [{ + required: true, + message: '璇疯緭鍏ラ偖绠卞湴鍧�', + trigger: 'blur' + }, + { + type: 'email', + message: '璇疯緭鍏ユ纭殑閭鍦板潃', + trigger: ['blur', 'change'] + } + ], + verifyCode: [{ + required: true, + message: '璇疯緭鍏ラ獙璇佺爜', + trigger: 'blur' + }, + { + validator: (rule, value, callback) => this.validateVerificationCode(rule, value, callback), + trigger: 'blur' + } + ] + }, + rules1: { + loginID: [{ + required: true, + message: '璇疯緭鍏ョ櫥褰曡处鍙�', + trigger: 'blur' + }], + pass: [{ + required: true, + message: '璇疯緭鍏ュ瘑鐮�', + trigger: 'blur' + }, + { + min: 6, + max: 12, + message: '瀵嗙爜闀垮害鍦� 6 鍒� 12 涓瓧绗�', + trigger: 'blur' + } + ], + }, + + // 鐧诲綍娉ㄥ唽妗� + loginTrue: true, + Rtop1: 0, + value: 'sdfdsf', + // 娉ㄥ唽鐢ㄦ埛瀵瑰簲鐨勬暟鎹� + registerData: { + loginID: '', + pass: '', + checkPass: '', + cellphoneORmailbox: '', + verifyCode: '' + }, + // 鐧诲綍鐢ㄦ埛璐﹀彿 + loginData: { + // 璐﹀彿 + loginID: '', + pass: '' + }, + // 閲嶇疆瀵嗙爜 + resetDataPass: { + cellphoneORmailbox: '', + verifyCode: "", + newPass: "", + checkPass: "" + }, + // 淇敼瀵嗙爜 + amendDataPass: { + loginID: '', + originalPass: "", + newPass: "", + checkPass: "" + }, + // 涔︾睄鏁版嵁 + listData: [{ + name: '鍘嗕唬鍖诲浼犺搴�', + id: 1, + }, { + name: '涓栧尰鍖诲搴�', + id: 2, + }, { + name: '鍖诲瀛︽湳娴佹淳', + id: 3, + }, { + name: '涓浗鍦板煙鍖昏氨', + id: 4, + }, { + name: '涓浗鍖讳簨鍒跺害', + id: 5, + }, + + ] + } + }, + onLoad() { + uni.getSystemInfo({ + success: function(info) { + // console.log('灞忓箷鐨勫搴︼細' + info.windowWidth); + // console.log('灞忓箷鐨勯珮搴︼細' + info.windowHeight); + } + }); + }, + mounted() { + this.getElementWidth(); + }, + methods: { + // 鍒楄〃椤硅烦杞� + listDataClick(item) { + console.log(item); + // 鍦ㄥ綋鍓嶉〉闈㈣缃叏灞�鍙橀噺 + // uni.setStorageSync('globalData', { id: 123, name: 'example' }); + if (item.id == 1) { + uni.navigateTo({ + url: '/pages/repository/repository?id=' + item.id + }) + } else if (item.id == 2) { + console.log(item.name); + // uni.navigateTo({ + // url:'/pages/repository/repository?id='+item.id + // }) + } else if (item.id == 3) { + uni.navigateTo({ + url: '/pages/dataDisplay/dataDisplay?id=' + item.id + }) + } else if (item.id == 4) { + uni.navigateTo({ + url: '/pages/territory/territory?id=' + item.id + }) + } else if (item.id == 5) { + uni.navigateTo({ + url: '/pages/TcmSystem/TcmSystem?id=' + item.id + }) + } + + }, + // 蹇樿瀵嗙爜 + forgetPass() { + uni.redirectTo({ + url: '/pages/forgetPass/forgetPass' + }) + }, + // 蹇�熸敞鍐� + quickRegister() { + uni.redirectTo({ + url: '/pages/Register/Register' + }) + }, + // 楠岃瘉鐮佹牎楠� + validateVerificationCode(rule, value, callback) { + if (value !== '123456') { + callback(new Error('楠岃瘉鐮侀敊璇�')); + } else { + callback(); + } + }, + getElementWidth() { + + this.$nextTick(() => { + var width = this.$refs.Rtop.$el.clientWidth; + this.Rtop1 = width + 50; + console.log('Element width:', width); + }) + }, + // 鐢ㄦ埛鐧诲綍 + Login(formName) { + console.log('鐢ㄦ埛鐧诲綍鐨勭櫥褰曟寜閽�'); + this.$refs[formName].validate((valid) => { + if (valid) { + alert('submit!鎴愬姛'); + uni.redirectTo({ + url: '/pages/index/index' + }) + } else { + console.log('error submit!!澶辫触'); + return false; + } + }); + }, + // 鐢ㄦ埛娉ㄥ唽 + Login1(formName) { + console.log('鐢ㄦ埛娉ㄥ唽鐨勭櫥褰曟寜閽�'); + this.$refs[formName].validate((valid) => { + if (valid) { + alert('submit!鎴愬姛'); + } else { + console.log('error submit!!澶辫触'); + return false; + } + }); + }, + // 蹇樿瀵嗙爜 + Login2(formName) { + console.log('蹇樿瀵嗙爜鐨勭櫥褰曟寜閽�'); + this.$refs[formName].validate((valid) => { + if (valid) { + alert('submit!鎴愬姛'); + } else { + console.log('error submit!!澶辫触'); + return false; + } + }); + } + } + } +</script> + +<style scoped> + @media screen and (min-width: 1441px) { + ::v-deep .el-card { + top: 60% !important; + } + + .BottomColumn { + padding: .10rem 0; + } + + .LoginTop { + margin-bottom: .17rem !important; + } + + .btn ::v-deep .el-button { + margin-top: 0.1rem !important; + font-size: 0.2rem !important; + width: 100%; + padding: 0.12rem !important; + } + + .LoginBg { + height: .3rem !important; + } + + .hua { + height: 4rem !important; + } + + .fff { + height: 3.5rem !important; + } + + .rrr { + height: 2.5rem !important; + } + } + + + + .LoginBg { + width: 1.2rem; + height: .37rem; + background: url(@/static/image/鐢ㄦ埛鐧诲綍.png) no-repeat 0 0; + background-size: 100% 100%; + margin-bottom: .47rem; + } + + + ::v-deep .el-card { + border-radius: 0; + width: 5.42rem; + /* height: 4.75rem; */ + position: absolute; + top: 80%; + } + + ::v-deep .el-card__body { + padding: .17rem .58rem; + } + + .btn>>>.el-form-item__content { + margin-left: 0 !important; + } + + /* ::v-deep .el-form-item__label { + + + } */ + + ::v-deep .el-input__inner { + border: none; + border-bottom: 1px solid #2d476a; + border-radius: 0; + } + + ::v-deep .el-form-item__error { + /* display: none; */ + } + + ::v-deep .input.invalid:focus { + border-color: #2d476a !important; + } + + ::v-deep .el-input__inner:invalid { + border-color: #2d476a !important; + } + + ::v-deep .el-form-item__label {} + + ::v-deep .el-form-item__label { + padding: 0; + color: #244A7B; + font-size: .14rem; + font-weight: 500; + } + + ::v-deep .el-form-item { + margin-bottom: .22rem; + } + + .ss1 { + background-repeat: no-repeat; + background-size: 100% 100%; + width: 40rpx; + height: 40rpx; + background-size: 100% 100%; + } + + .s1 { + background-image: url(@/static/image/search.png); + + } + + .s2 { + background-image: url(@/static/image/question.png); + } + + .s3 { + background-image: url(@/static/image/question.png); + } + + .container { + background: url(@/static/image/bg1.png); + width: 100vw; + height: 100vh; + + color: #fff; + + .repository { + width: 100% !important; + /* margin-top: 19px; */ + /* height: 68%; */ + display: flex; + flex-direction: column; + justify-content: space-around; + align-items: center; + + .Ttop { + margin-top: .38rem; + margin-bottom: 1.22rem; + } + + .r-top { + font-size: 40rpx !important; + margin: 10rpx 0; + } + } + + } + + .login { + width: .52rem; + height: .52rem; + display: inline-block; + vertical-align: middle; + margin-right: .19rem; + background: url(@/static/image/logo.png) no-repeat 0 0; + background-size: 100% 100%; + } + + .rrr { + position: absolute; + right: .53rem; + bottom: .36rem; + width: 2.5rem; + height: 3.07rem; + opacity: 1; + background: url(@/static/image/bg4.png); + background-size: 100% 100%; + } + + .hua { + width: 13.81rem; + height: 5.965rem; + position: absolute; + background: url(@/static/image/bg3.png) no-repeat 0 0; + background-size: 100% 100%; + } + + /* 搴曢儴浜虹墿鑳屾櫙鍥� */ + .fff { + background: url(@/static/image/bg2.png) no-repeat 0 0; + background-size: 100% 100%; + width: 2.74rem; + height: 4.52rem; + position: fixed; + bottom: 0; + z-index: 9999999999999; + left: 0; + } + + ::v-deep .uni-easyinput__content { + border-radius: 30rpx !important; + /* height: 52rpx; */ + } + + + .secretary { + width: 1300rpx !important; + height: 50rpx; + /* height: 80%; */ + /* flex-wrap: wrap; */ + padding: 0 20px; + text-align: center; + + + + + li { + background-color: #fff; + color: black; + height: 600rpx; + display: flex; + justify-content: space-between; + flex-direction: column; + align-items: center; + border: 1rpx solid #fff; + padding: 50rpx 65rpx; + /* padding: 58rpx 128rpx 88rpx; */ + text-align: center; + background: #EBF4FF; + } + } + + + + .Bbottom { + display: flex; + justify-content: center; + + } +</style> \ No newline at end of file diff --git a/pages/Register/Register.vue b/pages/Register/Register.vue new file mode 100644 index 0000000..c84bad3 --- /dev/null +++ b/pages/Register/Register.vue @@ -0,0 +1,555 @@ +<template> + <view class="container flex flex-center" style="align-items: flex-start;"> + <view class="repository relative"> + <view class="Ttop flex flex-center flex-wrap" style="flex-direction: column;"> + <view class=""></view> + <view class="" ref="Rtop"> + <text class="login"></text> + <text + style="font-size: .36rem;letter-spacing: 4rpx;vertical-align: middle;font-family: cursive;font-weight: bold;">涓浗鍖诲浜虹墿鐭ヨ瘑搴�</text> + </view> + <view></view> + </view> + <!-- 娉ㄥ唽鐢ㄦ埛 v-if="isRegister"--> + <el-card> + <view class="LoginTop" + style="display: flex; justify-content: space-between;margin-bottom: .47rem;align-items: center;"> + <!-- <view class="" style="color: #244A7B;padding-bottom: .47rem;font-size: .3rem;font-weight: bold;">鐢ㄦ埛娉ㄥ唽</view> --> + <view class="LoginBg"></view> + <view class="" @click="BacktoLogin" + style="cursor: pointer;font-size: .14rem;color: #244A7B;font-weight: normal;"> + 宸叉湁璐﹀彿锛熻繑鍥炵櫥褰� + </view> + </view> + <el-form :hide-required-asterisk="true" ref="formLogin" label-position="right" :rules="rules" + :model="registerData"> + <el-form-item label="鐧诲綍璐﹀彿" prop="loginID"> + <el-input v-model="registerData.loginID" placeholder="鐢卞瓧姣嶆垨鏁板瓧缁勫悎3-15涓瓧绗︾粍鎴�"></el-input> + </el-form-item> + <el-form-item label="鐧诲綍瀵嗙爜" prop="pass"> + <el-input type="password" v-model="registerData.pass" + placeholder="瀛楁瘝銆佹暟瀛楁垨鐗规畩绗﹀彿缁勬垚(6-10)涓瓧绗�"></el-input> + </el-form-item> + <el-form-item label="纭瀵嗙爜" prop="checkPass"> + <el-input type="password" v-model="registerData.checkPass" placeholder="蹇呴』涓庡瘑鐮佷竴鑷�"></el-input> + </el-form-item> + <el-form-item label="鎵嬫満/閭" prop="cellphoneORmailbox"> + <el-input v-model="registerData.cellphoneORmailbox" placeholder="璇峰~鍐欐纭殑鎵嬫満鎴栫數瀛愰偖绠卞湴鍧�"></el-input> + </el-form-item> + <el-form-item label="楠岃瘉鐮�" prop="verifyCode"> + <view class="verifyCode relative"> + <el-input v-model="registerData.verifyCode" placeholder="璇疯緭鍏ラ獙璇佺爜"></el-input> + <view @click="verifyCodeClick" class="" + style="position: absolute;right: 0%;top: 0%;color: #244A7B;font-size: .14rem;font-weight: 500;"> + 鑾峰彇楠岃瘉鐮�</view> + </view> + </el-form-item> + <el-form-item class="btn" style="margin-bottom: .09rem;"> + <el-button class="font-family" + style="margin-top: .22rem; font-weight:900;font-size: .3rem; width: 100%;background-color:#244A7B;color: #fff;padding: .16rem;" + size="medium" @click="Login('formLogin')">娉ㄥ唽</el-button> + </el-form-item> + <view class="" + style="font-size: .12rem;color: #9E9E9E;font-weight: 500; text-align: center;line-height: normal;margin-bottom: .19rem;"> + 鐢ㄦ埛娉ㄥ唽鍗充唬琛ㄥ悓鎰忋�婃湇鍔℃潯娆俱�嬪拰銆婄敤鎴烽殣绉佷繚鎶ゅ拰涓汉淇℃伅鏉℃銆�</view> + </el-form> + </el-card> + </view> + <view class="hua"></view> + <!-- 搴曢儴浜虹墿鑳屾櫙鍥惧乏渚� --> + <view class="fff"></view> + <!-- 搴曢儴鑺辩殑鑳屾櫙鍥惧彸渚� --> + <view class="rrr"></view> + + <Footer1 /> + </view> +</template> + +<script> + import { + nextTick + } from "vue"; + import Footer1 from '@/components/footer/footer.vue' + export default { + components: { + Footer1 + }, + data() { + // 瀵嗙爜 + var validatePass = (rule, value, callback) => { + if (value === '') { + callback(new Error('璇疯緭鍏ュ瘑鐮�')); + } else { + if (this.registerData.checkPass !== '') { + this.$nextTick(() => { + this.$refs.formLogin.validateField('checkPass'); + }); + } + callback(); + } + }; + // 纭瀵嗙爜 + var validatePass2 = (rule, value, callback) => { + if (value === '') { + callback(new Error('璇峰啀娆¤緭鍏ュ瘑鐮�')); + } else if (value !== this.registerData.pass) { + callback(new Error('涓ゆ杈撳叆瀵嗙爜涓嶄竴鑷�!')); + } else { + callback(); + } + }; + return { + // 鐢ㄦ埛娉ㄥ唽 + isRegister: false, + // 鐢ㄦ埛鐧诲綍 + isLogin: true, + // 淇敼瀵嗙爜 + isAmendPass: false, + // 閲嶇疆瀵嗙爜 + isResetPass: false, + // 娉ㄥ唽鐢ㄦ埛璐﹀彿鐨勬牎楠� + rules: { + loginID: [{ + required: true, + message: '璇疯緭鍏ョ櫥褰曡处鍙�', + trigger: 'blur' + }], + pass: [{ + required: true, + message: '璇疯緭鍏ュ瘑鐮�', + trigger: 'blur' + }, + { + min: 6, + max: 12, + message: '瀵嗙爜闀垮害鍦� 6 鍒� 12 涓瓧绗�', + trigger: 'blur' + }, + { + validator: validatePass, + trigger: 'blur' + } + ], + checkPass: [{ + validator: validatePass2, + trigger: 'blur' + }], + cellphoneORmailbox: [{ + required: true, + message: '璇疯緭鍏ラ偖绠卞湴鍧�', + trigger: 'blur' + }, + { + type: 'email', + message: '璇疯緭鍏ユ纭殑閭鍦板潃', + trigger: ['blur', 'change'] + } + ], + verifyCode: [{ + required: true, + message: '璇疯緭鍏ラ獙璇佺爜', + trigger: 'blur' + }, + { + validator: (rule, value, callback) => this.validateVerificationCode(rule, value, callback), + trigger: 'blur' + } + ] + }, + // 鐧诲綍娉ㄥ唽妗� + loginTrue: true, + Rtop1: 0, + value: 'sdfdsf', + // 娉ㄥ唽鐢ㄦ埛瀵瑰簲鐨勬暟鎹� + registerData: { + loginID: '', + pass: '', + checkPass: '', + cellphoneORmailbox: '', + verifyCode: '' + }, + // 鐧诲綍鐢ㄦ埛璐﹀彿 + loginData: { + // 璐﹀彿 + loginID: '', + pass: '' + }, + // 閲嶇疆瀵嗙爜 + resetDataPass: { + cellphoneORmailbox: '', + verifyCode: "", + newPass: "", + checkPass: "" + }, + // 淇敼瀵嗙爜 + amendDataPass: { + loginID: '', + originalPass: "", + newPass: "", + checkPass: "" + }, + // 涔︾睄鏁版嵁 + listData: [{ + name: '鍘嗕唬鍖诲浼犺搴�', + id: 1, + }, { + name: '涓栧尰鍖诲搴�', + id: 2, + }, { + name: '鍖诲瀛︽湳娴佹淳', + id: 3, + }, { + name: '涓浗鍦板煙鍖昏氨', + id: 4, + }, { + name: '涓浗鍖讳簨鍒跺害', + id: 5, + }, + + ] + } + }, + onLoad() { + uni.getSystemInfo({ + success: function(info) { + // console.log('灞忓箷鐨勫搴︼細' + info.windowWidth); + // console.log('灞忓箷鐨勯珮搴︼細' + info.windowHeight); + } + }); + }, + mounted() { + this.getElementWidth(); + }, + methods: { + // 宸叉湁璐﹀彿锛熻繑鍥炵櫥褰� + BacktoLogin() { + uni.redirectTo({ + url: '/pages/Login/Login' + }) + }, + // 鑾峰彇楠岃瘉鐮� + verifyCodeClick() { + console.log('鑾峰彇楠岃瘉鐮�'); + }, + // 鍒楄〃椤硅烦杞� + listDataClick(item) { + console.log(item); + // 鍦ㄥ綋鍓嶉〉闈㈣缃叏灞�鍙橀噺 + // uni.setStorageSync('globalData', { id: 123, name: 'example' }); + if (item.id == 1) { + uni.navigateTo({ + url: '/pages/repository/repository?id=' + item.id + }) + } else if (item.id == 2) { + console.log(item.name); + // uni.navigateTo({ + // url:'/pages/repository/repository?id='+item.id + // }) + } else if (item.id == 3) { + uni.navigateTo({ + url: '/pages/dataDisplay/dataDisplay?id=' + item.id + }) + } else if (item.id == 4) { + uni.navigateTo({ + url: '/pages/territory/territory?id=' + item.id + }) + } else if (item.id == 5) { + uni.navigateTo({ + url: '/pages/TcmSystem/TcmSystem?id=' + item.id + }) + } + }, + // 楠岃瘉鐮佹牎楠� + validateVerificationCode(rule, value, callback) { + if (value !== '123456') { + callback(new Error('楠岃瘉鐮侀敊璇�')); + } else { + callback(); + } + }, + getElementWidth() { + this.$nextTick(() => { + var width = this.$refs.Rtop.$el.clientWidth; + this.Rtop1 = width + 50; + console.log('Element width:', width); + }) + }, + // 鐢ㄦ埛鐧诲綍 + Login(formName) { + console.log('鐢ㄦ埛鐧诲綍鐨勭櫥褰曟寜閽�'); + this.$refs[formName].validate((valid) => { + if (valid) { + alert('submit!鎴愬姛'); + uni.navigateTo({ + url: '/pages/Login/Login' + }) + } else { + console.log('error submit!!澶辫触'); + return false; + } + }); + }, + // 鐢ㄦ埛娉ㄥ唽 + Login1(formName) { + console.log('鐢ㄦ埛娉ㄥ唽鐨勭櫥褰曟寜閽�'); + this.$refs[formName].validate((valid) => { + if (valid) { + alert('submit!鎴愬姛'); + uni.redirectTo({ + url: '/pages/Login/Login' + }) + } else { + console.log('error submit!!澶辫触'); + return false; + } + }); + } + } + } +</script> +<style scoped> + @media screen and (min-width: 1366px){ + ::v-deep .el-card{ + top: 60% !important; + } + } + @media screen and (min-width: 1920px){ + ::v-deep .el-card{ + top: 80% !important; + } + + }/* + 鍦ㄥ睆骞曞搴﹁秴杩� 1440px 鏃剁殑鏍峰紡璁剧疆 */ + @media screen and (min-width: 1441px) { + ::v-deep .el-card { + top: 80% !important; + } + .BottomColumn{ + padding: .10rem 0; + } + .LoginTop{ + margin-bottom: .17rem !important; + } + .btn ::v-deep .el-button{ + margin-top: 0.1rem !important; + font-size: 0.3rem !important; + width: 100%; + padding: 0.12rem !important; + } + .LoginBg{ + height: .3rem !important; + } + .hua{ + height: 4rem !important; + }.fff{ + height: 3.5rem !important; + }.rrr{ + height: 2.5rem !important; + } + } + + + .LoginBg { + width: 1.2rem; + height: .37rem; + background: url(@/static/image/鐢ㄦ埛娉ㄥ唽.png) no-repeat 0 0; + background-size: 100% 100%; + + } + + + ::v-deep .el-card { + border-radius: 0; + width: 5.42rem; + /* height: 5.65rem; */ + position: absolute; + top: 80%; + } + + ::v-deep .el-card__body { + padding: .175rem .58rem; + } + + .btn>>>.el-form-item__content { + margin-left: 0 !important; + + } + + ::v-deep .el-form-item__content { + margin-left: 0 !important; + flex: 1; + } + + ::v-deep .el-input__inner { + border: none; + border-bottom: 1px solid #2d476a; + border-radius: 0; + padding: 0; + height: .4rem; + line-height: .4rem; + font-size: .14rem; + } + + ::v-deep .el-form-item__error { + /* display: none; */ + font-size: .12rem; + } + + ::v-deep .input.invalid:focus { + border-color: #2d476a !important; + } + + ::v-deep .el-input__inner:invalid { + border-color: #2d476a !important; + } + + + ::v-deep .el-form-item__label { + min-width: .6rem; + padding: 0; + color: #244A7B; + font-size: .14rem; + font-weight: 500; + margin-right: .29rem; + display: flex; + align-items: center; + text-align: right; + } + + ::v-deep .el-form-item { + margin-bottom: .22rem; + display: flex; + } + + .ss1 { + background-repeat: no-repeat; + background-size: 100% 100%; + width: 40rpx; + height: 40rpx; + background-size: 100% 100%; + } + + .s1 { + background-image: url(@/static/image/search.png); + + } + + .s2 { + background-image: url(@/static/image/question.png); + } + + .s3 { + background-image: url(@/static/image/question.png); + } + + .container { + background: url(@/static/image/bg1.png); + width: 100vw; + height: 100vh; + + color: #fff; + + .repository { + width: 100% !important; + /* margin-top: 19px; */ + /* height: 68%; */ + display: flex; + flex-direction: column; + justify-content: space-around; + align-items: center; + + .Ttop { + margin-top: .38rem; + margin-bottom: 1.22rem; + } + + .r-top { + font-size: 40rpx !important; + margin: 10rpx 0; + } + } + + } + + .login { + width: .52rem; + height: .52rem; + display: inline-block; + vertical-align: middle; + margin-right: .19rem; + background: url(@/static/image/logo.png) no-repeat 0 0; + background-size: 100% 100%; + } + + .rrr { + position: absolute; + right: .53rem; + bottom: .36rem; + width: 2.5rem; + height: 3.07rem; + opacity: 1; + background: url(@/static/image/bg4.png); + background-size: 100% 100%; + } + + .hua { + width: 13.81rem; + height: 5.965rem; + position: absolute; + background: url(@/static/image/bg3.png) no-repeat 0 0; + background-size: 100% 100%; + } + + /* 搴曢儴浜虹墿鑳屾櫙鍥� */ + .fff { + background: url(@/static/image/bg2.png) no-repeat 0 0; + background-size: 100% 100%; + width: 2.74rem; + height: 4.52rem; + position: fixed; + bottom: 0; + z-index: 9999999999999; + left: 0; + } + + ::v-deep .uni-easyinput__content { + border-radius: 30rpx !important; + /* height: 52rpx; */ + } + + + .secretary { + width: 1300rpx !important; + height: 50rpx; + /* height: 80%; */ + /* flex-wrap: wrap; */ + padding: 0 20px; + text-align: center; + + + + + li { + background-color: #fff; + color: black; + height: 600rpx; + display: flex; + justify-content: space-between; + flex-direction: column; + align-items: center; + border: 1rpx solid #fff; + padding: 50rpx 65rpx; + /* padding: 58rpx 128rpx 88rpx; */ + text-align: center; + background: #EBF4FF; + } + } + + + + .Bbottom { + display: flex; + justify-content: center; + + } +</style> \ No newline at end of file diff --git a/pages/characterMap/characterMap.vue b/pages/characterMap/characterMap.vue new file mode 100644 index 0000000..ff091e6 --- /dev/null +++ b/pages/characterMap/characterMap.vue @@ -0,0 +1,318 @@ +<template> + <view> + <headNav /> + <view class="" style="position: relative;"> + <!-- 鍦板浘 --> + <view id="spaceTime" style="height: 90vh;width: 100%;position: relative;"></view> + <!-- 璇︽儏 --> + <el-dialog class="particulars" :visible.sync="menuNav" :modal="false"> + <view class="font-family" style="font-size: .26rem;padding-top: .16rem;font-weight: bold;">鏉庢椂鐝�</view> + <ul + style="border-bottom: .01rem solid #D8D8D8; padding: .16rem 0; font-size: .14rem;font-weight: 400;line-height: .28rem;"> + <li>鍑虹敓浜庤暡宸�</li> + <li>1518骞�07鏈�03鏃� 钑插窞锛堜粖婀栧寳钑插窞闀囷級</li> + </ul> + <ul style="margin: .31rem 0 .11rem 0; font-size: .14rem;font-weight: 400;line-height: .28rem;"> + <li>娲诲姩鍚嶇О锛氭挵鍐欍�婃湰鑽夌翰鐩��</li> + <li>娲诲姩鍦扮偣锛氭禉姹熺渷 </li> + <li>娲诲姩鍖洪棿锛氭禉姹熺渷鏉窞甯� </li> + <li>娲诲姩鎻忚堪锛氭挵鍐欍�婃湰鑽夌翰鐩�� </li> + <li>鍙備笌浜哄憳锛氭潕鏃剁弽 </li> + <li>鏉ユ簮缁勬垚锛氭挵鍐欍�婃湰鑽夌翰鐩��</li> + </ul> + <img style="width: 100%;height: 2rem;" + src="https://img0.baidu.com/it/u=1845740325,2917001370&fm=253&app=120&size=w931&n=0&f=JPEG&fmt=auto?sec=1711731600&t=0b208ab46e1d33aa81ac31dd6bf627be" + alt="" /> + <view class="" style="border: 1px solid ; position: absolute;bottom: 0; width: 80%;left: 10%;"> + <!-- <div style="text-align: center; margin-bottom: 20px;">{{currentYear}}</div> + <el-slider v-model="sliderValue" :min="1900" :step="10" :max="2000" :show-stops="true" + @change="handleSliderChange"></el-slider> --> + <input type="range" min="0" max="100" v-model="sliderValue"> + </view> + </el-dialog> + </view> + </view> +</template> + +<script> + import * as echarts from 'echarts'; + import 'echarts/extension/bmap/bmap'; + import { + loadBMap + } from "../../static/map.js" + + export default { + data() { + return { + menuNav: true, + sliderValue: 2024, + currentYear: 2024, + sliderValue: 50 + } + }, + mounted() { + + // 鏃剁┖鍦板浘 + loadBMap('5USVDAhhS4ssz44HLq3gNPZai7naXf4Q').then(() => { + this.spaceTime() + }) + }, + methods: { + handleSliderChange(value) { + this.currentYear = value; + }, + // 鏃剁┖鍦板浘 + spaceTime() { + var chartDom = document.getElementById('spaceTime'); + var myChart = echarts.init(chartDom); + var option; + + const data = [{ + name: '娴烽棬', + value: 9 + }, + { + name: '閲戞槍', + value: 19 + }, + { + name: '娉夊窞', + value: 21 + }, + { + name: '琛㈠窞', + value: 177 + }, + { + name: '寤婂潑', + value: 193 + }, + { + name: '鑿忔辰', + value: 194 + }, + { + name: '鍚堣偉', + value: 229 + }, + { + name: '姝︽眽', + value: 273 + }, + { + name: 'sss澶у簡', + value: 279 + } + ]; + const geoCoordMap = { + 娴烽棬: [121.15, 31.89], + 閯傚皵澶氭柉: [109.781327, 39.608266], + 鎷涜繙: [120.38, 37.35], + 骞抽《灞�: [113.29, 33.75], + 閭㈠彴: [114.48, 37.05], + 寰峰窞: [116.29, 37.45], + 娴庡畞: [116.59, 35.38], + 鑽嗗窞: [112.239741, 30.335165], + 瀹滄槍: [111.3, 30.7], + 涔変箤: [120.06, 29.32], + 涓芥按: [119.92, 28.45], + 娲涢槼: [112.44, 34.7], + 绉︾殗宀�: [119.57, 39.95], + 鏍床: [113.16, 27.83], + 鐭冲搴�: [114.48, 38.03], + 鑾辫姕: [117.67, 36.19], + 甯稿痉: [111.69, 29.05], + 淇濆畾: [115.48, 38.85], + 婀樻江: [112.91, 27.87], + 閲戝崕: [119.64, 29.12], + 宀抽槼: [113.09, 29.37], + 闀挎矙: [113, 28.21], + 琛㈠窞: [118.88, 28.97], + 寤婂潑: [116.7, 39.53], + 鑿忔辰: [115.480656, 35.23375], + 鍚堣偉: [117.27, 31.86], + 姝︽眽: ['浣犲ソ', 30.52], + sss澶у簡: [125.03, 46.58] + }; + const convertData = function(data) { + var res = []; + for (var i = 0; i < data.length; i++) { + var geoCoord = geoCoordMap[data[i].name]; + if (geoCoord) { + res.push({ + name: data[i].name, + value: geoCoord.concat(data[i].value) + }); + } + } + return res; + }; + option = { + tooltip: { + trigger: 'item' + }, + bmap: { + center: [104.114129, 37.550339], // 璋冩暣鍦板浘涓績鐐逛綅缃� + zoom: 6, // 璁剧疆鍦板浘缂╂斁绾у埆 + roam: true, + mapStyle: { + styleJson: [{ + featureType: 'water', + elementType: 'all', + stylers: { + color: '#d1d1d1' + } + }, + { + featureType: 'land', + elementType: 'all', + stylers: { + color: '#f3f3f3' + } + }, + { + featureType: 'manmade', + elementType: 'all', + stylers: { + color: '#d1d1d1' + } + }, + { + featureType: 'local', + elementType: 'all', + stylers: { + color: '#d1d1d1' + } + }, + { + featureType: 'arterial', + elementType: 'labels', + stylers: { + visibility: 'off' + } + }, + { + featureType: 'boundary', + elementType: 'all', + stylers: { + color: '#fefefe' + } + }, + { + featureType: 'building', + elementType: 'all', + stylers: { + color: '#d1d1d1' + } + }, + { + featureType: 'label', + elementType: 'labels.text.fill', + stylers: { + color: '#999999' + } + } + ] + } + }, + series: [ + { + type: 'effectScatter', + coordinateSystem: 'bmap', + data: convertData( + data + .sort(function(a, b) { + return b.value - a.value; + }) + .slice(0, 6) + ), + symbolSize: function(val) { + return val[2] / 10; + }, + encode: { + value: 2 + }, + showEffectOn: 'render', + rippleEffect: { + brushType: 'stroke' + }, + label: { + formatter: '{b}', + position: 'bottom', + backgroundColor: 'rgba(255, 255, 255, 1)', + padding: [4, 8], + formatter: function(params) { // 浣跨敤鍑芥暟鍔ㄦ�佺敓鎴愭爣绛惧唴瀹� + // 璁剧疆鏂囧瓧澶氬皯涓悗闈㈡樉绀虹渷鐣ュ彿 + if (params.data.name.length > 3) { + return params.data.name.substring(0, 3) + '...'; + } else { + return params.data.name; + } + }, + show: true, + fontSize: 12, + borderRadius: 30, + }, + itemStyle: { + shadowBlur: 10, + shadowColor: '#333' + }, + emphasis: { + scale: true + }, + zlevel: 1 + } + ] + }; + // 璁剧疆鐐瑰嚮浜嬩欢鐩戝惉 + myChart.on('click', function(params) { + if (params.componentType === 'series') { + var dataName = params.data.name; // 鑾峰彇鐐瑰嚮鐨勬暟鎹悕绉� + var dataValue = params.data.value; // 鑾峰彇鐐瑰嚮鐨勬暟鎹�� + // 鍦ㄨ繖閲屽彲浠ユ牴鎹渶瑕佸鐞嗙偣鍑讳簨浠讹紝姣斿寮瑰嚭瀵瑰簲鏁版嵁鐨勮缁嗕俊鎭瓑鎿嶄綔 + console.log('鐐瑰嚮浜�', dataName, '鏁版嵁锛屾暟鍊间负', dataValue); + // 杩欓噷鍙互缂栧啓瑙﹀彂鏃堕棿鑾峰彇瀵瑰簲鏁版嵁淇℃伅鐨勯�昏緫 + } + }) + + option && myChart.setOption(option); + + }, + + } + } +</script> + +<style scoped> + ::v-deep .particulars { + position: absolute !important; + top: 0; + right: 0; + bottom: 0; + left: 0; + overflow: auto; + margin: 0; + } + + .particulars ::v-deep .el-dialog { + margin: 0 !important; + position: absolute; + right: 0; + top: 0; + width: 4rem; + height: 100%; + + } + + .particulars ::v-deep .el-dialog__header { + display: none; + } + + .particulars ::v-deep .el-dialog__body { + padding: .26rem .23rem .26rem .27rem; + color: #2C2C2C !important; + position: relative; + height: 100%; + } + +</style> \ No newline at end of file diff --git a/pages/characterRelation/characterRelation.vue b/pages/characterRelation/characterRelation.vue new file mode 100644 index 0000000..ababaa4 --- /dev/null +++ b/pages/characterRelation/characterRelation.vue @@ -0,0 +1,249 @@ +<template> + <view> + <headNav /> + <!-- 楂樼骇鎼滅储 --> + <view style="margin: .35rem 0 .16rem 0; "> + <advancedSearch /> + </view> + <!-- 鐑棬鎼滅储 --> + <view class="flex flex-center" style="font-size: .1rem;color: #2C2C2C;"> + 鐑棬鎼滅储锛� + <ul class="flex" style="margin-right: 10rpx;"> + <li v-for="item in hot" :key="item.id" + style="color: #244A7B; margin: 0 .1rem;color: #5879a4;font-size: .12rem;"> + {{item.name}} + </li> + </ul> + </view> + <!-- 鍏崇郴琛ㄥ湴鍥� --> + <view id="relation" style="margin-top: .2rem; height: 70vh;width: 100%;"></view> + <!-- 鏈濅唬 --> + <view class="flex flex-center" style="width: 100%; position: fixed;bottom: .33rem;left: 0;"> + <ul class="flex"> + <li style="" v-for="(item,index) in dynasty" :key="item.id"> + <view class="flex flex-center" style="height: .35rem; background-color: #fff; color:#244A7B ;"> + {{item.coord}} + </view> + <view class="flex flex-center font-family" + :style="{'marginRight': index === dynasty.length - 1 ? '0' : '0.03rem'}" + style="padding: .05rem .19rem; color: #fff; font-size: .14rem; margin-top: .03rem;margin-right: .03rem;background-color: #597AA5;"> + {{item.name}} + </view> + </li> + </ul> + </view> + </view> +</template> + +<script> + import * as echarts from 'echarts'; + export default { + data() { + return { + // 鏈濅唬 + dynasty: [{ + name: '澶忔湞', + coord: '2070BC', + id: 1 + }, { + name: '鍟嗘湞', + id: 2, + coord: '1600BC', + }, { + name: '瑗垮懆', + id: 3, + coord: '1600BC' + }, { + name: '鏄ョ鎴樺浗', + id: 4, + coord: '770BC' + }, { + name: '绉︽湞', + id: 4, + coord: '221BC' + }, { + name: '姹夋湞', + id: 5, + coord: '202BC' + }, { + name: '涓夊浗涓ゆ檵鍗楀寳鏈�', + id: 6, + coord: '184' + }, { + name: '闅嬫湞', + id: 7, + coord: '581' + }, { + name: '鍞愭湞', + id: 8, + coord: '618' + }, { + name: '浜斾唬鍗佸浗', + id: 9, + coord: '907' + }, { + name: '杈藉閲�', + id: 10, + coord: '907' + }, { + name: '瀹嬫湞', + id: 11, + coord: '960' + }, { + name: '鍏冩湞', + id: 12, + coord: '1271' + }, { + name: '鏄庢湞', + id: 13, + coord: '1368' + }, { + name: '娓呮湞', + id: 14, + coord: '1636' + }], + // 鐑棬鎼滅储 + hot: [{ + id: 1, + name: '鏉庢椂鐝�', + bgColor: false + }, { + id: 2, + name: '鏉庢椂鐝�2', + bgColor: false + }, { + id: 3, + name: '鏉庢椂鐝�3', + bgColor: false + }, ], + } + }, + methods: { + // 鍏崇郴鍥捐氨 + relation() { + var chartDom = document.getElementById('relation'); + var myChart = echarts.init(chartDom); + // 鍋囪鎮ㄦ湁鑺傜偣鍚嶇О鍜屽畠浠箣闂寸殑鍏崇郴鏁版嵁 + var nodes = ['鏉庢椂鐝�', '鎴愬氨', '浼犳壙', '浜插弸', '钁椾綔']; + var relationships = [{ + source: '鏉庢椂鐝�', + target: '鎴愬氨', + relation: '濂藉弸' + }, + { + source: '鏉庢椂鐝�', + target: '浼犳壙', + relation: '濂�1鍙�' + }, + { + source: '鏉庢椂鐝�', + target: '浜插弸', + relation: '濂�2鍙�' + }, + { + source: '鏉庢椂鐝�', + target: '钁椾綔', + relation: '濂�2鍙�' + }, + // 鍏朵粬鍏崇郴... + ]; + + // 鏍规嵁鍏崇郴鏁版嵁鐢熸垚杩炴帴绾� + var links = []; + relationships.forEach(function(relationship) { + var sourceIndex = nodes.indexOf(relationship.source); + var targetIndex = nodes.indexOf(relationship.target); + console.log(sourceIndex, targetIndex); + if (sourceIndex !== -1 && targetIndex !== -1) { + links.push({ + source: sourceIndex, + target: targetIndex, + label: { + show: true, + formatter: function(params) { // 浣跨敤鍑芥暟鍔ㄦ�佺敓鎴愭爣绛惧唴瀹� + return relationships.find(rel => rel.source === nodes[params.data + .source] && rel.target === nodes[params.data.target]) + .relation; + }, // 璁剧疆鍏崇郴鏍囩鍐呭涓�"Child-Parent" + color: '#2C2C2C', + fontSize: 12, + backgroundColor: 'rgba(255, 255, 255, 1)', + padding: [3, 8], + borderRadius: 30, + position: 'middle', // 璁剧疆鏍囩鏂囨湰鍦ㄧ嚎鐨勪腑闂翠綅缃笂灞呬腑鏄剧ず + bottom: -10, + z: 10, // 璁剧疆鏍囩鐨剒杞撮珮搴︼紝浣垮叾姣旇繛鎺ョ嚎鏇撮珮 + // offset: [0, 15] ,// 寰�涓嬬Щ鍔� 10 鍍忕礌 + distance: -12, // 灏嗘爣绛炬斁缃湪杩炴帴绾夸笂 + } + }); + } + + }); + console.log(links); + // 鏍规嵁nodes鍔ㄦ�佺敓鎴愯妭鐐规暟鎹� + var nodeData = nodes.map(function(node, index) { + return { + name: node, + x: Math.random() * 1000, // 璁剧疆闅忔満x鍧愭爣浣嶇疆 + y: Math.random() * 600, // 璁剧疆闅忔満y鍧愭爣浣嶇疆 + itemStyle: { + color: getColorByIndex(index), // 鍙互鏍规嵁绱㈠紩璁剧疆涓嶅悓鐨勯鑹� + borderWidth: 2, + borderColor: getColorByIndex(index + 1) + } + }; + }); + // 璁剧疆棰滆壊 + function getColorByIndex(index) { + var colors = ['#ecf4ff', '#dd9795', '#f1edbe', '#ecf4ff', '#c5dbd8']; // 鍙互鏍规嵁瀹為檯鎯呭喌璁剧疆棰滆壊鏁扮粍 + return colors[index % colors.length]; + } + var option; + option = { + backgroundColor: { + type: 'image', + image: '/static/image/characterRelationBg.png', + repeat: 'repeat-x', // 鏄惁骞抽摵锛屽彲浠ユ槸 'repeat-x', 'repeat-y', 'no-repeat' + size: '100% 100%', // 鑳屾櫙鍥剧墖鐨勫昂瀵革紝鍙互鏄櫨鍒嗘瘮鎴栬�呭儚绱� + position: 'center center' // 鑳屾櫙鍥剧墖鐨勪綅缃紝鍙互鏄� top, bottom, middle 鎴栬�呯櫨鍒嗘瘮 + }, + tooltip: {}, + animationDurationUpdate: 1500, + animationEasingUpdate: 'quinticInOut', + series: [{ + type: 'graph', + layout: 'none', + symbolSize: 40, // 璋冩暣鑺傜偣澶у皬 + label: { + show: true, + color: 'black', // 璁剧疆鑺傜偣鏂囧瓧棰滆壊涓洪粦鑹� + + }, + edgeSymbol: ['circle'], + edgeSymbolSize: [4, 10], + data: nodeData, + links: links, + lineStyle: { + opacity: 0.9, + width: 2, + curveness: 0.3 + } + }] + }; + + // 灏嗙敓鎴愮殑杩炴帴绾挎坊鍔犲埌echarts鍥捐〃鐨刼ption涓� + option.series[0].links = links; + option && myChart.setOption(option); + }, + }, + mounted() { + // 鍏崇郴鍥捐氨 + this.relation() + } + } +</script> + +<style> + +</style> \ No newline at end of file diff --git a/pages/forgetPass/forgetPass.vue b/pages/forgetPass/forgetPass.vue new file mode 100644 index 0000000..bc361f6 --- /dev/null +++ b/pages/forgetPass/forgetPass.vue @@ -0,0 +1,534 @@ +<template> + <view class="container flex flex-center" style="align-items: flex-start;"> + <view class="repository relative"> + <view class="Ttop flex flex-center flex-wrap" style="flex-direction: column;"> + <view class=""></view> + <view class="" ref="Rtop"> + <text class="login"></text> + <text + style="font-size: .36rem;letter-spacing: 4rpx;vertical-align: middle;font-family: cursive;font-weight: bold;">涓浗鍖诲浜虹墿鐭ヨ瘑搴�</text> + </view> + <view></view> + </view> + <!-- 閲嶇疆瀵嗙爜 --> + <el-card > + <view class="LoginTop" + style="display: flex; justify-content: space-between;margin-bottom: .47rem;align-items: center;"> + <!-- <view class="" style="color: #244A7B;padding-bottom: .47rem;font-size: .3rem;font-weight: bold;">鐢ㄦ埛娉ㄥ唽</view> --> + <view class="LoginBg"></view> + <view class="" @click="BacktoLogin" + style="cursor: pointer;font-size: .14rem;color: #244A7B;font-weight: normal;"> + 杩斿洖鐧诲綍 + </view> + </view> + <el-form :hide-required-asterisk="true" ref="formLogin2" label-position="left" + :rules="rules" :model="resetDataPass"> + <el-form-item label="鎵嬫満/閭" prop="cellphoneORmailbox"> + <el-input v-model="resetDataPass.cellphoneORmailbox"></el-input> + </el-form-item> + <el-form-item label="楠岃瘉鐮�" prop="verifyCode"> + <view class="verifyCode relative"> + <el-input v-model="resetDataPass.verifyCode" ></el-input> + <view @click="verifyCodeClick" class="" + style="position: absolute;right: 0%;top: 0%;color: #244A7B;font-size: .14rem;font-weight: 500;"> + 鑾峰彇楠岃瘉鐮�</view> + </view> + </el-form-item> + <el-form-item label="鏂板瘑鐮�" prop="pass"> + <el-input v-model="resetDataPass.newPass"></el-input> + </el-form-item> + <el-form-item label="纭瀵嗙爜" prop="checkPass"> + <el-input v-model="resetDataPass.checkPass"></el-input> + </el-form-item> + <el-form-item class="btn"> + <el-button class="font-family" + style="margin-top: 30rpx; font-weight:900;font-size: 30rpx; width: 100%;background-color: #244a7b;color: #fff;padding: 30rpx;" + size="medium" @click="Login2('formLogin2')">纭畾</el-button> + </el-form-item> + </el-form> + </el-card> + + </view> + <view class="hua"></view> + <!-- 搴曢儴浜虹墿鑳屾櫙鍥惧乏渚� --> + <view class="fff"></view> + <!-- 搴曢儴鑺辩殑鑳屾櫙鍥惧彸渚� --> + <view class="rrr"></view> + + <Footer1 /> + </view> +</template> + +<script> + import { + nextTick + } from "vue"; + import Footer1 from '@/components/footer/footer.vue' + export default { + components: { + Footer1 + }, + data() { + // 瀵嗙爜 + var validatePass = (rule, value, callback) => { + if (value === '') { + callback(new Error('璇疯緭鍏ュ瘑鐮�')); + } else { + if (this.registerData.checkPass !== '') { + this.$nextTick(() => { + this.$refs.formLogin.validateField('checkPass'); + }); + } + callback(); + } + }; + // 纭瀵嗙爜 + var validatePass2 = (rule, value, callback) => { + if (value === '') { + callback(new Error('璇峰啀娆¤緭鍏ュ瘑鐮�')); + } else if (value !== this.registerData.pass) { + callback(new Error('涓ゆ杈撳叆瀵嗙爜涓嶄竴鑷�!')); + } else { + callback(); + } + }; + return { + // 鐢ㄦ埛娉ㄥ唽 + isRegister: false, + // 鐢ㄦ埛鐧诲綍 + isLogin: true, + // 淇敼瀵嗙爜 + isAmendPass: false, + // 閲嶇疆瀵嗙爜 + isResetPass: false, + // 娉ㄥ唽鐢ㄦ埛璐﹀彿鐨勬牎楠� + rules: { + loginID: [{ + required: true, + message: '璇疯緭鍏ョ櫥褰曡处鍙�', + trigger: 'blur' + }], + pass: [{ + required: true, + message: '璇疯緭鍏ュ瘑鐮�', + trigger: 'blur' + }, + { + min: 6, + max: 12, + message: '瀵嗙爜闀垮害鍦� 6 鍒� 12 涓瓧绗�', + trigger: 'blur' + }, + { + validator: validatePass, + trigger: 'blur' + } + ], + checkPass: [{ + validator: validatePass2, + trigger: 'blur' + }], + cellphoneORmailbox: [{ + required: true, + message: '璇疯緭鍏ラ偖绠卞湴鍧�', + trigger: 'blur' + }, + { + type: 'email', + message: '璇疯緭鍏ユ纭殑閭鍦板潃', + trigger: ['blur', 'change'] + } + ], + verifyCode: [{ + required: true, + message: '璇疯緭鍏ラ獙璇佺爜', + trigger: 'blur' + }, + { + validator: (rule, value, callback) => this.validateVerificationCode(rule, value, callback), + trigger: 'blur' + } + ] + }, + // 鐧诲綍娉ㄥ唽妗� + loginTrue: true, + Rtop1: 0, + value: 'sdfdsf', + // 娉ㄥ唽鐢ㄦ埛瀵瑰簲鐨勬暟鎹� + registerData: { + loginID: '', + pass: '', + checkPass: '', + cellphoneORmailbox: '', + verifyCode: '' + }, + // 鐧诲綍鐢ㄦ埛璐﹀彿 + loginData: { + // 璐﹀彿 + loginID: '', + pass: '' + }, + // 閲嶇疆瀵嗙爜 + resetDataPass: { + cellphoneORmailbox: '', + verifyCode: "", + newPass: "", + checkPass: "" + }, + // 淇敼瀵嗙爜 + amendDataPass: { + loginID: '', + originalPass: "", + newPass: "", + checkPass: "" + }, + // 涔︾睄鏁版嵁 + listData: [{ + name: '鍘嗕唬鍖诲浼犺搴�', + id: 1, + }, { + name: '涓栧尰鍖诲搴�', + id: 2, + }, { + name: '鍖诲瀛︽湳娴佹淳', + id: 3, + }, { + name: '涓浗鍦板煙鍖昏氨', + id: 4, + }, { + name: '涓浗鍖讳簨鍒跺害', + id: 5, + }, + + ] + } + }, + onLoad() { + uni.getSystemInfo({ + success: function(info) { + // console.log('灞忓箷鐨勫搴︼細' + info.windowWidth); + // console.log('灞忓箷鐨勯珮搴︼細' + info.windowHeight); + } + }); + }, + mounted() { + this.getElementWidth(); + }, + methods: { + // 宸叉湁璐﹀彿锛熻繑鍥炵櫥褰� + BacktoLogin() { + uni.redirectTo({ + url: '/pages/Login/Login' + }) + }, + // 鑾峰彇楠岃瘉鐮� + verifyCodeClick() { + console.log('鑾峰彇楠岃瘉鐮�'); + }, + // 鍒楄〃椤硅烦杞� + listDataClick(item) { + console.log(item); + // 鍦ㄥ綋鍓嶉〉闈㈣缃叏灞�鍙橀噺 + // uni.setStorageSync('globalData', { id: 123, name: 'example' }); + if (item.id == 1) { + uni.navigateTo({ + url: '/pages/repository/repository?id=' + item.id + }) + } else if (item.id == 2) { + console.log(item.name); + // uni.navigateTo({ + // url:'/pages/repository/repository?id='+item.id + // }) + } else if (item.id == 3) { + uni.navigateTo({ + url: '/pages/dataDisplay/dataDisplay?id=' + item.id + }) + } else if (item.id == 4) { + uni.navigateTo({ + url: '/pages/territory/territory?id=' + item.id + }) + } else if (item.id == 5) { + uni.navigateTo({ + url: '/pages/TcmSystem/TcmSystem?id=' + item.id + }) + } + }, + // 楠岃瘉鐮佹牎楠� + validateVerificationCode(rule, value, callback) { + console.log(value) + if (value !== '123456') { + callback(new Error('楠岃瘉鐮侀敊璇�')); + } else { + callback(); + } + }, + getElementWidth() { + this.$nextTick(() => { + var width = this.$refs.Rtop.$el.clientWidth; + this.Rtop1 = width + 50; + console.log('Element width:', width); + }) + }, + // 鐢ㄦ埛鐧诲綍 + Login(formName) { + console.log('鐢ㄦ埛鐧诲綍鐨勭櫥褰曟寜閽�'); + this.$refs[formName].validate((valid) => { + if (valid) { + alert('submit!鎴愬姛'); + uni.navigateTo({ + url: '/pages/Login/Login' + }) + } else { + console.log('error submit!!澶辫触'); + return false; + } + }); + }, + // 蹇樿瀵嗙爜 + Login2(formName) { + console.log('蹇樿瀵嗙爜鐨勭櫥褰曟寜閽�'); + this.$refs[formName].validate((valid) => { + if (valid) { + alert('submit!鎴愬姛'); + uni.redirectTo({ + url: '/pages/Login/Login' + }) + } else { + console.log('error submit!!澶辫触'); + return false; + } + }); + } + } + } +</script> +<style scoped> + /* + 鍦ㄥ睆骞曞搴﹁秴杩� 1440px 鏃剁殑鏍峰紡璁剧疆 */ + @media screen and (min-width: 1441px) { + ::v-deep .el-card { + top: 60% !important; + } + .BottomColumn{ + padding: .10rem 0; + } + .LoginTop{ + margin-bottom: .17rem !important; + } + .btn ::v-deep .el-button{ + margin-top: 0.1rem !important; + font-size: 0.2rem !important; + width: 100%; + padding: 0.12rem !important; + } + .LoginBg{ + height: .3rem !important; + } + .hua{ + height: 4rem !important; + }.fff{ + height: 3.5rem !important; + }.rrr{ + height: 2.5rem !important; + } + } + + .LoginBg { + width: 1.2rem; + height: .37rem; + background: url(@/static/image/閲嶇疆瀵嗙爜.png) no-repeat 0 0; + background-size: 100% 100%; + + } + + + ::v-deep .el-card { + border-radius: 0; + width: 5.42rem; + /* height: 5.65rem; */ + position: absolute; + top: 80%; + } + + ::v-deep .el-card__body { + padding: .26rem .58rem; + } + + .btn>>>.el-form-item__content { + margin-left: 0 !important; + + } + + ::v-deep .el-form-item__content { + margin-left: 0 !important; + flex: 1; + } + + ::v-deep .el-input__inner { + border: none; + border-bottom: 1px solid #2d476a; + border-radius: 0; + padding: 0; + height: .4rem; + line-height: .4rem; + } + + ::v-deep .el-form-item__error { + /* display: none; */ + } + + ::v-deep .input.invalid:focus { + border-color: #2d476a !important; + } + + ::v-deep .el-input__inner:invalid { + border-color: #2d476a !important; + } + + + ::v-deep .el-form-item__label { + min-width: .6rem; + padding: 0; + color: #244A7B; + font-size: .14rem; + font-weight: 500; + margin-right: .29rem; + } + + ::v-deep .el-form-item { + margin-bottom: .22rem; + display: flex; + } + + .ss1 { + background-repeat: no-repeat; + background-size: 100% 100%; + width: 40rpx; + height: 40rpx; + background-size: 100% 100%; + } + + .s1 { + background-image: url(@/static/image/search.png); + + } + + .s2 { + background-image: url(@/static/image/question.png); + } + + .s3 { + background-image: url(@/static/image/question.png); + } + + .container { + background: url(@/static/image/bg1.png); + width: 100vw; + height: 100vh; + + color: #fff; + + .repository { + width: 100% !important; + /* margin-top: 19px; */ + /* height: 68%; */ + display: flex; + flex-direction: column; + justify-content: space-around; + align-items: center; + + .Ttop { + margin-top: .38rem; + margin-bottom: 1.22rem; + } + + .r-top { + font-size: 40rpx !important; + margin: 10rpx 0; + } + } + + } + + .login { + width: .52rem; + height: .52rem; + display: inline-block; + vertical-align: middle; + margin-right: .19rem; + background: url(@/static/image/logo.png) no-repeat 0 0; + background-size: 100% 100%; + } + + .rrr { + position: absolute; + right: .53rem; + bottom: .36rem; + width: 2.5rem; + height: 3.07rem; + opacity: 1; + background: url(@/static/image/bg4.png); + background-size: 100% 100%; + } + + .hua { + width: 13.81rem; + height: 5.965rem; + position: absolute; + background: url(@/static/image/bg3.png) no-repeat 0 0; + background-size: 100% 100%; + } + + /* 搴曢儴浜虹墿鑳屾櫙鍥� */ + .fff { + background: url(@/static/image/bg2.png) no-repeat 0 0; + background-size: 100% 100%; + width: 2.74rem; + height: 4.52rem; + position: fixed; + bottom: 0; + z-index: 9999999999999; + left: 0; + } + + ::v-deep .uni-easyinput__content { + border-radius: 30rpx !important; + /* height: 52rpx; */ + } + + + .secretary { + width: 1300rpx !important; + height: 50rpx; + /* height: 80%; */ + /* flex-wrap: wrap; */ + padding: 0 20px; + text-align: center; + + + + + li { + background-color: #fff; + color: black; + height: 600rpx; + display: flex; + justify-content: space-between; + flex-direction: column; + align-items: center; + border: 1rpx solid #fff; + padding: 50rpx 65rpx; + /* padding: 58rpx 128rpx 88rpx; */ + text-align: center; + background: #EBF4FF; + } + } + + + + .Bbottom { + display: flex; + justify-content: center; + + } +</style> \ No newline at end of file diff --git a/pages/index/index.vue b/pages/index/index.vue index 29b6d95..87e66b8 100644 --- a/pages/index/index.vue +++ b/pages/index/index.vue @@ -1,153 +1,40 @@ <template> <view class="container flex flex-center" style="align-items: flex-start;"> - <view class="repository relative" style="margin-top: 38rpx;"> - <view class="Ttop flex flex-center flex-wrap" style="flex-direction: column;"> - <view class="r-top flex flex-center" style="width: 100%;justify-content: space-around;"> - <view class="" style="width: 5%;"></view> - <view class="" ref="Rtop"> - <!-- <uni-icons type="heart-filled" size="26" style="margin-right: 18rpx;"></uni-icons> --> - <text class="login"></text> - <text - style="font-size: 72rpx;font-weight: normal;letter-spacing: 4rpx;vertical-align: middle;font-family: cursive;font-weight: bold;">涓浗鍖诲浜虹墿鐭ヨ瘑搴�</text> + <view class="repository relative"> + <view class="flex Ttop flex-column" style="width: 100%;"> + <view class="flex" style="width: 100%;"> + <view class="" style="width: 2.5rem;"></view> + <view class=" flex flex-center flex-wrap" style="width: 100%; flex-direction: column;"> + <view class=""></view> + <view class="" ref="Rtop"> + <text class="login"></text> + <text + style="font-size: .36rem;letter-spacing: 4rpx;vertical-align: middle;font-family: cursive;font-weight: bold;">涓浗鍖诲浜虹墿鐭ヨ瘑搴�</text> + </view> </view> - <view class="flex" > - <view v-if="!loginTrue" v-for="item in 3" :key="item" :class="'s'+item" class="ss1" style="margin: 0 10rpx;"> + <view class="flex" style="height: .5rem;"> + <view @click="iconClick(item)" v-for="item in 3" :key="item" :class="'s'+item" class="ss1" style="margin-right: .3rem;"> </view> </view> </view> - <view v-if="!loginTrue" class="rbottom " :style="{width:Rtop1+'px'}"> - <uni-easyinput class="search1 uni-mt-12" suffixIcon="search" v-model="value" placeholder="鎸夌収濮撳悕鎼滅储" - @iconClick="iconClick"></uni-easyinput> + + <!-- 楂樼骇鎼滅储 --> + <view v-if="isSearchTrue" style="margin: .35rem 0 .16rem 0; height: .52rem;"> + <advancedSearch @onSearch="onSearch" :isAvancedTrue="false" :isSearchTrue="false" /> </view> </view> - <view class="Bbottom relative"> + <view class="Bbottom "> <!-- 閫夐」鍗� --> - <ul v-if="!loginTrue" class="secretary flex relative"> - <li v-for="(item,index) in listData" :key="item"> + <ul class="secretary flex "> + <li @click="listDataClick(item)" v-for="(item,index) in listData" :key="index"> <span class="font-family" - style="font-weight: 700;color: #2C2C2C; width: 36px;display: inline-block; font-size: 45rpx;overflow: hidden;height: 80%;line-height: 1.5;">{{item.name}}</span> + style="font-weight: 700;color: #2C2C2C; width: 36px;display: inline-block; font-size: .32rem;overflow: hidden;height: 80%;line-height: 1.5;">{{item.name}}</span> <view class="flex flex-content" - style="width: 80rpx;height: 80rpx;border-radius: 50%;background-color: #244A7B;"> + style="width: .5rem;height: .5rem;border-radius: 50%;background-color: #244A7B;"> <image style="width: 40%;height: 20%;" src="@/static/image/eResize.png" mode=""></image> - </view> + </view> </li> </ul> - <!-- 娉ㄥ唽鐢ㄦ埛 v-if="isRegister"--> - <el-card v-if="isRegister" style="position: absolute;top: -500rpx;padding: 30rpx;width: 900rpx;" > - <view class="" style="display: flex; justify-content: space-between;"> - <h2 style="color: #244a7b;padding-bottom: 20rpx;">鐢ㄦ埛娉ㄥ唽</h2> - <view class="" @click="isRegister= !isRegister,isLogin=!isLogin" style="cursor: pointer;font-size: 20rpx;color: #244a7b;"> - 宸叉湁璐﹀彿锛熻繑鍥炵櫥褰� - </view> - </view> - <el-form :hide-required-asterisk="true" ref="formLogin" label-position="left" :rules="rules" - label-width="80px" :model="registerData"> - <el-form-item label="鐧诲綍璐﹀彿" prop="loginID"> - <el-input v-model="registerData.loginID"></el-input> - </el-form-item> - <el-form-item label="鐧诲綍瀵嗙爜" prop="pass"> - <el-input type="password" v-model="registerData.pass"></el-input> - </el-form-item> - <el-form-item label="纭瀵嗙爜" prop="checkPass"> - <el-input type="password" v-model="registerData.checkPass"></el-input> - </el-form-item> - <el-form-item label="鎵嬫満/閭" prop="cellphoneORmailbox"> - <el-input v-model="registerData.cellphoneORmailbox"></el-input> - </el-form-item> - <el-form-item label="楠岃瘉鐮�" prop="verifyCode"> - <el-input v-model="registerData.verifyCode"></el-input> - </el-form-item> - <el-form-item class="btn"> - <el-button class="font-family" - style="margin-top: 30rpx; font-weight:900;font-size: 30rpx; width: 100%;background-color: #244a7b;color: #fff;padding: 30rpx;" - size="medium" @click="Login1('formLogin')">鐧诲綍</el-button> - </el-form-item> - <view class="" - style="font-size: 17rpx;color: #9E9E9E;text-align: center;line-height: 1;margin-bottom: 20rpx;"> - 鐢ㄦ埛娉ㄥ唽鍗充唬琛ㄥ悓鎰忋�婃湇鍔℃潯娆俱�嬪拰銆婄敤鎴烽殣绉佷繚鎶ゅ拰涓汉淇℃伅鏉℃銆�</view> - </el-form> - </el-card> - <!-- 鐢ㄦ埛鐧诲綍 v-if="isLogin"--> - <el-card v-if="isLogin" style="position: absolute;top: -500rpx;padding: 30rpx;width: 900rpx;"> - <view class="" style="display: flex; justify-content: space-between;"> - <h2 style="color: #244a7b;padding-bottom: 20rpx;">鐢ㄦ埛鐧诲綍</h2> - <view class=""> </view> - </view> - <el-form :hide-required-asterisk="true" ref="formLogin1" label-position="top" label-width="80px" :rules="rules1" - :model="loginData"> - <el-form-item label="鐧诲綍璐﹀彿" prop="loginID"> - <el-input v-model="loginData.loginID"></el-input> - </el-form-item> - <el-form-item label="鐧诲綍瀵嗙爜" prop="pass"> - <el-input v-model="loginData.pass"></el-input> - </el-form-item> - <el-form-item class="btn"> - <el-button class="font-family" - style="margin-top: 30rpx; font-weight:900;font-size: 30rpx; width: 100%;background-color: #244a7b;color: #fff;padding: 30rpx;" - size="medium" @click="Login('formLogin1')">鐧诲綍</el-button> - </el-form-item> - <view class="" style="display: flex;font-size: 20rpx;"> - <view class="" style="display: inline-block;cursor: pointer;" @click="forgetPass">蹇樿瀵嗙爜 - </view> - <view class="" style="display: inline-block;margin: 0 20rpx;"> | </view> - <view class="" style="display: inline-block;cursor: pointer;" @click="quickRegister">蹇�熸敞鍐� - </view> - </view> - </el-form> - </el-card> - <!-- 閲嶇疆瀵嗙爜 --> - <el-card v-if="isResetPass" style="position: absolute;top: -500rpx;padding: 30rpx;width: 900rpx;"> - <view class="" style="display: flex; justify-content: space-between;"> - <h2 style="color: #244a7b;padding-bottom: 20rpx;">閲嶇疆瀵嗙爜 </h2> - <view class=""> </view> - </view> - <el-form :hide-required-asterisk="true" ref="formLogin2" label-position="left" label-width="80px" :rules="rules" - :model="resetDataPass"> - <el-form-item label="鎵嬫満/閭" prop="cellphoneORmailbox"> - <el-input v-model="resetDataPass.cellphoneORmailbox"></el-input> - </el-form-item> - <el-form-item label="楠岃瘉鐮�" prop="verifyCode"> - <el-input v-model="resetDataPass.verifyCode"></el-input> - </el-form-item> - <el-form-item label="鏂板瘑鐮�" prop="pass"> - <el-input v-model="resetDataPass.newPass"></el-input> - </el-form-item> - <el-form-item label="纭瀵嗙爜" prop="checkPass"> - <el-input v-model="resetDataPass.checkPass"></el-input> - </el-form-item> - <el-form-item class="btn"> - <el-button class="font-family" - style="margin-top: 30rpx; font-weight:900;font-size: 30rpx; width: 100%;background-color: #244a7b;color: #fff;padding: 30rpx;" - size="medium" @click="Login2('formLogin2')">纭畾</el-button> - </el-form-item> - </el-form> - </el-card> - <!-- 淇敼瀵嗙爜 --> - <!-- <el-card style="position: absolute;top: -500rpx;padding: 30rpx;width: 900rpx;"> - <view class="" style="display: flex; justify-content: space-between;"> - <h2 style="color: #244a7b;padding-bottom: 20rpx;">淇敼瀵嗙爜 </h2> - <view class="" > </view> - </view> - <el-form :hide-required-asterisk="true" ref="formLogin" label-position="left" label-width="80px" :rules="rules" :model="amendDataPass"> - <el-form-item label="鐧诲綍璐﹀彿" prop="loginID"> - <el-input v-model="amendDataPass.loginID"></el-input> - </el-form-item> - <el-form-item label="鍘熷瘑鐮�" prop="pass"> - <el-input v-model="amendDataPass.originalPass"></el-input> - </el-form-item> - <el-form-item label="鏂板瘑鐮�" prop="pass"> - <el-input v-model="amendDataPass.newPass"></el-input> - </el-form-item> - <el-form-item label="纭鏂板瘑鐮�" prop="checkPass"> - <el-input v-model="amendDataPass.checkPass"></el-input> - </el-form-item> - <el-form-item class="btn"> - <el-button class="font-family" - style="margin-top: 30rpx; font-weight:900;font-size: 30rpx; width: 100%;background-color: #244a7b;color: #fff;padding: 30rpx;" - size="medium" @click="Login('formLogin')">纭畾</el-button> - </el-form-item> - </el-form> - </el-card> --> </view> </view> <view class="hua"></view> @@ -155,18 +42,8 @@ <view class="fff"></view> <!-- 搴曢儴鑺辩殑鑳屾櫙鍥惧彸渚� --> <view class="rrr"></view> - <view class="BottomColumn flex flex-center"> - <view class="Bbar flex"> - <img style="display: block;margin-right: 20rpx;" src="@/static/image/logo.png" alt="" srcset="" /> - <view class="font-family"> - <view class=""> - 92017涓浗涓尰绉戝闄腑鍖昏嵂淇℃伅鐮旂┒鎵�鐗堟潈鎵�鏈変含ICP澶囦笟鏂瑰畨澶т笟鏂逛笟鏂� - </view> - <view class="">鍦板潃:鍖椾含甯備笢鍩庡尯涓滅洿闂ㄥ唴鍗楀皬琛�16鍙烽偖缂�:100700 - 鐢佃瘽:8610-64089611Email:tcmbase@126.com</view> - </view> - </view> - </view> + + <Footer1 /> </view> </template> @@ -174,109 +51,14 @@ import { nextTick } from "vue"; + import Footer1 from '@/components/footer/footer.vue' export default { - data() { - // 瀵嗙爜 - var validatePass = (rule, value, callback) => { - if (value === '') { - callback(new Error('璇疯緭鍏ュ瘑鐮�')); - } else { - if (this.registerData.checkPass !== '') { - this.$nextTick(() => { - this.$refs.formLogin.validateField('checkPass'); - }); - } - callback(); - } - }; - // 纭瀵嗙爜 - var validatePass2 = (rule, value, callback) => { - if (value === '') { - callback(new Error('璇峰啀娆¤緭鍏ュ瘑鐮�')); - } else if (value !== this.registerData.pass) { - callback(new Error('涓ゆ杈撳叆瀵嗙爜涓嶄竴鑷�!')); - } else { - callback(); - } - }; - return { - // 鐢ㄦ埛娉ㄥ唽 - isRegister: false, - // 鐢ㄦ埛鐧诲綍 - isLogin: true, - // 淇敼瀵嗙爜 - isAmendPass: false, - // 閲嶇疆瀵嗙爜 - isResetPass: false, - // 娉ㄥ唽鐢ㄦ埛璐﹀彿鐨勬牎楠� - rules: { - loginID: [{ - required: true, - message: '璇疯緭鍏ョ櫥褰曡处鍙�', - trigger: 'blur' - }], - pass: [{ - required: true, - message: '璇疯緭鍏ュ瘑鐮�', - trigger: 'blur' - }, - { - min: 6, - max: 12, - message: '瀵嗙爜闀垮害鍦� 6 鍒� 12 涓瓧绗�', - trigger: 'blur' - }, - { - validator: validatePass, - trigger: 'blur' - } - ], - checkPass: [{ - validator: validatePass2, - trigger: 'blur' - }], - cellphoneORmailbox: [{ - required: true, - message: '璇疯緭鍏ラ偖绠卞湴鍧�', - trigger: 'blur' - }, - { - type: 'email', - message: '璇疯緭鍏ユ纭殑閭鍦板潃', - trigger: ['blur', 'change'] - } - ], - verifyCode: [{ - required: true, - message: '璇疯緭鍏ラ獙璇佺爜', - trigger: 'blur' - }, - { - validator: (rule, value, callback) => this.validateVerificationCode(rule, value, callback), - trigger: 'blur' - } - ] - }, - rules1: { - loginID: [{ - required: true, - message: '璇疯緭鍏ョ櫥褰曡处鍙�', - trigger: 'blur' - }], - pass: [{ - required: true, - message: '璇疯緭鍏ュ瘑鐮�', - trigger: 'blur' - }, - { - min: 6, - max: 12, - message: '瀵嗙爜闀垮害鍦� 6 鍒� 12 涓瓧绗�', - trigger: 'blur' - } - ], - }, - + components: { + Footer1 + }, + data() {return { + // 鎼滅储鐨勬樉绀� + isSearchTrue:true, // 鐧诲綍娉ㄥ唽妗� loginTrue: true, Rtop1: 0, @@ -342,18 +124,42 @@ this.getElementWidth(); }, methods: { - // 蹇樿瀵嗙爜 - forgetPass() { - this.isLogin = !this.isLogin - this.isResetPass = !this.isResetPass - console.log('蹇樿瀵嗙爜'); + onSearch(val){ + uni.navigateTo({ + url:'/pages/knowledgeBase/knowledgeBase?name='+val + }) + console.log('vv',val); }, - // 蹇�熸敞鍐� - quickRegister() { - this.isLogin = !this.isLogin - this.isRegister = !this.isRegister - console.log('蹇�熸敞鍐�'); + // 鍒楄〃椤硅烦杞� + listDataClick(item) { + console.log(item); + // 鍦ㄥ綋鍓嶉〉闈㈣缃叏灞�鍙橀噺 + // uni.setStorageSync('globalData', { id: 123, name: 'example' }); + if (item.id == 1) { + uni.navigateTo({ + url: '/pages/repository/repository?id=' + item.id + }) + } else if (item.id == 2) { + console.log(item.name); + // uni.navigateTo({ + // url:'/pages/repository/repository?id='+item.id + // }) + } else if (item.id == 3) { + uni.navigateTo({ + url: '/pages/dataDisplay/dataDisplay?id=' + item.id + }) + } else if (item.id == 4) { + uni.navigateTo({ + url: '/pages/territory/territory?id=' + item.id + }) + } else if (item.id == 5) { + uni.navigateTo({ + url: '/pages/TcmSystem/TcmSystem?id=' + item.id + }) + } + }, + // 楠岃瘉鐮佹牎楠� validateVerificationCode(rule, value, callback) { if (value !== '123456') { @@ -370,49 +176,64 @@ console.log('Element width:', width); }) }, - // 鐢ㄦ埛鐧诲綍 - Login(formName) { - console.log('鐢ㄦ埛鐧诲綍鐨勭櫥褰曟寜閽�'); - this.isLogin=!this.isLogin - this.loginTrue=!this.loginTrue - this.$refs[formName].validate((valid) => { - if (valid) { - alert('submit!鎴愬姛'); - } else { - console.log('error submit!!澶辫触'); - return false; - } - }); - }, - // 鐢ㄦ埛娉ㄥ唽 - Login1(formName) { - console.log('鐢ㄦ埛娉ㄥ唽鐨勭櫥褰曟寜閽�'); - this.$refs[formName].validate((valid) => { - if (valid) { - alert('submit!鎴愬姛'); - } else { - console.log('error submit!!澶辫触'); - return false; - } - }); - }, - // 蹇樿瀵嗙爜 - Login2(formName) { - console.log('蹇樿瀵嗙爜鐨勭櫥褰曟寜閽�'); - this.$refs[formName].validate((valid) => { - if (valid) { - alert('submit!鎴愬姛'); - } else { - console.log('error submit!!澶辫触'); - return false; - } - }); + iconClick(index){ + console.log(index); + // 鎼滅储鐨勬樉绀� + if(index==1){ + this.isSearchTrue = !this.isSearchTrue + } } } } </script> <style scoped> + /* + 鍦ㄥ睆骞曞搴﹁秴杩� 1440px 鏃剁殑鏍峰紡璁剧疆 */ + @media screen and (min-width: 1441px) { + ::v-deep .el-card { + top: 60% !important; + } + + .BottomColumn { + padding: .10rem 0; + } + .Ttop{ + margin-bottom: .6rem !important; + } + .secretary{ + li{ + height: 4.5rem !important; + } + } + .LoginTop { + margin-bottom: .17rem !important; + } + + .btn ::v-deep .el-button { + margin-top: 0.1rem !important; + font-size: 0.2rem !important; + width: 100%; + padding: 0.12rem !important; + } + + .LoginBg { + height: .3rem !important; + } + + .hua { + height: 4rem !important; + } + + .fff { + height: 3.5rem !important; + } + + .rrr { + height: 2.5rem !important; + } + } + .btn>>>.el-form-item__content { margin-left: 0 !important; } @@ -454,22 +275,23 @@ .ss1 { background-repeat: no-repeat; background-size: 100% 100%; - width: 40rpx; - height: 40rpx; + width: .34rem; + height: .34rem; background-size: 100% 100%; } .s1 { - background-image: url(@/static/image/search.png); + background-image: url(@/static/image/search.svg); } .s2 { - background-image: url(@/static/image/question.png); + background-image: url(@/static/image/profile.svg); } .s3 { - background-image: url(@/static/image/question.png); + background-image: url(@/static/image/quote.svg); + margin-right: .59rem !important; } .container { @@ -481,15 +303,16 @@ .repository { width: 100% !important; - margin-top: 19px; - height: 68%; + /* margin-top: 19px; */ + /* height: 68%; */ display: flex; flex-direction: column; justify-content: space-around; + align-items: center; .Ttop { - /* width: 500rpx; */ - margin: -100px 0 40px 0; + margin-top: .38rem; + margin-bottom: 1.22rem; } .r-top { @@ -512,18 +335,18 @@ .rrr { position: absolute; - right: 180rpx; - bottom: 120.5rpx; - width: 255rpx; - height: 350.5rpx; + right: .53rem; + bottom: .36rem; + width: 2.5rem; + height: 3.07rem; opacity: 1; background: url(@/static/image/bg4.png); background-size: 100% 100%; } .hua { - width: 95%; - height: 60%; + width: 13.81rem; + height: 5.965rem; position: absolute; background: url(@/static/image/bg3.png) no-repeat 0 0; background-size: 100% 100%; @@ -533,10 +356,10 @@ .fff { background: url(@/static/image/bg2.png) no-repeat 0 0; background-size: 100% 100%; - width: 400rpx; - height: 600rpx; + width: 2.74rem; + height: 4.52rem; position: fixed; - bottom: 130rpx; + bottom: 0; z-index: 9999999999999; left: 0; } @@ -548,54 +371,34 @@ .secretary { - width: 1300rpx !important; - height: 50rpx; + /* width: 1300rpx !important; */ + /* height: 50rpx; */ /* height: 80%; */ /* flex-wrap: wrap; */ padding: 0 20px; text-align: center; - - - li { background-color: #fff; color: black; - height: 600rpx; + width: 1.6rem; + height: 4.8rem; display: flex; - justify-content: space-between; + justify-content: center; flex-direction: column; align-items: center; - border: 1rpx solid #fff; - padding: 50rpx 65rpx; - /* padding: 58rpx 128rpx 88rpx; */ text-align: center; background: #EBF4FF; + font-weight: 600; + margin: 0 .21rem; } } - .BottomColumn { - position: fixed; - left: 0px; - bottom: 0px; - padding: 20rpx 0; - width: 100%; - background-color: #e6eff8; - font-size: 10px; - color: #000; - .Bbar { - img { - width: 60rpx; - height: 60rpx; - border-radius: 50%; - } - } - } - .Bbottom { + /* .Bbottom { display: flex; justify-content: center; - - } + + } */ </style> \ No newline at end of file diff --git a/pages/knowledgeBase/knowledgeBase.vue b/pages/knowledgeBase/knowledgeBase.vue index 845fb0d..959e3e1 100644 --- a/pages/knowledgeBase/knowledgeBase.vue +++ b/pages/knowledgeBase/knowledgeBase.vue @@ -3,48 +3,184 @@ <!-- 椤堕儴 --> <headNav /> <!-- 鎼滅储 --> - <view class="" style="margin: 20rpx 0;"> + <view class="flex flex-center" style="margin: 20rpx 0;"> <luanqing-search class="search_bar" @onSearch="onSearch"></luanqing-search> + <view class="" @click="isAvancedClick" + style="color:#244A7B ;font-size: 20rpx;margin-left: 60rpx;cursor: pointer;">楂樼骇鎼滅储 锕�</view> </view> - <view class="flex flex-center"> + <!-- 鐑棬鎼滅储 --> + <view class="flex flex-center" style="font-size: 20rpx;margin: 10rpx 0;"> 鐑棬鎼滅储锛� <ul class="flex" style="margin-right: 10rpx;"> - <li v-for="item in hot" :key="item.id" @tap="HotClick(item.id)" style="margin: 0 10rpx;" - :style="{color:item.bgColor==true?'#5879a4':'#000'}"> + <!-- + <li v-for="item in hot" :key="item.id" @tap="HotClick(item.id)" style="margin: 0 10rpx;" + :style="{color:item.bgColor==true?'#5879a4':'#000'}"> + {{item.name}} + </li>--> + <li v-for="item in hot" :key="item.id" style="margin: 0 10rpx;color: #5879a4;font-size: 20rpx;"> {{item.name}} </li> </ul> </view> - <uni-row class="demo-uni-row" style="padding: 0 30rpx; "> - <uni-col :span="5" > - <view class="demo-uni-col dark" style="padding: 20rpx;border: 2px solid #e0e0e0;"> - <h3 style="padding-left: 20rpx;">{{profession.title}}</h3> - <ul style="margin-top: 10rpx;"> + <!-- 楂樼骇鎼滅储 --> + <view class="" v-if="isAdvancedSearch" style="padding: 0 230rpx; margin-bottom: 10rpx;"> + <view style="background-color: #fff;padding: 20rpx;" class=""> + <h3>楂樼骇鎼滅储</h3> + <MyForm @submit="onSubmit" :from="from" /> + </view> + </view> + <uni-row class="demo-uni-row flex flex-items-start" style="padding: 0 230rpx; "> + <uni-col :span="5" class="fbox"> + <!-- 鑱屼笟 --> + <view class="demo-uni-col dark box" + style="margin-bottom: 40rpx;background-color: #fff; padding: 20rpx;border: 2rpx solid #e0e0e0;"> + <h3>{{profession.title}}</h3> + <ul style="margin-top: 10rpx;" :class="{ 'a': activeBox === 'a'?'a':'' }"> <!-- background-color: #d6e3f4;border-radius: 60rpx; --> - <li class="flex" :style="{'background':profession.index === index ? '#d6e3f4' :'','borderRadius': profession.index === index ? '60rpx' :''}" v-for="(item,index) in profession.list" :key="index" style="padding:0 20rpx;"> + <li class="flex" + :style="{'background':profession.index === index ? '#d6e3f4' :'','borderRadius': profession.index === index ? '60rpx' :''}" + v-for="(item,index) in profession.list" :key="index" style="padding:0 20rpx;"> <view class="">{{item.name}}</view> <view class="">{{item.number}}</view> </li> </ul> <view class="flex flex-center"> - <view class="" style="font-size: 25rpx;color: #C1D3EA;">鏀惰捣 ^</view> - <!-- <view class="">鏇村</view> --> + <view class="toggleButton" style="font-size: 25rpx;color: #C1D3EA;" @click="shrinkClick('a')"> + {{ activeBox !== 'a' ? '鏇村 锕�' : '鏀惰捣 锔�' }} + </view> </view> </view> + <!-- 涓栦唬 --> + <view class="demo-uni-col dark box" + style="background-color: #fff;padding: 20rpx;border: 2rpx solid #e0e0e0;" :style="{'marginBottom': isAdvancedSearch ===true ? '0': '40rpx'}"> + <h3>{{dynasty.title}}</h3> + <ul style="margin-top: 10rpx;" :class="{ 'b': activeBox === 'b'?'b':'' }"> + <!-- background-color: #d6e3f4;border-radius: 60rpx; --> + <li class="flex" + :style="{'background':dynasty.index === index ? '#d6e3f4' :'','borderRadius': dynasty.index === index ? '60rpx' :''}" + v-for="(item,index) in dynasty.list" :key="index" style="padding:0 20rpx;"> + <view class="">{{item.name}}</view> + <view class="">{{item.number}}</view> + </li> + </ul> + <view class="flex flex-center"> + <view class="toggleButton" style="font-size: 25rpx;color: #C1D3EA;" @click="shrinkClick('b')"> + {{ activeBox !== 'b' ? '鏇村 锕�' : '鏀惰捣 锔�' }} + </view> + </view> + </view> + <!-- 鏉ユ簮 --> + <view v-if="!isAdvancedSearch" class="demo-uni-col dark box" + style="height: 250rpx;background-color: #fff;padding: 20rpx;border: 2rpx solid #e0e0e0;"> + <h3>{{source.title}}</h3> + <ul style="margin-top: 10rpx;" :class="{ 'b': activeBox === 'b'?'b':'' }"> + <!-- background-color: #d6e3f4;border-radius: 60rpx; --> + <li class="flex" v-for="(item,index) in source.list" :key="index" + style="padding:0 20rpx;color: #244A7B;font-size: 24rpx;"> + <view class="">{{ index+1 + '. ' +item.name}}</view> + <view class="">{{item.number}}</view> + </li> + </ul> + <!-- <view class="flex flex-center"> + <view class="toggleButton" style="font-size: 25rpx;color: #C1D3EA;" @click="shrinkClick('b')"> + {{ activeBox !== 'b' ? '鏇村 锕�' : '鏀惰捣 锔�' }}</view> + </view> --> + </view> </uni-col> - <uni-col :span="19" style="padding-left: 20rpx;"> - <view class="demo-uni-col light" style="border: 1px solid #000;"> - bbb + <uni-col :span="19" style="padding-left: 20rpx; "> + <view class="demo-uni-col light fbox1" + style=" background-color: #fff;border: 1px solid #e0e0e0;padding: 10rpx 20rpx;"> + <view class="flex" style="margin:10rpx 0"> + <view class="" style="color: #2C2C2C;">鍏�1374鏉�</view> + <el-button size="mini">涓嬭浇</el-button> + </view> + <el-table :data="tableData" size="mini" style="width: 100%"> + <el-table-column prop="serialNumber" label="搴忓彿" width="70"></el-table-column> + <el-table-column prop="name" label="濮撳悕"></el-table-column> + <el-table-column prop="another" label="鍒悕"></el-table-column> + <el-table-column prop="gender" label="鎬у埆"></el-table-column> + <el-table-column prop="epoch" label="鏃朵唬"></el-table-column> + <el-table-column prop="year" label="鐢熷勾" width="70"></el-table-column> + <el-table-column prop="death" label="鍗掑勾" width="70"></el-table-column> + <el-table-column prop="nativePlace" label="绫嶈疮"></el-table-column> + <el-table-column prop="socialIdentity" label="绀句細韬唤"></el-table-column> + <el-table-column prop="officialPosition" label="瀹樿亴"></el-table-column> + </el-table> </view> </uni-col> </uni-row> + <Footer1 /> </view> </template> <script> + import Footer1 from '@/components/footer/footer' + import MyForm from '@/components/form/form.vue' export default { + components: { + Footer1, + MyForm + }, data() { return { + // 楂樼骇鎼滅储鏄剧ず + isAdvancedSearch: false, + // 楂樼骇鎼滅储 + from: { + from: [{ + type: 'input', + label: '濮撳悕', + name: 'name', + value: '' + }, + { + type: 'select', + label: '鎬у埆', + value: '', + name: 'sex', + options: [{ + label: '鐢�', + value: '鐢�' + }, + { + label: '濂�', + value: '濂�' + } + ] + }, + { + type: 'input', + label: '鑱旂郴', + name: 'phone', + value: '' + }, + { + type: 'input', + label: '璇佷欢', + name: 'idNumber', + value: '' + }, + { + type: 'select', + label: '鐘舵��', + name: 'state', + value: '', + options: [{ + label: '鏈敵璇�', + value: '鏈敵璇�' + }, + { + label: '宸茬敵璇�', + value: '宸茬敵璇�' + }, + { + label: '宸插垹闄�', + value: '宸插垹闄�' + } + ] + } + ] + }, // 鐑棬鎼滅储 hot: [{ id: 1, @@ -60,34 +196,129 @@ bgColor: false }, ], // 鑱屼笟 - profession: { title: '鑱屼笟', - index:0, + index: 0, list: [{ name: '鍏ㄩ儴', id: 1, - number:829 + number: 829 }, { name: '鍖诲', id: 2, - number:90 + number: 90 }, { name: '涓栧尰', id: 3, - number:81 + number: 81 }, { name: '瀹环鍖�', id: 4, - number:83 + number: 83 }, ] - } + }, + // 灞曞紑鍜屾敹缂╃殑鎸夐挳闇�瑕� + activeBox: null, + // 涓栦唬 + dynasty: { + title: '涓栦唬', + index: 0, + list: [{ + name: '鍏ㄩ儴', + id: 1, + number: 829 + }, + { + name: '鍞�', + id: 2, + number: 90 + }, { + name: '瀹�', + id: 3, + number: 81 + }, { + name: '鍏�', + id: 4, + number: 83 + }, + ] + }, + // 鏉ユ簮 + source: { + title: '鏉ユ簮', + list: [{ + name: '涓浗K灏忓埗搴旇枦鍏�', + id: 1 + }, { + name: '涓尰鍖讳簨澶т細', + id: 2 + }, { + name: '涓浗鍖讳腑鍒跺害鐮旂┒', + id: 3 + }, ] + }, + tableData: [{ + serialNumber: 1, + name: '鐜嬪皬铏�', + another: '灏忚檸', + gender: '鐢�', + epoch: '鍞愪唬', + year: 1234, + death: 1332, + nativePlace: '娌冲寳', + socialIdentity: '涓栧尰', + officialPosition: '闄㈠垽' + }, { + serialNumber: 2, + name: '鐜媤灏忚檸', + another: 'w灏忚檸', + gender: 'w鐢�', + epoch: '鍞恮浠�', + year: 1234, + death: 1332, + nativePlace: '娌冲寳', + socialIdentity: '涓栧尰', + officialPosition: '闄㈠垽' + }, { + serialNumber: 1, + name: '鐜嬪皬铏�', + another: '灏忚檸', + gender: '鐢�', + epoch: '鍞愪唬', + year: 1234, + death: 1332, + nativePlace: '娌冲寳', + socialIdentity: '涓栧尰', + officialPosition: '闄㈠垽' + }] } }, + mounted() { + // 淇敼涓ゆ鐨勯珮搴︿繚鎸佷竴鑷� + var box1Height = document.querySelector('.fbox').offsetHeight; + document.querySelector('.fbox1').style.height = box1Height + 'px'; + }, methods: { + isAvancedClick() { + this.isAdvancedSearch = !this.isAdvancedSearch + this.$nextTick(() => { + + var box1Height = document.querySelector('.fbox').offsetHeight; + // let box2Height= document.querySelector('.fbox1').style.height = box1Height + 'px'; + let box2Height = document.querySelector('.fbox1').offsetHeight + console.log(box1Height, box2Height); + if (box1Height <= box2Height) { + document.querySelector('.fbox1').style.height = box1Height + 'px'; + } + }) + }, + onSubmit(val) { + console.log(val); + }, onSearch(val) { + console.log(val); }, // 鐑棬鎼滅储 @@ -103,6 +334,15 @@ }) }, + // 灞曞紑鏀剁缉 + shrinkClick(box) { + console.log(box); + if (this.activeBox === box) { + this.activeBox = null; + } else { + this.activeBox = box; + } + } } } </script> @@ -111,4 +351,29 @@ * { box-sizing: border-box; } + + .a { + height: 200px; + } + + .b { + height: 100px; + } + + .box { + transition: height 0.3s; + /* 娣诲姞杩囨浮鏁堟灉 */ + overflow: hidden; + /* 閬垮厤鍐呭婧㈠嚭 */ + + } + + ::v-deep .el-table th, + ::v-deep .el-table td { + text-align: center; + } + + ::v-deep .has-gutter tr>th { + background-color: #DDE8F6 !important; + } </style> \ No newline at end of file diff --git a/pages/repository/repository.vue b/pages/repository/repository.vue index 981d6ee..8ec7fa5 100644 --- a/pages/repository/repository.vue +++ b/pages/repository/repository.vue @@ -1,66 +1,98 @@ <template> - <view> - <view class="NavTop flex"> - <view class=""><img src="../../static/涓尰浜虹墿鐭ヨ瘑搴�0201/涓夋潯鏉�.png" alt="" /></view> - <view class="">涓尰鍖诲浜虹墿鐭ヨ瘑搴�</view> - <view class="NavTopr"> - <img src="../../static/涓尰浜虹墿鐭ヨ瘑搴�0201/涓夋潯鏉�.png" alt="" /> - <img src="../../static/涓尰浜虹墿鐭ヨ瘑搴�0201/涓夋潯鏉�.png" alt="" /> - <img src="../../static/涓尰浜虹墿鐭ヨ瘑搴�0201/涓夋潯鏉�.png" alt="" /> - </view> - </view> - <view class="mImage"> - <img src="https://img0.baidu.com/it/u=3838093562,4126749835&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1710522000&t=a986064700deada5ec74d05e02abd8b5" - alt="" /> - </view> + <view class="relative"> + <headNav /> <view class="Midde flex"> - <view class="MiddeBack">杩斿洖</view> + <el-button class="MiddeBack" size="mini" @click="goBack">杩斿洖</el-button> <view style="width: 70%;" class="flex flex-center flex-column"> - <view class="" style="font-weight: 900;margin-bottom:15rpx ;font-size: 30rpx;">鏉庢椂鐝�</view> - <ul class="flex" style="line-height: 1.2;"> - <li v-for="item in 3" - style="font-size: 20rpx; background-color: #fff;color: #415c7a; border: 2rpx solid #415c7a;border-radius: 30rpx;padding: 0 15rpx;margin-right: 10rpx;"> - ssdf</li> + <view class="" style="font-weight: bold;font-size: .20rem;">鏉庢椂鐝�</view> + <ul class="flex" style="line-height: 1.2;margin: .15rem 0 ;"> + <li v-for="item in 4" + style="background-color: #fff; padding: 0 .08rem ; border: .01rem solid #000;border-radius:.1rem ;font-size: .12rem;text-align: center;margin-right: .15rem;"> + VSDS</li> </ul> - <view class="fz" style="font-size: 20rpx;margin: 20rpx 0;"> - 浜椂鐝�(1518骞�-1593骞�)锛屽瓧:涓滈泤锛屾椂浜鸿皳涔�:浜笢鑴戙�傚彿娓愭箹锛屾櫄骞磋嚜鍙锋箹婀栧北浜猴紝婀栧寳鏂板窞(浠婃箹鍖楃渷榛勫唸甯傛柊鏄ュ幙閰卞窞闀�)浜猴紝姹夋棌锛岀敓骞叉槑姝﹀畻姝e痉鍗佷笁骞�(鍏厓1518骞�)锛屽崚浜庣宕囦竾鍘嗕簩鍗佷簩骞�(鍏厓1593骞�)銆傛槸涓浗鏄庝唬涓庝竾瀵嗗晢榻愬悕鐨勫尰瀛﹀銆佽嵂鐗╁瀹躲�佸崥鐗╁瀹躲�佽憲杩板銆傛潕鏃剁弽瀵归亾瀹跺尰瀛︾殑楂旀壙鏄鏂归潰鐨勶紝鏇惧弬鑰冨巻浠f湁鍏冲尰鑽強鍏跺鏈功绫嶅叓鐧句綑绉嶏紝缁撳悎鑷韩缁忛獙鍜岃皟鏌ョ爺绌讹紝鍘嗘椂27骞寸紪鎴愩�婃湰鑽夌綉鐩�嬩竴涔︼紝鏄垜鍥藉彜浠h嵂鐗╁鐨勬�荤粨鎬у法鑻︼紝鍦ㄥ浗鍐呭鍧囨湁寰堥珮鐨勮瘎浠凤紝宸叉湁鍎跨鏂囧瓧鐨勮瘧鏈垨鑺傝瘧鏈紝鍏惰嫢鏈夈�婃繏鑴夊銆� + <view class="fz font-family" + style="font-size: .13rem;font-weight: normal;line-height: .2rem;letter-spacing: .03rem;"> + 鏉庢椂鐝�(1518骞�-1593骞�)锛屽瓧: + 涓滅挧锛屾椂浜鸿皳涔�:鏉庝笢鐠с�傚彿婵掓箹锛屾櫄骞磋嚜鍙锋繏婀栧北浜猴紝婀栧寳钖窞(浠婃箹鍖楃渷榛勫唸甯傝柂鏄ュ幙钖窞闀�)浜猴紝姹夋棌锛岀敓浜庢槑姝﹀畻姝e痉鍗佷笁骞�(鍏厓1518骞�)锛屽崚浜庣瀹椾竾鍘嗕簩鍗佷簩骞�(鍏厓1593骞�)銆傛槸涓浗鏄庝唬涓庝竾瀵嗘枊榻愬悕鐨勫尰瀛﹀銆佽嵂鐗╁瀹躲�佸崥鐗╁瀹躲�佽憲杩板銆傛潕鏃剁弽瀵归亾瀹跺尰瀛︾殑缁ф壙鏄鏂归潰鐨勶紝鏇惧弬鑰冨巻浠f湁鍏冲尰鑽強鍏跺鏈功绫嶅叓鐧句綑绉嶏紝缁撳悎鑷韩缁忛獙鍜岃皟鏌ョ爺绌讹紝鍘嗘椂27骞寸紪鎴愩�婃湰鑽夌翰鐩�嬩竴涔︼紝鏄垜鍥藉彜浠h嵂鐗╁鐨勬�荤粨鎬у法钁楋紝鍦ㄥ浗鍐呭鍧囨湁寰堥珮鐨勮瘎浠凤紝宸叉湁鍑犵鏂囧瓧鐨勮瘧鏈垨鑺傝瘧鏈紝鍏惰憲鏈夈�婃繏婀栬剦瀛︺�� </view> - <view class="flex" style="width: 100%;"> + <view class="flex" style="width: 100%;margin: .25rem 0 .15rem 0;"> <view class=""> - <el-button style="padding: 10rpx;" size="mini" icon="el-icon-folder-add">鏀惰棌</el-button> - <el-button style="padding: 10rpx;" size="mini" icon="el-icon-set-up">寮曠敤</el-button> + <!-- <el-button style="padding: 10rpx;" size="mini" icon="el-icon-folder-add">鏀惰棌</el-button> --> + <el-button style="padding: .05rem .085rem;" size="mini" icon="el-icon-set-up">寮曠敤</el-button> </view> - <view class="" style="font-size: 20rpx;">闃呰鏇村></view> + <view class="" style="font-size: .12rem;color: #244A7B;">闃呰鏇村></view> </view> </view> <view class="" style="width: 5%;"></view> </view> - <el-row style="padding: 30rpx 30rpx 0; "> + <el-row style="padding: 0 1.2rem 0;padding-top: .24rem;"> <!-- 宸︿晶 --> - <el-col :span="6"> + <el-col :span="5" style="padding-right: .2rem;width: 2.8rem;"> <div class="grid-content bg-purple-dark flex flex-column"> - <el-card class="box-card" style="width: 100%;"> - <div class="clearfix" style="font-weight: 700;"> - <span>鍏崇郴鍥捐氨</span> + <el-card class="box-card" style="width: 100%;height: 2.06rem;"> + <div class="clearfix" style="font-weight: 900;font-size: .14rem;padding-bottom: .1rem;"> + <span style="margin-left: .12rem;">鍏崇郴鍥捐氨</span> <el-button icon="el-icon-rank" style="float: right; padding: 3px 0" type="text"></el-button> </div> - <view id="relation" style="height: 200rpx;width: 100%;"></view> + <view id="relation" style="height: 1.51rem;width: 100%;"></view> </el-card> - <el-card class="box-card" style="width: 100%; margin: 20rpx 0;"> - <div class="clearfix" style="font-weight: 700;"> + <el-card class="box-card" style="width: 100%;height: 2.06rem; margin: .26rem 0;"> + <div class="clearfix" style="font-weight: 900;font-size: .14rem;padding-bottom: .1rem;"> <span>鏃剁┖鍦伴搧</span> <el-button icon="el-icon-rank" style="float: right; padding: 3px 0" type="text"></el-button> </div> <view id="spaceTime" style="height: 300rpx;width: 100%;position: relative;"></view> - <view class="" - style="line-height: 1.65; margin-top: 10rpx; background-color: #e9e9e9;padding-left: 10rpx;font-size: 20rpx;"> - <view class="" style="padding-top: 10rpx ;font-weight: 800;">鏉ユ簮</view> - <view class="">1.銆婃槑鍙猜峰嵎浜岀櫨涔濆崄涔澛峰垪浣滃搧. p52</view> - <view class="">2.銆婅繘(鏈崏绾茬洰)鐤忋�� p52</view> + </el-card> + <el-card style="width: 100%;height: 2.06rem;"> + <div class="clearfix" style="font-weight: 900;font-size: .14rem;padding-bottom: .1rem;"> + <span>鏉ユ簮</span> + </div> + <ul class="font-family" style="height: 300rpx;font-size: .12rem;line-height: .3rem;"> + <li>1.銆婃槑鍙猜峰嵎浜岀櫨涔濆崄涔澛峰垪浣滃搧. p52</li> + <li>2.銆婅繘(鏈崏绾茬洰)鐤忋�� p52</li> + </ul> + </el-card> + </div> + </el-col> + <!-- 鍙充晶 --> + <el-col :span="18" class="BoxRight"> + <div class="grid-content bg-purple-dark" style="width: 100%;"> + <el-card class="box-card" style="padding: 0;"> + <div class="clearfix" style="font-weight: 900;font-size: .14rem;padding-bottom: .1rem;"> + <span>鍩虹淇℃伅</span> + </div> + <!-- 鍩虹淇℃伅 --> + <cc-defineTable :tableData="tableArr"></cc-defineTable> + </el-card> + <el-card class="box-card" style=" min-height: 1.91rem; margin: 20rpx 0;"> + <el-tabs ref="tabs" v-model="activeName" @tab-click="handleClick"> + <el-tab-pane label="浠h〃钁椾綔" data-id="1" name="representative"> + <Table1 :data="tableData" :columns="tableColumns" /> + </el-tab-pane> + <el-tab-pane label="浜插睘鍏崇郴" data-id="2" name="family "> + 浜插睘鍏崇郴 + </el-tab-pane> + <el-tab-pane label="甯堟壙鍏崇郴" data-id="3" name="mentoring ">甯堟壙鍏崇郴</el-tab-pane> + <el-tab-pane label="绀句細鍏崇郴" data-id="4" name="society">绀句細鍏崇郴</el-tab-pane> + <el-tab-pane label="娲诲姩骞磋氨" data-id="5" name="activity">娲诲姩骞磋氨</el-tab-pane> + </el-tabs> + + </el-card> + <el-card style=" margin-bottom: .2rem ;"> + <div class="clearfix" style="font-weight: 900;font-size: .14rem;padding-bottom: .1rem;"> + <span>鐩稿叧闄勮〃/鍥惧儚</span> + </div> + <view class="flex"> + <el-image v-for="item in 4" :key="item" style="width: 2.05rem; height: 1.4rem" + src="https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg" + fit="fill"></el-image> </view> </el-card> - <el-card class="box-card" style="width: 100%; line-height: 1.18;font-size: 21.5rpx;"> - <ul> + <el-card class="box-card"> + <div class="clearfix" style="font-weight: 900;font-size: .14rem;padding-bottom: .1rem;"> + <span>鐩稿叧闄勮〃/鍥惧儚</span> + </div> + <ul class="font-family" style="font-size: .12rem;line-height: 2;"> <li> [1|鍒樼倻,璋㈣搲,寮犵,绛�.鍚戜汉鏂囩爺绌剁殑鍥藉鏁版嵁鍩虹璁炬柦寤鸿[J|.涓浗鍥句功棣嗗鎶�,2016,42(5):29-39. </li> @@ -80,48 +112,32 @@ </el-card> </div> </el-col> - <!-- 鍙充晶 --> - <el-col :span="18" style="padding-left: 20rpx;"> - <div class="grid-content bg-purple-dark"> - <el-card class="box-card"> - <div class="clearfix" style="font-weight: 700;"> - <span>鍏崇郴鍥捐氨</span> - </div> - <!-- 鍩虹淇℃伅 --> - <cc-defineTable :tableData="tableArr"></cc-defineTable> - </el-card> - <el-card class="box-card" style=" height: 270rpx; margin: 20rpx 0;"> - <el-tabs v-model="activeName" @tab-click="handleClick"> - <el-tab-pane label="浠h〃钁椾綔" name="representative"> - <Table1 :data="tableData" :columns="tableColumns" /> - </el-tab-pane> - <el-tab-pane label="浜插睘鍏崇郴" name="family "> - 浜插睘鍏崇郴 - </el-tab-pane> - <el-tab-pane label="甯堟壙鍏崇郴" name="mentoring ">甯堟壙鍏崇郴</el-tab-pane> - <el-tab-pane label="绀句細鍏崇郴" name="society">绀句細鍏崇郴</el-tab-pane> - <el-tab-pane label="娲诲姩骞磋氨" name="activity">娲诲姩骞磋氨</el-tab-pane> - </el-tabs> - </el-card> - <el-card style=" margin-bottom: 20rpx ;"> - <div class="clearfix" style="font-weight: 700;"> - <span>鍏崇郴鍥捐氨</span> - </div> - <view class="flex"> - <el-image v-for="item in 4" :key="item" style="width: 20%; height: 130rpx" - src="https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg" - fit="fill"></el-image> - </view> - </el-card> - <el-card> - <div class="clearfix" style="font-weight: 700;"> - <span>鐩稿叧闄勮〃/鍥惧儚</span> - </div> - <Table1 :data="tableData" :columns="tableColumns" /> - </el-card> - </div> - </el-col> </el-row> + + <!-- 涓汉灏忎紶 --> + <el-dialog :visible.sync="isProfile"> + <view class="ProfileNav flex flex-center"> + 涓汉灏忎紶 + </view> + <view class="" style="padding: .44rem .3rem;min-height: 7.32rem;" > + <view class="" style="margin-bottom: .2rem; background-color: #F0F0F0;padding: .18rem .1rem .1rem .27rem;font-size: .12rem;line-height: .24rem;font-weight: 400;"> + <view class="" style="color: #2C2C2C;"> + 钑欏睍涓佷笐鍚岄噷鏃ュ博棰濆簭鍏堣�冩湀姹犵縼钁椼�婂洓褰吀鏄庛�嬪叓鍗凤紝鐨嗙簿鎸囧ゥ瀹わ紝鑼傜妧鏈兘鐤�狅紝鐝嶅洜鎾补鎯宠彍锛屽兊鎾版鍞愶紝浠ヤ究鏅虹潧锛屾湇鎸囧崡銆備笘涔嬮浄鐥呴洦瀹讹紝鍜镐互鏈嶇剦棣栧姟锛屼笉鐭ユ淳涔冨洓鑳戒箣鏈紝璋撲箣宸ц�呴洦銆備笂澹鑸嶅叾鍏紝闈炲洓涓嶅彲銆� + </view> + <view class="flex"> + <view class=""></view> + <view class="" style="font-weight: 700;color: #2C2C2C;">鈥斺�斻�婂鍏湇鑰冦�婸 3</view> + </view> + </view> + </view> + </el-dialog> + + + + <!-- 杩斿洖椤堕儴 --> + <el-col style="position: absolute;bottom: 1.44rem;left:1.20rem ;"> + <el-button icon="el-icon-download" circle @click="scrollToTop"></el-button> + </el-col> </view> </template> @@ -138,6 +154,7 @@ }, data() { return { + isProfile: true, // 鍏崇郴鍥捐氨 activeName: 'representative', // 鍩虹淇℃伅 @@ -226,33 +243,105 @@ category: '涓尰瀛�', id: 1 - }, { - worksName: '鏈崏绾茬洰', - works: '鏉庝簩鐗�', - literature: '浣滆��', - epoch: '鐜颁唬', - category: '涓尰瀛�', - id: 1 - }] } }, mounted() { + // 鍏崇郴鍥捐氨 this.relation() // 鏃剁┖鍦板浘 loadBMap('5USVDAhhS4ssz44HLq3gNPZai7naXf4Q').then(() => { this.spaceTime() }) + this.$nextTick(() => { + // 鑾峰彇绗竴涓�夐」鍗$殑 DOM 鍏冪礌 + const firstTab = this.$refs.tabs.$el.querySelector('.el-tabs__active-bar'); + firstTab.style.transform = 'translateX(' + '-20px' + ')' + console.log(firstTab); + }); }, methods: { - handleClick(tab, event) { - console.log(tab, event); + // 杩斿洖涓婁竴椤� + goBack() { + uni.navigateBack(); + }, + // 杩斿洖椤堕儴 + scrollToTop() { + console.log('ss'); + window.scrollTo({ + top: 0, + behavior: "smooth" // 浣跨敤骞虫粦婊氬姩 + }); + }, + handleClick(tab) { + let index = tab.$attrs['data-id'] - 1 + this.$nextTick(() => { + if (index != 0) { + let firstTab = this.$refs.tabs.$el.querySelector('.el-tabs__active-bar'); + firstTab.style.transform = 'translateX(' + 100 * index + 'px)' + } else { + let firstTab = this.$refs.tabs.$el.querySelector('.el-tabs__active-bar'); + firstTab.style.transform = 'translateX(' + '-20' + 'px)' + } + // console.log(firstTab); + }) }, // 鍏崇郴鍥捐氨 relation() { var chartDom = document.getElementById('relation'); var myChart = echarts.init(chartDom); + // 鍋囪鎮ㄦ湁鑺傜偣鍚嶇О鍜屽畠浠箣闂寸殑鍏崇郴鏁版嵁 + var nodes = ['鏉庢椂鐝�', '鎴愬氨', '浼犳壙', '浜插弸', '钁椾綔']; + var relationships = [{ + source: '鏉庢椂鐝�', + target: '鎴愬氨' + }, + { + source: '鏉庢椂鐝�', + target: '浼犳壙' + }, + { + source: '鏉庢椂鐝�', + target: '浜插弸' + }, + { + source: '鏉庢椂鐝�', + target: '钁椾綔' + }, + // 鍏朵粬鍏崇郴... + ]; + + // 鏍规嵁鍏崇郴鏁版嵁鐢熸垚杩炴帴绾� + var links = []; + relationships.forEach(function(relationship) { + var sourceIndex = nodes.indexOf(relationship.source); + var targetIndex = nodes.indexOf(relationship.target); + if (sourceIndex !== -1 && targetIndex !== -1) { + links.push({ + source: sourceIndex, + target: targetIndex + }); + } + + }); + console.log(links); + // 鏍规嵁nodes鍔ㄦ�佺敓鎴愯妭鐐规暟鎹� + var nodeData = nodes.map(function(node, index) { + return { + name: node, + x: Math.random() * 1000, // 璁剧疆闅忔満x鍧愭爣浣嶇疆 + y: Math.random() * 600, // 璁剧疆闅忔満y鍧愭爣浣嶇疆 + itemStyle: { + color: getColorByIndex(index) // 鍙互鏍规嵁绱㈠紩璁剧疆涓嶅悓鐨勯鑹� + } + }; + }); + // 璁剧疆棰滆壊 + function getColorByIndex(index) { + var colors = ['#ecf4ff', '#dd9795', '#f1edbe', '#ecf4ff', '#c5dbd8']; // 鍙互鏍规嵁瀹為檯鎯呭喌璁剧疆棰滆壊鏁扮粍 + return colors[index % colors.length]; + } var option; option = { tooltip: {}, @@ -261,50 +350,17 @@ series: [{ type: 'graph', layout: 'none', - symbolSize: 50, - // roam: true, + symbolSize: 40, // 璋冩暣鑺傜偣澶у皬 label: { - show: true + show: true, + color: 'black' // 璁剧疆鑺傜偣鏂囧瓧棰滆壊涓洪粦鑹� }, edgeSymbol: ['circle'], edgeSymbolSize: [4, 10], edgeLabel: { fontSize: 20 }, - data: [{ - name: 'Node 1', - x: 300, - y: 300, - itemStyle: { - color: 'yellow' // 鑺傜偣鑳屾櫙鑹蹭负榛勮壊 - } - }, - { - name: 'Node 2', - x: 800, - y: 300, - itemStyle: { - color: 'red' // 鑺傜偣鑳屾櫙鑹蹭负榛勮壊 - } - }, - { - name: 'Node 3', - x: 550, - y: 100, - itemStyle: { - color: 'blue' // 鑺傜偣鑳屾櫙鑹蹭负榛勮壊 - } - }, - { - name: 'Node 4', - x: 550, - y: 500, - itemStyle: { - color: 'green' // 鑺傜偣鑳屾櫙鑹蹭负缁胯壊 - } - } - ], - // links: [], + data: nodeData, links: [{ source: 0, target: 1, @@ -339,11 +395,12 @@ }] }; + // 灏嗙敓鎴愮殑杩炴帴绾挎坊鍔犲埌echarts鍥捐〃鐨刼ption涓� + option.series[0].links = links; option && myChart.setOption(option); }, // 鏃剁┖鍦板浘 spaceTime() { - var chartDom = document.getElementById('spaceTime'); var myChart = echarts.init(chartDom); var option; @@ -351,38 +408,6 @@ const data = [{ name: '娴烽棬', value: 9 - }, - { - name: '閯傚皵澶氭柉', - value: 12 - }, - { - name: '鎷涜繙', - value: 12 - }, - { - name: '鑸熷北', - value: 12 - }, - { - name: '榻愰綈鍝堝皵', - value: 14 - }, - { - name: '鐩愬煄', - value: 15 - }, - { - name: '璧ゅ嘲', - value: 16 - }, - { - name: '闈掑矝', - value: 18 - }, - { - name: '涔冲北', - value: 18 }, { name: '閲戞槍', @@ -421,35 +446,6 @@ 娴烽棬: [121.15, 31.89], 閯傚皵澶氭柉: [109.781327, 39.608266], 鎷涜繙: [120.38, 37.35], - 鑸熷北: [122.207216, 29.985295], - 涔岄瞾鏈ㄩ綈: [87.68, 43.77], - 鏋e簞: [117.57, 34.86], - 鏉窞: [120.19, 30.26], - 娣勫崥: [118.05, 36.78], - 闉嶅北: [122.85, 41.12], - 婧ч槼: [119.48, 31.43], - 搴撳皵鍕�: [86.06, 41.68], - 瀹夐槼: [114.35, 36.1], - 寮�灏�: [114.35, 34.79], - 娴庡崡: [117, 36.65], - 寰烽槼: [104.37, 31.13], - 娓╁窞: [120.65, 28.01], - 涔濇睙: [115.97, 29.71], - 閭兏: [114.47, 36.6], - 涓村畨: [119.72, 30.23], - 鍏板窞: [103.73, 36.03], - 娌у窞: [116.83, 38.33], - 涓存矀: [118.35, 35.05], - 鍗楀厖: [106.110698, 30.837793], - 澶╂触: [117.2, 39.13], - 瀵岄槼: [119.95, 30.07], - 娉板畨: [117.13, 36.18], - 璇告毃: [120.23, 29.71], - 閮戝窞: [113.65, 34.76], - 鍝堝皵婊�: [126.63, 45.75], - 鑱婂煄: [115.97, 36.45], - 鑺滄箹: [118.38, 31.33], - 鍞愬北: [118.02, 39.63], 骞抽《灞�: [113.29, 33.75], 閭㈠彴: [114.48, 37.05], 寰峰窞: [116.29, 37.45], @@ -495,7 +491,7 @@ }, bmap: { center: [104.114129, 37.550339], - zoom: 5, + zoom: 1, roam: true, mapStyle: { styleJson: [{ @@ -510,62 +506,6 @@ elementType: 'all', stylers: { color: '#f3f3f3' - } - }, - { - featureType: 'railway', - elementType: 'all', - stylers: { - visibility: 'off' - } - }, - { - featureType: 'highway', - elementType: 'all', - stylers: { - color: '#fdfdfd' - } - }, - { - featureType: 'highway', - elementType: 'labels', - stylers: { - visibility: 'off' - } - }, - { - featureType: 'arterial', - elementType: 'geometry', - stylers: { - color: '#fefefe' - } - }, - { - featureType: 'arterial', - elementType: 'geometry.fill', - stylers: { - color: '#fefefe' - } - }, - { - featureType: 'poi', - elementType: 'all', - stylers: { - visibility: 'off' - } - }, - { - featureType: 'green', - elementType: 'all', - stylers: { - visibility: 'off' - } - }, - { - featureType: 'subway', - elementType: 'all', - stylers: { - visibility: 'off' } }, { @@ -676,6 +616,7 @@ ] }; + option && myChart.setOption(option); }, @@ -685,6 +626,31 @@ </script> <style> + /* 涓汉灏忎紶 ------------------*/ + ::v-deep .el-dialog__header { + display: none; + } + + ::v-deep .el-dialog__body { + padding: 0; + } + ::v-deep .el-dialog__wrapper{ + z-index: 999999999999999 !important; + } + + .ProfileNav { + width: 100%; + height: 0.7rem; + background: url(@/static/image/ProfileBg.png); + background-size: 100% 100%; + font-size: .24rem; + color: #2C2C2C; + font-weight: bold; + } + + /* ------------------- */ + + img { width: 100%; height: 100%; @@ -724,29 +690,34 @@ .Midde { background-color: #dbeafd; color: #000; - padding: 5rpx 40rpx 0; + /* padding: 5rpx 40rpx 0; */ + padding: .24rem .18rem; align-items: flex-start; view { color: #000; } - + .MiddeBack { + width: 0.6rem; + height: 0.24rem; + } } .fz { - line-height: 1.3; + /* line-height: 1.3; height: 100rpx; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; - -webkit-box-orient: vertical; + -webkit-box-orient: vertical; */ + color: #2C2C2C; } ::v-deep .el-card__body { - padding: 10rpx !important; + padding: .1rem !important; } /* echart鍦板浘姘村嵃 */ @@ -762,17 +733,49 @@ background-color: transparent; } + ::v-deep .el-tabs__nav { + margin-bottom: .2rem !important; + + } + ::v-deep .el-tabs__nav-scroll { display: flex; justify-content: center; } ::v-deep .el-tabs__item { - font-size: 20rpx; + width: 1rem; + font-size: .14rem; line-height: 40rpx; height: 40rpx; } - ::v-deep .el-tabs__header{ + + ::v-deep .el-tabs__header { margin: 0 0 10rpx; } + + ::v-deep .el-tabs__active-bar { + /* 璁剧疆婊氬姩鏉″搴� */ + width: 1rem !important; + height: .03rem !important; + background-color: #597AA5; + transform: translateX(-20px); + /* margin-top: .09rem; */ + } + + ::v-deep .el-tabs__active-bar { + top: .3rem !important; + } + + ::v-deep .el-table::before { + background-color: #fff !important; + } + + .BoxRight ::v-deep.el-card__body { + padding: .2rem .14rem !important; + } + + .BoxRight .box-card { + margin-bottom: .2rem !important; + } </style> \ No newline at end of file diff --git a/pages/zhongyi/zhongyi.vue b/pages/zhongyi/zhongyi.vue index 3162ec3..e39dc81 100644 --- a/pages/zhongyi/zhongyi.vue +++ b/pages/zhongyi/zhongyi.vue @@ -2,7 +2,7 @@ <el-container> <!-- 澶撮儴 --> <el-header> - <div style=" + <view style=" display: flex; height: 50px; width: 100%; @@ -10,34 +10,34 @@ align-items: center; background-color: #C98A49; "> - <div class="header-one" style="padding-left: 1.5%; "> + <view class="header-one" style="padding-left: 1.5%; "> <i class="el-icon-s-unfold" style="font-size: 24px;"></i> - </div> - <div class="header-two" style="font-size: 20px; color: aliceblue"> + </view> + <view class="header-two" style="font-size: 20px; color: aliceblue"> 涓尰涓栧尰浼犳壙鏁版嵁搴� - </div> - <div class="header-three"> - <div> + </view> + <view class="header-three"> + <view> <i class="el-icon-search" style="font-size: 24px; "></i> <i class="el-icon-question" style="font-size: 24px;"></i> <i class="el-icon-user-solid" style="font-size: 24px;"></i> - </div> - </div> - </div> - <div class="huawenimg"> - </div> + </view> + </view> + </view> + <view class="huawenimg"> + </view> </el-header> <!-- 涓讳綋閮ㄥ垎 --> <el-main> - <div style=" + <view style=" display: flex; justify-content: center; border-bottom: 1px solid gray;"> - <div style="display: flex; justify-content: flex-start; margin-right: auto"> + <view style="display: flex; justify-content: flex-start; margin-right: auto"> <el-button class="button" @click="hideNodesAndLinks()">杩斿洖</el-button> - </div> + </view> <!-- 娣诲姞涓�涓猣lex瀹瑰櫒鏉ュ寘瑁筫l-menu锛屽苟璁剧疆鍏秄lex灞炴�т互鍗犳嵁鍓╀綑绌洪棿 --> - <div style="display: flex; justify-content: center; flex: 1;"> + <view style="display: flex; justify-content: center; flex: 1;"> <!-- 杩欓噷鏄彍鍗曠殑鍒囨崲 --> <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect"> @@ -49,8 +49,8 @@ <router-link to="zhongyitwo" class="router-link-active"> 涓栧尰鏂囧寲</router-link></el-menu-item> </el-menu> - </div> - </div> + </view> + </view> <router-view> </router-view> </el-main> @@ -58,7 +58,13 @@ </template> <script> import * as echarts from "echarts"; - export default {} + export default { + data() { + return { + activeIndex:1 + } + } + } </script> <style scoped> .huawenimg { diff --git a/static/image/ProfileBg.png b/static/image/ProfileBg.png new file mode 100644 index 0000000..b600c73 --- /dev/null +++ b/static/image/ProfileBg.png Binary files differ diff --git a/static/image/characterRelationBg.png b/static/image/characterRelationBg.png new file mode 100644 index 0000000..88badcd --- /dev/null +++ b/static/image/characterRelationBg.png Binary files differ diff --git a/static/image/logo.png b/static/image/logo.png index 322ce81..3781366 100644 --- a/static/image/logo.png +++ b/static/image/logo.png Binary files differ diff --git a/static/image/profile.svg b/static/image/profile.svg new file mode 100644 index 0000000..36b433b --- /dev/null +++ b/static/image/profile.svg @@ -0,0 +1 @@ +<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 34 34"><defs><style>.cls-1{fill:#fff;}</style></defs><g id="鍥惧眰_2" data-name="鍥惧眰 2"><g id="鍥惧眰_1-2" data-name="鍥惧眰 1"><circle class="cls-1" cx="17" cy="14.73" r="6.23"/><path class="cls-1" d="M17,0A17,17,0,1,0,34,17,17,17,0,0,0,17,0Zm7.05,27.77A5.35,5.35,0,0,0,20,22.67a8.33,8.33,0,0,1-5.86,0,5.32,5.32,0,0,0-3.93,5.06H7.93a7.24,7.24,0,0,1,3.74-6.42,8.5,8.5,0,1,1,10.76-.09,7.26,7.26,0,0,1,3.89,6.51Z"/></g></g></svg> \ No newline at end of file diff --git a/static/image/quote.svg b/static/image/quote.svg new file mode 100644 index 0000000..855e68a --- /dev/null +++ b/static/image/quote.svg @@ -0,0 +1 @@ +<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 34 34"><defs><style>.cls-1{fill:#fff;}</style></defs><g id="鍥惧眰_2" data-name="鍥惧眰 2"><g id="鍥惧眰_1-2" data-name="鍥惧眰 1"><path class="cls-1" d="M17,0A17,17,0,1,0,34,17,17,17,0,0,0,17,0Zm1.4,27.65H15.49v-2.9H18.4Zm4.61-13a11.91,11.91,0,0,1-2.5,2.8,12,12,0,0,0-1.63,1.63,3.74,3.74,0,0,0-.57,1.21,10.22,10.22,0,0,0-.21,2.21H15.65v-.76a7.25,7.25,0,0,1,.42-2.61,5.91,5.91,0,0,1,1-1.66,18.08,18.08,0,0,1,1.84-1.77,8.45,8.45,0,0,0,1.7-1.88,3,3,0,0,0,.4-1.51,3.57,3.57,0,0,0-1.16-2.62A4,4,0,0,0,17,8.59a3.87,3.87,0,0,0-2.74,1,5.4,5.4,0,0,0-1.43,3.2l-2.65-.34A6.71,6.71,0,0,1,12.31,8a6.74,6.74,0,0,1,4.63-1.55,6.92,6.92,0,0,1,4.87,1.66,5.25,5.25,0,0,1,1.82,4A5.13,5.13,0,0,1,23,14.68Z"/></g></g></svg> \ No newline at end of file diff --git a/static/image/search.svg b/static/image/search.svg new file mode 100644 index 0000000..9609210 --- /dev/null +++ b/static/image/search.svg @@ -0,0 +1 @@ +<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 34 34"><defs><style>.cls-1{fill:#fff;}</style></defs><g id="鍥惧眰_2" data-name="鍥惧眰 2"><g id="鍥惧眰_1-2" data-name="鍥惧眰 1"><circle class="cls-1" cx="15.95" cy="15.44" r="6.7"/><path class="cls-1" d="M17,0A17,17,0,1,0,34,17,17,17,0,0,0,17,0ZM16,24.82a9.39,9.39,0,1,1,9.39-9.38A9.38,9.38,0,0,1,16,24.82Zm9.79,2.95L22,24l1.87-1.89,3.75,3.76Z"/></g></g></svg> \ No newline at end of file diff --git "a/static/image/\346\220\234\347\264\242.png" "b/static/image/\346\220\234\347\264\242.png" new file mode 100644 index 0000000..f997228 --- /dev/null +++ "b/static/image/\346\220\234\347\264\242.png" Binary files differ diff --git "a/static/image/\347\224\250\346\210\267\346\263\250\345\206\214.png" "b/static/image/\347\224\250\346\210\267\346\263\250\345\206\214.png" new file mode 100644 index 0000000..9d65676 --- /dev/null +++ "b/static/image/\347\224\250\346\210\267\346\263\250\345\206\214.png" Binary files differ diff --git "a/static/image/\347\224\250\346\210\267\347\231\273\345\275\225.png" "b/static/image/\347\224\250\346\210\267\347\231\273\345\275\225.png" new file mode 100644 index 0000000..4dbf375 --- /dev/null +++ "b/static/image/\347\224\250\346\210\267\347\231\273\345\275\225.png" Binary files differ diff --git "a/static/image/\351\207\215\347\275\256\345\257\206\347\240\201.png" "b/static/image/\351\207\215\347\275\256\345\257\206\347\240\201.png" new file mode 100644 index 0000000..8b37ad0 --- /dev/null +++ "b/static/image/\351\207\215\347\275\256\345\257\206\347\240\201.png" Binary files differ diff --git a/static/initialize.css b/static/initialize.css index 0b08a03..5def451 100644 --- a/static/initialize.css +++ b/static/initialize.css @@ -1,9 +1,16 @@ * { margin: 0%; padding: 0; - /* box-sizing: border-box; */ + box-sizing: border-box; } - + html { + font-size: calc(100 * 100vw / 1440) !important; + /* font-size: 10px; */ + } + + body { + font-size: .16rem !important; + } .flex { display: flex; align-items: center; @@ -41,6 +48,9 @@ .flex-content{ justify-content: space-around; } + .flex-items-start{ + align-items: flex-start; + } .relative { position: relative; -- Gitblit v1.9.1