徐强 / market_manage · 提交

转到一个项目

作者 xuqiang
提交 0ff5b2ba15906227b7a5f5c8e1f9a7fb75a518fa 1 个父辈 fc1f8d42

提交

内嵌 并排对比
正在显示 31 个修改的文件 包含 1259 行增加 和 536 行删除
... ... @@ -86,366 +86,6 @@ image.loading::after {
开关
==================== */
switch,
checkbox,
radio {
position: relative;
}
switch::after,
switch::before {
font-family: "cuIcon";
content: "\e645";
position: absolute;
color: #ffffff !important;
top: 0%;
left: 0upx;
font-size: 26upx;
line-height: 26px;
width: 50%;
text-align: center;
pointer-events: none;
transform: scale(0, 0);
transition: all 0.3s ease-in-out 0s;
z-index: 9;
bottom: 0;
height: 26px;
margin: auto;
}
switch::before {
content: "\e646";
right: 0;
transform: scale(1, 1);
left: auto;
}
switch[checked]::after,
switch.checked::after {
transform: scale(1, 1);
}
switch[checked]::before,
switch.checked::before {
transform: scale(0, 0);
}
/* #ifndef MP-ALIPAY */
radio::before,
checkbox::before {
font-family: "cuIcon";
content: "\e645";
position: absolute;
color: #ffffff !important;
top: 50%;
margin-top: -8px;
right: 5px;
font-size: 32upx;
line-height: 16px;
pointer-events: none;
transform: scale(1, 1);
transition: all 0.3s ease-in-out 0s;
z-index: 9;
}
radio .wx-radio-input,
checkbox .wx-checkbox-input,
radio .uni-radio-input,
checkbox .uni-checkbox-input {
margin: 0;
width: 24px;
height: 24px;
}
checkbox.round .wx-checkbox-input,
checkbox.round .uni-checkbox-input {
border-radius: 100upx;
}
/* #endif */
switch[checked]::before {
transform: scale(0, 0);
}
switch .wx-switch-input,
switch .uni-switch-input {
border: none;
padding: 0 24px;
width: 48px;
height: 26px;
margin: 0;
border-radius: 100upx;
}
switch .wx-switch-input:not([class*="bg-"]),
switch .uni-switch-input:not([class*="bg-"]) {
background: #8799a3 !important;
}
switch .wx-switch-input::after,
switch .uni-switch-input::after {
margin: auto;
width: 26px;
height: 26px;
border-radius: 100upx;
left: 0upx;
top: 0upx;
bottom: 0upx;
position: absolute;
transform: scale(0.9, 0.9);
transition: all 0.1s ease-in-out 0s;
}
switch .wx-switch-input.wx-switch-input-checked::after,
switch .uni-switch-input.uni-switch-input-checked::after {
margin: auto;
left: 22px;
box-shadow: none;
transform: scale(0.9, 0.9);
}
radio-group {
display: inline-block;
}
switch.radius .wx-switch-input::after,
switch.radius .wx-switch-input,
switch.radius .wx-switch-input::before,
switch.radius .uni-switch-input::after,
switch.radius .uni-switch-input,
switch.radius .uni-switch-input::before {
border-radius: 10upx;
}
switch .wx-switch-input::before,
radio.radio::before,
checkbox .wx-checkbox-input::before,
radio .wx-radio-input::before,
switch .uni-switch-input::before,
radio.radio::before,
checkbox .uni-checkbox-input::before,
radio .uni-radio-input::before {
display: none;
}
radio.radio[checked]::after,
radio.radio .uni-radio-input-checked::after {
content: "";
background-color: transparent;
display: block;
position: absolute;
width: 8px;
height: 8px;
z-index: 999;
top: 0upx;
left: 0upx;
right: 0;
bottom: 0;
margin: auto;
border-radius: 200upx;
/* #ifndef MP */
border: 7px solid #ffffff !important;
/* #endif */
/* #ifdef MP */
border: 8px solid #ffffff !important;
/* #endif */
}
.switch-sex::after {
content: "\e71c";
}
.switch-sex::before {
content: "\e71a";
}
.switch-sex .wx-switch-input,
.switch-sex .uni-switch-input {
background: #e54d42 !important;
border-color: #e54d42 !important;
}
.switch-sex[checked] .wx-switch-input,
.switch-sex.checked .uni-switch-input {
background: #0081ff !important;
border-color: #0081ff !important;
}
switch.red[checked] .wx-switch-input.wx-switch-input-checked,
checkbox.red[checked] .wx-checkbox-input,
radio.red[checked] .wx-radio-input,
switch.red.checked .uni-switch-input.uni-switch-input-checked,
checkbox.red.checked .uni-checkbox-input,
radio.red.checked .uni-radio-input {
background-color: #e54d42 !important;
border-color: #e54d42 !important;
color: #ffffff !important;
}
switch.orange[checked] .wx-switch-input,
checkbox.orange[checked] .wx-checkbox-input,
radio.orange[checked] .wx-radio-input,
switch.orange.checked .uni-switch-input,
checkbox.orange.checked .uni-checkbox-input,
radio.orange.checked .uni-radio-input {
background-color: #f37b1d !important;
border-color: #f37b1d !important;
color: #ffffff !important;
}
switch.yellow[checked] .wx-switch-input,
checkbox.yellow[checked] .wx-checkbox-input,
radio.yellow[checked] .wx-radio-input,
switch.yellow.checked .uni-switch-input,
checkbox.yellow.checked .uni-checkbox-input,
radio.yellow.checked .uni-radio-input {
background-color: #fbbd08 !important;
border-color: #fbbd08 !important;
color: #333333 !important;
}
switch.olive[checked] .wx-switch-input,
checkbox.olive[checked] .wx-checkbox-input,
radio.olive[checked] .wx-radio-input,
switch.olive.checked .uni-switch-input,
checkbox.olive.checked .uni-checkbox-input,
radio.olive.checked .uni-radio-input {
background-color: #8dc63f !important;
border-color: #8dc63f !important;
color: #ffffff !important;
}
switch.green[checked] .wx-switch-input,
switch[checked] .wx-switch-input,
checkbox.green[checked] .wx-checkbox-input,
checkbox[checked] .wx-checkbox-input,
radio.green[checked] .wx-radio-input,
radio[checked] .wx-radio-input,
switch.green.checked .uni-switch-input,
switch.checked .uni-switch-input,
checkbox.green.checked .uni-checkbox-input,
checkbox.checked .uni-checkbox-input,
radio.green.checked .uni-radio-input,
radio.checked .uni-radio-input {
background-color: #39b54a !important;
border-color: #39b54a !important;
color: #ffffff !important;
border-color: #39B54A !important;
}
switch.cyan[checked] .wx-switch-input,
checkbox.cyan[checked] .wx-checkbox-input,
radio.cyan[checked] .wx-radio-input,
switch.cyan.checked .uni-switch-input,
checkbox.cyan.checked .uni-checkbox-input,
radio.cyan.checked .uni-radio-input {
background-color: #1cbbb4 !important;
border-color: #1cbbb4 !important;
color: #ffffff !important;
}
switch.blue[checked] .wx-switch-input,
checkbox.blue[checked] .wx-checkbox-input,
radio.blue[checked] .wx-radio-input,
switch.blue.checked .uni-switch-input,
checkbox.blue.checked .uni-checkbox-input,
radio.blue.checked .uni-radio-input {
background-color: #0081ff !important;
border-color: #0081ff !important;
color: #ffffff !important;
}
switch.purple[checked] .wx-switch-input,
checkbox.purple[checked] .wx-checkbox-input,
radio.purple[checked] .wx-radio-input,
switch.purple.checked .uni-switch-input,
checkbox.purple.checked .uni-checkbox-input,
radio.purple.checked .uni-radio-input {
background-color: #6739b6 !important;
border-color: #6739b6 !important;
color: #ffffff !important;
}
switch.mauve[checked] .wx-switch-input,
checkbox.mauve[checked] .wx-checkbox-input,
radio.mauve[checked] .wx-radio-input,
switch.mauve.checked .uni-switch-input,
checkbox.mauve.checked .uni-checkbox-input,
radio.mauve.checked .uni-radio-input {
background-color: #9c26b0 !important;
border-color: #9c26b0 !important;
color: #ffffff !important;
}
switch.pink[checked] .wx-switch-input,
checkbox.pink[checked] .wx-checkbox-input,
radio.pink[checked] .wx-radio-input,
switch.pink.checked .uni-switch-input,
checkbox.pink.checked .uni-checkbox-input,
radio.pink.checked .uni-radio-input {
background-color: #e03997 !important;
border-color: #e03997 !important;
color: #ffffff !important;
}
switch.brown[checked] .wx-switch-input,
checkbox.brown[checked] .wx-checkbox-input,
radio.brown[checked] .wx-radio-input,
switch.brown.checked .uni-switch-input,
checkbox.brown.checked .uni-checkbox-input,
radio.brown.checked .uni-radio-input {
background-color: #a5673f !important;
border-color: #a5673f !important;
color: #ffffff !important;
}
switch.grey[checked] .wx-switch-input,
checkbox.grey[checked] .wx-checkbox-input,
radio.grey[checked] .wx-radio-input,
switch.grey.checked .uni-switch-input,
checkbox.grey.checked .uni-checkbox-input,
radio.grey.checked .uni-radio-input {
background-color: #8799a3 !important;
border-color: #8799a3 !important;
color: #ffffff !important;
}
switch.gray[checked] .wx-switch-input,
checkbox.gray[checked] .wx-checkbox-input,
radio.gray[checked] .wx-radio-input,
switch.gray.checked .uni-switch-input,
checkbox.gray.checked .uni-checkbox-input,
radio.gray.checked .uni-radio-input {
background-color: #f0f0f0 !important;
border-color: #f0f0f0 !important;
color: #333333 !important;
}
switch.black[checked] .wx-switch-input,
checkbox.black[checked] .wx-checkbox-input,
radio.black[checked] .wx-radio-input,
switch.black.checked .uni-switch-input,
checkbox.black.checked .uni-checkbox-input,
radio.black.checked .uni-radio-input {
background-color: #333333 !important;
border-color: #333333 !important;
color: #ffffff !important;
}
switch.white[checked] .wx-switch-input,
checkbox.white[checked] .wx-checkbox-input,
radio.white[checked] .wx-radio-input,
switch.white.checked .uni-switch-input,
checkbox.white.checked .uni-checkbox-input,
radio.white.checked .uni-radio-input {
background-color: #ffffff !important;
border-color: #ffffff !important;
color: #333333 !important;
}
/* ==================
边框
... ... @@ -2317,7 +1957,6 @@ button.cuIcon.lg {
.cu-form-group {
background-color: #ffffff;
padding: 1upx 30upx;
display: flex;
align-items: center;
min-height: 100upx;
... ...
<template>
<view class="imgTxtTitle">
<image :src="imgUrl" mode=""></image>
<image :src="imgUrl" :style="{width:imgSize+'rpx',height:imgSize+'rpx'}" mode=""></image>
{{txtInfo}}
</view>
</template>
... ... @@ -13,6 +13,9 @@
},
txtInfo:{
type:String
},
imgSize:{
type:Number
}
}
}
... ... @@ -23,7 +26,7 @@
height: 108rpx;
display: flex;
align-items: center;
image{width: $uni-img-size-44;height: $uni-img-size-44;margin-right: 16rpx;}
image{margin-right: 16rpx;}
font-size: $uni-font-size-40;
}
</style>
... ...
... ... @@ -4,25 +4,25 @@
},
"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
{
"path": "pages/index/loginUser",
"path": "pages/my/personCenter",
"style": {
"navigationBarTitleText": "市场监管",
"navigationBarTitleText": "个人中心",
"navigationBarBackgroundColor":"#2e7ff9",
"navigationBarTextStyle":"white"
}
},
{
"path": "pages/index/loginCompany",
"path": "pages/my/my",
"style": {
"navigationBarTitleText": "市场监管",
"navigationBarTitleText": "我的",
"navigationBarBackgroundColor":"#2e7ff9",
"navigationBarTextStyle":"white"
}
},
{
"path": "pages/index/index",
"path": "pages/demand/publish",
"style": {
"navigationBarTitleText": "市场监管",
"navigationBarTitleText": "需求发布",
"navigationBarBackgroundColor":"#2e7ff9",
"navigationBarTextStyle":"white"
}
... ... @@ -37,6 +37,70 @@
}
},
{
"path": "pages/index/productDetail",
"style": {
"navigationBarTitleText": "产品详情",
"navigationBarBackgroundColor":"#2e7ff9",
"navigationBarTextStyle":"white"
}
},
{
"path": "pages/index/productList",
"style": {
"navigationBarTitleText": "产品列表",
"navigationBarBackgroundColor":"#2e7ff9",
"navigationBarTextStyle":"white"
}
},
{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "市场监管",
"navigationBarBackgroundColor":"#2e7ff9",
"navigationBarTextStyle":"white"
}
},
{
"path": "pages/index/indexNoLogin",
"style": {
"navigationBarTitleText": "市场监管",
"navigationBarBackgroundColor":"#2e7ff9",
"navigationBarTextStyle":"white"
}
},
{
"path": "pages/index/setNewPassword",
"style": {
"navigationBarTitleText": "市场监管",
"navigationBarBackgroundColor":"#2e7ff9",
"navigationBarTextStyle":"white"
}
},
{
"path": "pages/index/forgetPassword",
"style": {
"navigationBarTitleText": "市场监管",
"navigationBarBackgroundColor":"#2e7ff9",
"navigationBarTextStyle":"white"
}
},
{
"path": "pages/index/loginUser",
"style": {
"navigationBarTitleText": "市场监管",
"navigationBarBackgroundColor":"#2e7ff9",
"navigationBarTextStyle":"white"
}
},
{
"path": "pages/index/loginCompany",
"style": {
"navigationBarTitleText": "市场监管",
"navigationBarBackgroundColor":"#2e7ff9",
"navigationBarTextStyle":"white"
}
},
{
"path": "pages/index/replyDesc",
"style": {
"navigationBarTitleText": "市场监管",
... ... @@ -56,5 +120,27 @@
"navigationBarTitleText": "uni-app",
"navigationBarBackgroundColor": "#fff",
"backgroundColor": "#F8F8F8"
},
"tabBar": {
"color": "#7A7E83",
"selectedColor": "#2e7ff9",
"borderStyle": "black",
"backgroundColor": "#ffffff",
"list": [{
"pagePath": "pages/index/index",
"iconPath": "static/image/ic_8@2x.png",
"selectedIconPath": "static/image/ic_8_select@2x.png",
"text": "首页"
}, {
"pagePath": "pages/demand/publish",
"iconPath": "static/image/ic_9@2x.png",
"selectedIconPath": "static/image/ic_9_select@2x.png",
"text": "需求"
}, {
"pagePath": "pages/my/my",
"iconPath": "static/image/ic_10@2x.png",
"selectedIconPath": "static/image/ic_10_select@2x.png",
"text": "我的"
}]
}
}
... ...
<template>
<view>
<form>
<view style="padding: 0 32rpx;background: #fff;">
<view class="cu-form-group">
<view class="title">科室</view>
<picker @change="PickerChange" :value="index" :range="picker">
<view class="picker" :style="{'text-align': 'left','color':index>-1?'#323232':'#808080'}">
{{index>-1?picker[index]:'请选择科室'}}
</view>
</picker>
</view>
<view class="cu-form-group">
<view class="title">需求标题</view>
<input placeholder="请输入需求标题" name="input"></input>
</view>
<!-- !!!!! placeholder 在ios表现有偏移 建议使用 第一种样式 -->
<view class="cu-form-group">
<view class="title">内容</view>
</view>
<view class="cu-form-group" style="border-top: none;">
<textarea maxlength="1000" v-model="textareaAValue" @input="textareaAInput" placeholder="请描述您的需求内容..."></textarea>
</view>
<view class="cu-form-group" style="padding-top: 32rpx;">
<view class="grid col-4 grid-square flex-sub">
<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
<image :src="imgList[index]" mode="aspectFill"></image>
<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
<text class='cuIcon-close'></text>
</view>
</view>
<view class="solids" style="width: 182rpx;height: 182rpx;" @tap="ChooseImage" v-if="imgList.length<9">
<image src="../../static/image/no_upload@2x.png" style="width: 182rpx;height: 182rpx;" mode=""></image>
</view>
</view>
</view>
</view>
<view class="cu-bar margin-top" style="display: flex;justify-content: center;">
<view style="background: #2e7ff9;border-radius: 80rpx;height: 80rpx;width: 686rpx;color: #fff;text-align: center;line-height: 80rpx;">
提交
</view>
</view>
</form>
</view>
</template>
<script>
export default {
data() {
return {
index: -1,
picker: ['科室1', '科室2', '科室3'],
multiIndex: [0, 0, 0],
imgList: [],
modalName: null,
textareaAValue: '',
textareaBValue: ''
};
},
methods: {
PickerChange(e) {
this.index = e.detail.value
},
ChooseImage() {
uni.chooseImage({
count: 4, //默认9
sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
sourceType: ['album'], //从相册选择
success: (res) => {
if (this.imgList.length != 0) {
this.imgList = this.imgList.concat(res.tempFilePaths)
} else {
this.imgList = res.tempFilePaths
}
}
});
},
ViewImage(e) {
uni.previewImage({
urls: this.imgList,
current: e.currentTarget.dataset.url
});
},
DelImg(e) {
uni.showModal({
title: '提示',
content: '确定要删除此照片吗？',
cancelText: '再看看',
confirmText: '确认',
success: res => {
if (res.confirm) {
this.imgList.splice(e.currentTarget.dataset.index, 1)
}
}
})
},
textareaAInput(e) {
this.textareaAValue = e.detail.value
},
textareaBInput(e) {
this.textareaBValue = e.detail.value
}
}
}
</script>
<style lang="scss">
page{
background-color: $uni-bg-color-hui;
}
.cu-form-group .title {
min-width: calc(4em + 30px);
}
</style>
... ...
<template>
<view>
<form>
<view class="cu-form-group">
<view class="title">企业类型</view>
<picker @change="PickerChange" :value="index" :range="picker">
<view class="picker" :style="{'text-align': 'left','color':index>-1?'#323232':'#808080'}">
{{index>-1?picker[index]:'请选择企业类型'}}
</view>
</picker>
</view>
<view class="cu-form-group">
<view class="title">企业名称</view>
<input placeholder="请输入企业名称" name="input"></input>
</view>
<view class="cu-form-group">
<view class="title">法人姓名</view>
<input placeholder="请输入法人姓名" name="input"></input>
</view>
<view class="cu-form-group">
<view class="title">法人电话</view>
<input placeholder="请输入法人电话" name="input"></input>
</view>
<view class="cu-form-group">
<view class="title">联系人姓名</view>
<input placeholder="请输入联系人姓名" name="input"></input>
</view>
<view class="cu-form-group">
<view class="title">联系人电话</view>
<input placeholder="请输入联系人电话" name="input"></input>
</view>
<!-- !!!!! placeholder 在ios表现有偏移 建议使用 第一种样式 -->
<view class="cu-bar bg-white margin-top">
<view class="action">
需求说明
<view style="padding: 0 32rpx;background: #fff;">
<view class="cu-form-group">
<view class="title">企业类型</view>
<picker @change="PickerChange" :value="index" :range="picker">
<view class="picker" :style="{'text-align': 'left','color':index>-1?'#323232':'#808080'}">
{{index>-1?picker[index]:'请选择企业类型'}}
</view>
</picker>
</view>
</view>
<view class="cu-form-group">
<view style="background: #f7f8fa;border-radius: 20rpx;width: 100%;padding: 0 30rpx 10rpx 30rpx;margin-bottom: 30rpx;">
<textarea maxlength="1000" v-model="textareaAValue" @input="textareaAInput" placeholder="请输入需求说明"></textarea>
<view style="color: #cecfd2;text-align: right;">
{{textareaAValue.length}}/1000
</view>
<view class="cu-form-group">
<view class="title">企业名称</view>
<input placeholder="请输入企业名称" name="input"></input>
</view>
</view>
<view class="cu-bar bg-white margin-top">
<view class="action">
营业执照
<view class="cu-form-group">
<view class="title">法人姓名</view>
<input placeholder="请输入法人姓名" name="input"></input>
</view>
<view class="cu-form-group">
<view class="title">法人电话</view>
<input placeholder="请输入法人电话" name="input"></input>
</view>
<view class="cu-form-group">
<view class="title">联系人姓名</view>
<input placeholder="请输入联系人姓名" name="input"></input>
</view>
<view class="cu-form-group">
<view class="title">联系人电话</view>
<input placeholder="请输入联系人电话" name="input"></input>
</view>
</view>
<view class="cu-form-group">
<view class="grid col-4 grid-square flex-sub" style="border-bottom: 2rpx solid #ebedf0;">
<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
<image :src="imgList[index]" mode="aspectFill"></image>
<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
<text class='cuIcon-close'></text>
<view style="padding: 0 32rpx;background: #fff;">
<!-- !!!!! placeholder 在ios表现有偏移 建议使用 第一种样式 -->
<view class="cu-form-group margin-top">
<view class="title">需求说明</view>
</view>
<view class="cu-form-group">
<view style="background: #f7f8fa;border-radius: 20rpx;width: 100%;padding: 0 30rpx 10rpx 30rpx;margin-bottom: 30rpx;">
<textarea maxlength="1000" v-model="textareaAValue" @input="textareaAInput" placeholder="请输入需求说明"></textarea>
<view style="color: #cecfd2;text-align: right;">
{{textareaAValue.length}}/1000
</view>
</view>
<view class="solids" style="width: 182rpx;height: 182rpx;" @tap="ChooseImage" v-if="imgList.length<1">
<image src="../../static/image/no_upload@2x.png" style="width: 182rpx;height: 182rpx;" mode=""></image>
</view>
</view>
</view>
<view class="cu-bar bg-white">
<view class="action">
法人身份证
<view style="padding: 0 32rpx;background: #fff;">
<view class="cu-bar bg-white margin-top">
<view class="action">
营业执照
</view>
</view>
</view>
<view class="cu-form-group">
<view class="grid col-4 grid-square flex-sub">
<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
<image :src="imgList[index]" mode="aspectFill"></image>
<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
<text class='cuIcon-close'></text>
<view class="cu-form-group">
<view class="grid col-4 grid-square flex-sub" style="border-bottom: 2rpx solid #ebedf0;">
<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
<image :src="imgList[index]" mode="aspectFill"></image>
<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
<text class='cuIcon-close'></text>
</view>
</view>
<view class="solids" style="width: 182rpx;height: 182rpx;" @tap="ChooseImage" v-if="imgList.length<1">
<image src="../../static/image/no_upload@2x.png" style="width: 182rpx;height: 182rpx;" mode=""></image>
</view>
</view>
<view class="solids" style="width: 182rpx;height: 182rpx;" @tap="ChooseImage" v-if="imgList.length<1">
<image src="../../static/image/no_upload@2x.png" style="width: 182rpx;height: 182rpx;" mode=""></image>
</view>
<view style="width: 230rpx;color: #b1b2b3;">
(上传身份证正面)
</view>
<view class="cu-bar bg-white">
<view class="action">
法人身份证
</view>
</view>
</view>
<view class="cu-form-group" style="border-top: none;">
<view class="grid col-4 grid-square flex-sub">
<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
<image :src="imgList[index]" mode="aspectFill"></image>
<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
<text class='cuIcon-close'></text>
<view class="cu-form-group">
<view class="grid col-4 grid-square flex-sub">
<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
<image :src="imgList[index]" mode="aspectFill"></image>
<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
<text class='cuIcon-close'></text>
</view>
</view>
<view class="solids" style="width: 182rpx;height: 182rpx;" @tap="ChooseImage" v-if="imgList.length<1">
<image src="../../static/image/no_upload@2x.png" style="width: 182rpx;height: 182rpx;" mode=""></image>
</view>
<view style="width: 230rpx;color: #b1b2b3;">
(上传身份证正面)
</view>
</view>
<view class="solids" style="width: 182rpx;height: 182rpx;" @tap="ChooseImage" v-if="imgList.length<1">
<image src="../../static/image/no_upload@2x.png" style="width: 182rpx;height: 182rpx;" mode=""></image>
</view>
<view style="width: 230rpx;color: #b1b2b3;">
(上传身份证反面)
</view>
</view>
</view>
<view class="cu-bar margin-top" style="display: flex;justify-content: center;">
<view style="background: #2e7ff9;border-radius: 80rpx;height: 80rpx;width: 686rpx;color: #fff;text-align: center;line-height: 80rpx;">
立即提交
<view class="cu-form-group" style="border-top: none;">
<view class="grid col-4 grid-square flex-sub">
<view class="bg-img" v-for="(item,index) in imgList" :key="index" @tap="ViewImage" :data-url="imgList[index]">
<image :src="imgList[index]" mode="aspectFill"></image>
<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
<text class='cuIcon-close'></text>
</view>
</view>
<view class="solids" style="width: 182rpx;height: 182rpx;" @tap="ChooseImage" v-if="imgList.length<1">
<image src="../../static/image/no_upload@2x.png" style="width: 182rpx;height: 182rpx;" mode=""></image>
</view>
<view style="width: 230rpx;color: #b1b2b3;">
(上传身份证反面)
</view>
</view>
</view>
</view>
</form>
<view class="cu-bar margin-top" style="display: flex;justify-content: center;">
<view style="background: #2e7ff9;border-radius: 80rpx;height: 80rpx;width: 686rpx;color: #fff;text-align: center;line-height: 80rpx;">
立即提交
</view>
</view>
</view>
</template>
... ... @@ -167,7 +171,10 @@
}
</script>
<style>
<style lang="scss">
page{
background-color: $uni-bg-color-hui;
}
.cu-form-group .title {
min-width: calc(4em + 30px);
}
... ...
<template>
<view>
<view class="loginTitle">
企业登录
</view>
<view class="formWrap">
<view class="formItem">
<view class="itemLeft">
+86
<image src="../../static/image/down.png" mode=""></image>
</view>
<input type="text" value="" placeholder="请输入手机号"/>
</view>
<view class="formItem">
<view class="itemLeft">
验证码
</view>
<input type="text" value="" placeholder="请输入验证码"/>
<!-- 条件判断显示倒计时秒数（59s） -->
<view class="codeBtn" :class="{active:sendCode}">
获取验证码
</view>
</view>
</view>
<view class="loginBtnWrap">
<view class="loginBtn">
下一步
</view>
</view>
<view class="phoneWrap">
客服电话 40036-456-4454
</view>
</view>
</template>
<script>
export default{
data(){
return{
sendCode:true
}
}
}
</script>
<style lang="scss">
page{
background-color: $uni-bg-color-hui;
}
.loginTitle{
height: 120rpx;
line-height: 120rpx;
padding: 0 32rpx;
font-size: 44rpx;
color: $uni-bg-main-color;
background: $uni-bg-bai-color;
}
.formWrap{
margin-top: 30rpx;
background: $uni-bg-bai-color;
padding: 0 32rpx;
.formItem{
height: 110rpx;
border-bottom: 1rpx solid #ebedf0;
display: flex;
align-items: center;
.itemLeft{
width: 130rpx;
font-size: $uni-font-size-30;
image{width: 24rpx;height: 24rpx;margin-left: 10rpx;}
}
input{flex: 1;}
.codeBtn{
width: 148rpx;
height: 50rpx;
border: 1rpx solid #2e7ff9;
border-radius: 21rpx;
font-size: $uni-font-size-26;
color: $uni-bg-main-color;
line-height: 50rpx;
text-align: center;
}
.codeBtn.active{
border: 1rpx solid #dcdee0;
color: #dcdee0;
}
}
.formItem:nth-of-type(2){border-bottom:none;}
}
.loginBtnWrap{
padding-top: 100rpx;
display: flex;
justify-content: center;
.loginBtn{
width: 686rpx;
height: 88rpx;
background: $uni-bg-main-color;
border-radius: 96rpx;
text-align: center;
color: $uni-bg-bai-color;
line-height: 88rpx;
font-size: $uni-font-size-32;
}
}
.phoneWrap{
position: fixed;
bottom: 34rpx;
width: 750rpx;
text-align: center;
font-size: $uni-font-size-26;
color: $uni-text-color-hui;
}
</style>
... ...
... ... @@ -7,7 +7,7 @@
</view>
<!-- 单位简介区域 -->
<view class="unitDescWrap">
<img-txt-title :imgUrl="'../static/image/index/ic_87@2x.png'" :txtInfo="'单位简介'"></img-txt-title>
<img-txt-title :imgSize="48" :imgUrl="'../../static/image/index/ic_4@2x.png'" :txtInfo="'企业介绍'"></img-txt-title>
<view class="unitDesc">
中国冶金地质总局成立于1952年，隶属国务院国有资产监督管理委员会，是中央管理的地质勘查单位，肩负着提高资源保障能力的公益性央企，主要从事固体矿产地质勘查、研究、开发、服务，超硬材料生产及机械装备制造。资产总额230多亿元。 中国冶金地质下属11个局院（中心）、6个控股公司，队伍驻地分布在全国20个省、自治区和直辖市。 　　宗旨和业务范围：为国家冶金地质工作提供管理保障；固体矿产地质勘查、研究、开发、服务；超硬材料生产及机械设备研制；冶金地质勘查发展规划和规章制度制定；冶金地质行业标准研究；冶金地质勘查业务管理；相关地质勘查组织实施；所属地质单位队伍管理；国外重要地质矿产勘查；找矿理论和勘查技术等相关研究，提供技术服务
</view>
... ... @@ -19,52 +19,59 @@
></video>
</view>
</view>
<!-- 单位案例区域 -->
<!-- 主要产品区域 -->
<view class="unitCaseWrap">
<img-txt-title :imgUrl="'../static/image/index/ic_88@2x.png'" :txtInfo="'单位案例'"></img-txt-title>
<view class="unitCase">
<view class="caseItem">
<image src="../../static/image/del/ic_90@2x.png" mode="aspectFill"></image>
<view class="companyName">
杭州传媒有限公司
</view>
<view class="imgTxtTitle">
<view class="titleLeft">
<image src="../../static/image/index/ic_6@2x.png" style="width:48rpx;height:48rpx;" mode=""></image>
主要产品
</view>
<view class="caseItem">
<image src="../../static/image/del/ic_90@2x.png" mode="aspectFill"></image>
<view class="companyName">
杭州传媒有限公司杭州传媒有限公司
</view>
<view class="titleRight">
查看更多
<image src="../../static/image/ic_7@2x.png" mode=""></image>
</view>
<view class="caseItem">
<image src="../../static/image/del/ic_90@2x.png" mode="aspectFill"></image>
<view class="companyName">
杭州传媒有限公司
</view>
<view class="productItem">
<view class="productLeft">
<view class="productName">
自主研发核心技术
</view>
</view>
<view class="caseItem">
<image src="../../static/image/del/ic_90@2x.png" mode="aspectFill"></image>
<view class="companyName">
杭州传媒有限公司
<view class="productDesc">
多层次主动防御系统＋自主知识产权多层次主动防御＋自主知识产权多层次主动防御＋自主知识产权多层次主动防御
</view>
</view>
<view class="productRight">
<image src="../../static/image/del/ic_90@2x.png" mode=""></image>
</view>
</view>
</view>
<!-- 底部按钮区域 -->
<view class="bottomBtnWrap">
<view class="companyReplyBtn" @click="$href('replyDesc')">
企业入驻
<view class="productItem">
<view class="productLeft">
<view class="productName">
自主研发核心技术
</view>
<view class="productDesc">
多层次主动防御系统＋自主知识产权多层次主动防御＋自主知识产权多层次主动防御＋自主知识产权多层次主动防御
</view>
</view>
<view class="productRight">
<image src="../../static/image/del/ic_90@2x.png" mode=""></image>
</view>
</view>
<view class="loginBtnList">
<view class="loginBtnItem company">
<image src="../../static/image/index/ic_91@2x.png" mode=""></image>
企业登录
<view class="productItem">
<view class="productLeft">
<view class="productName">
自主研发核心技术
</view>
<view class="productDesc">
多层次主动防御系统＋自主知识产权多层次主动防御＋自主知识产权多层次主动防御＋自主知识产权多层次主动防御
</view>
</view>
<view class="loginBtnItem complat">
<image src="../../static/image/index/ic_92@2x.png" mode=""></image>
平台员工登录
<view class="productRight">
<image src="../../static/image/del/ic_90@2x.png" mode=""></image>
</view>
</view>
</view>
</view>
</view>
... ... @@ -136,65 +143,62 @@
}
}
}
// 单位案例区域
// 主要产品区域
.unitCaseWrap{
padding: 20rpx 30rpx 0 30rpx;
.unitCase{
padding: 20rpx 30rpx 32rpx 30rpx;
.imgTxtTitle{
height: 108rpx;
display: flex;
flex-wrap: wrap;
.caseItem{
margin-right: 20rpx;
margin-top: 10rpx;
image{width: 216rpx;height: 136rpx;}
.companyName{
width: 216rpx;
font-size: $uni-font-size-24;
font-weight: 600;
line-height: $uni-font-lh-40;
text-align: center;
align-items: center;
justify-content: space-between;
.titleLeft{
display: flex;
align-items: center;
justify-content: space-between;
image{margin-right: 16rpx;}
font-size: $uni-font-size-40;
}
.titleRight{
display: flex;
align-items: center;
justify-content: space-between;
color: #d2d2d5;
image{width: 28rpx;height: 28rpx;}
}
}
.productItem{
height: 218rpx;
padding: 32rpx 0 32rpx 0;
display: flex;
border-bottom: 2rpx solid #ebedf0;
.productLeft{
width: 428rpx;
.productName{
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp:1;
-webkit-box-orient:vertical;
font-size: $uni-font-size-36;
}
.productDesc{
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
padding-top: 24rpx;
color: $uni-text-color-hui;
font-size: $uni-font-size-28;
}
}
.caseItem:nth-of-type(3n){margin-right: 0;}
}
}
// 底部按钮区域
.bottomBtnWrap{
padding: 100rpx 60rpx 66rpx 60rpx;
.companyReplyBtn{
height: 80rpx;
border: 2rpx solid #969799;
border-radius: 82rpx;
line-height: 40rpx;
font-size: $uni-font-size-32;
line-height: 80rpx;
text-align: center;
}
.loginBtnList{
padding-top: 44rpx;
display: flex;
.loginBtnItem{
height: 80rpx;
.productRight{
flex: 1;
display: flex;
justify-content: center;
align-items: center;
image{width: $uni-img-size-32;height: $uni-img-size-32;margin-right: 12rpx;}
color: $uni-text-color-bai;
font-size: $uni-font-size-32;
}
.loginBtnItem.company{
background: $uni-bg-main-color;
border-radius: $uni-border-radius-80 0rpx 0rpx $uni-border-radius-80;
}
.loginBtnItem.complat{
background: $uni-bg-color-lv;
border-radius: 0rpx $uni-border-radius-80 $uni-border-radius-80 0;
justify-content: flex-end;
image{width: 230rpx;height: 130rpx;border-radius: 20rpx;}
}
}
}
</style>
... ...
<template>
<view>
<!-- 轮播图区域 -->
<view class="swiperBgWrap">
<u-swiper @change="change" :height="326" :list="list" :title="title" :effect3d="effect3d"
:indicator-pos="indicatorPos" :mode="mode" :interval="3000" @click="click"></u-swiper>
</view>
<!-- 单位简介区域 -->
<view class="unitDescWrap">
<img-txt-title :imgSize="44" :imgUrl="'../../static/image/index/ic_87@2x.png'" :txtInfo="'单位简介'"></img-txt-title>
<view class="unitDesc">
中国冶金地质总局成立于1952年，隶属国务院国有资产监督管理委员会，是中央管理的地质勘查单位，肩负着提高资源保障能力的公益性央企，主要从事固体矿产地质勘查、研究、开发、服务，超硬材料生产及机械装备制造。资产总额230多亿元。 中国冶金地质下属11个局院（中心）、6个控股公司，队伍驻地分布在全国20个省、自治区和直辖市。 　　宗旨和业务范围：为国家冶金地质工作提供管理保障；固体矿产地质勘查、研究、开发、服务；超硬材料生产及机械设备研制；冶金地质勘查发展规划和规章制度制定；冶金地质行业标准研究；冶金地质勘查业务管理；相关地质勘查组织实施；所属地质单位队伍管理；国外重要地质矿产勘查；找矿理论和勘查技术等相关研究，提供技术服务
</view>
<view class="companyVideo">
<video
id="myVideo"
src="https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/%E7%AC%AC1%E8%AE%B2%EF%BC%88uni-app%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D%EF%BC%89-%20DCloud%E5%AE%98%E6%96%B9%E8%A7%86%E9%A2%91%E6%95%99%E7%A8%8B@20200317.mp4"
controls
></video>
</view>
</view>
<!-- 单位案例区域 -->
<view class="unitCaseWrap">
<img-txt-title :imgSize="44" :imgUrl="'../../static/image/index/ic_88@2x.png'" :txtInfo="'单位案例'"></img-txt-title>
<view class="unitCase">
<view class="caseItem">
<image src="../../static/image/del/ic_90@2x.png" mode="aspectFill"></image>
<view class="companyName">
杭州传媒有限公司
</view>
</view>
<view class="caseItem">
<image src="../../static/image/del/ic_90@2x.png" mode="aspectFill"></image>
<view class="companyName">
杭州传媒有限公司杭州传媒有限公司
</view>
</view>
<view class="caseItem">
<image src="../../static/image/del/ic_90@2x.png" mode="aspectFill"></image>
<view class="companyName">
杭州传媒有限公司
</view>
</view>
<view class="caseItem">
<image src="../../static/image/del/ic_90@2x.png" mode="aspectFill"></image>
<view class="companyName">
杭州传媒有限公司
</view>
</view>
</view>
</view>
<!-- 底部按钮区域 -->
<view class="bottomBtnWrap">
<view class="companyReplyBtn" @click="$href('replyDesc')">
企业入驻
</view>
<view class="loginBtnList">
<view class="loginBtnItem company">
<image src="../../static/image/index/ic_91@2x.png" mode=""></image>
企业登录
</view>
<view class="loginBtnItem complat">
<image src="../../static/image/index/ic_92@2x.png" mode=""></image>
平台员工登录
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import imgTxtTitle from '@/components/imgTxtTitle.vue'
export default {
data() {
return {
list: [{
image: 'https://cdn.uviewui.com/uview/swiper/1.jpg',
title: '昨夜星辰昨夜风，画楼西畔桂堂东'
},
{
image: 'https://cdn.uviewui.com/uview/swiper/2.jpg',
title: '身无彩凤双飞翼，心有灵犀一点通'
},
{
image: 'https://cdn.uviewui.com/uview/swiper/3.jpg',
title: '谁念西风独自凉，萧萧黄叶闭疏窗，沉思往事立残阳'
}
],
title: false,
mode: 'round',
indicatorPos: 'bottomCenter',
effect3d: false,
}
},
components:{
imgTxtTitle
},
onLoad() {
},
methods: {
change(index) {
// console.log(index);
}
}
}
</script>
<style lang="scss" scoped>
// 轮播图背景区域
.swiperBgWrap{
height: 352rpx;
background: linear-gradient(180deg,$uni-bg-main-color, $uni-bg-bai-color, $uni-bg-bai-color);
padding: 20rpx 32rpx 0 32rpx;
}
// 单位简介区域
.unitDescWrap{
margin: 20rpx 32rpx 0 32rpx;
background: #ffffff;
border-radius: 20rpx;
box-shadow: 0rpx 2rpx 16rpx 0rpx rgba(97,97,97,0.05);
.unitDesc{
padding: 0 24rpx;
font-size: $uni-font-size-28;
color: $uni-text-color-hui;
line-height: $uni-font-lh-40;
}
.companyVideo{
padding: 32rpx;
video{
width: 100%;
border-radius: $uni-border-radius-20;
height: 300rpx;
}
}
}
// 单位案例区域
.unitCaseWrap{
padding: 20rpx 30rpx 0 30rpx;
.unitCase{
display: flex;
flex-wrap: wrap;
.caseItem{
margin-right: 20rpx;
margin-top: 10rpx;
image{width: 216rpx;height: 136rpx;}
.companyName{
width: 216rpx;
font-size: $uni-font-size-24;
font-weight: 600;
line-height: $uni-font-lh-40;
text-align: center;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp:1;
-webkit-box-orient:vertical;
}
}
.caseItem:nth-of-type(3n){margin-right: 0;}
}
}
// 底部按钮区域
.bottomBtnWrap{
padding: 100rpx 60rpx 66rpx 60rpx;
.companyReplyBtn{
height: 80rpx;
border: 2rpx solid #969799;
border-radius: 82rpx;
line-height: 40rpx;
font-size: $uni-font-size-32;
line-height: 80rpx;
text-align: center;
}
.loginBtnList{
padding-top: 44rpx;
display: flex;
.loginBtnItem{
height: 80rpx;
flex: 1;
display: flex;
justify-content: center;
align-items: center;
image{width: $uni-img-size-32;height: $uni-img-size-32;margin-right: 12rpx;}
color: $uni-text-color-bai;
font-size: $uni-font-size-32;
}
.loginBtnItem.company{
background: $uni-bg-main-color;
border-radius: $uni-border-radius-80 0rpx 0rpx $uni-border-radius-80;
}
.loginBtnItem.complat{
background: $uni-bg-color-lv;
border-radius: 0rpx $uni-border-radius-80 $uni-border-radius-80 0;
}
}
}
</style>
... ...
<template>
<view>
<view class="bgWrap">
<view class="replyDesc">
<view class="title">
自主研发核心技术
</view>
<view class="subTitle">
产品发布时间:2020/10/1
</view>
<view class="replySmDesc">
目前，飞凡积分联盟很有规模了，跟金融、航空、通讯、互联网、商旅领域中排名前列的多家知名企业建立了战略合作关系，已有6900多家商户签约联盟。 单单是现阶段，这个联盟所覆盖的会员数量已经达到亿级，联盟合作伙伴整体积分存量达到百亿级园区第二届纳米专项科技领军人才黄克宙创业（成长型）项目，注册资金5108万元，拥有独特的“电化学纳米高纯铝粉制备工艺”和“纳米材料分散体系”技术。 专业从事高纯纳米氧化铝材料的研发和中试，产品可作为高端蓝宝石衬底专用原料用于LED等领域。 在苏州纳米城定建8000平方米的研发、中试和总部大楼。
</view>
<view class="imgList">
<image src="../../static/image/del/ic_90@2x.png" mode=""></image>
<image src="../../static/image/del/ic_90@2x.png" mode=""></image>
<image src="../../static/image/del/ic_90@2x.png" mode=""></image>
</view>
</view>
</view>
</view>
</template>
<script>
export default{
data(){
return{
}
}
}
</script>
<style lang="scss">
page{
background-color: $uni-bg-color-hui;
}
.bgWrap{
height: 174rpx;
background: $uni-bg-main-color;
padding: 30rpx 32rpx 0 30rpx;
.replyDesc{
background: #ffffff;
border-radius: 24rpx;
padding: 0 32rpx 40rpx 32rpx;
margin-bottom: 50rpx;
.title{
height: 104rpx;
font-size: $uni-font-size-40;
font-weight: 600;
line-height: 120rpx;
}
.subTitle{
color: #969799;
font-size: $uni-font-size-24;
}
.replySmDesc{
padding-top: 24rpx;
font-size: $uni-font-size-26;
line-height: $uni-font-lh-40;
color: $uni-text-color-hui;
}
.imgList{
image{width: 622rpx;height: 246rpx;margin-top: 32rpx;}
}
}
}
</style>
... ...
<template>
<view class="productList">
<view class="productItem">
<view class="productLeft">
<view class="productName">
自主研发核心技术
</view>
<view class="productDesc">
多层次主动防御系统＋自主知识产权多层次主动防御＋自主知识产权多层次主动防御＋自主知识产权多层次主动防御
</view>
</view>
<view class="productRight">
<image src="../../static/image/del/ic_90@2x.png" mode=""></image>
</view>
</view>
<view class="productItem">
<view class="productLeft">
<view class="productName">
自主研发核心技术
</view>
<view class="productDesc">
多层次主动防御系统＋自主知识产权多层次主动防御＋自主知识产权多层次主动防御＋自主知识产权多层次主动防御
</view>
</view>
<view class="productRight">
<image src="../../static/image/del/ic_90@2x.png" mode=""></image>
</view>
</view>
<view class="productItem">
<view class="productLeft">
<view class="productName">
自主研发核心技术
</view>
<view class="productDesc">
多层次主动防御系统＋自主知识产权多层次主动防御＋自主知识产权多层次主动防御＋自主知识产权多层次主动防御
</view>
</view>
<view class="productRight">
<image src="../../static/image/del/ic_90@2x.png" mode=""></image>
</view>
</view>
</view>
</template>
<script>
</script>
<style lang="scss">
page{
background-color: $uni-bg-color-hui;
}
.productList{
padding: 1rpx 32rpx 32rpx 32rpx;
.productItem{
margin-top: 32rpx;
height: 218rpx;
padding: 32rpx;
display: flex;
background: $uni-bg-bai-color;
.productLeft{
flex: 1;
.productName{
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp:1;
-webkit-box-orient:vertical;
font-size: $uni-font-size-36;
}
.productDesc{
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
padding-top: 24rpx;
color: $uni-text-color-hui;
font-size: $uni-font-size-28;
}
}
.productRight{
width: 250rpx;
display: flex;
justify-content: flex-end;
image{width: 230rpx;height: 130rpx;border-radius: 20rpx;}
}
}
}
</style>
... ...
<template>
<view>
<view class="formWrap">
<view class="formItem">
<view class="itemLeft">
新密码
</view>
<input type="text" value="" placeholder="请输入新密码"/>
</view>
<view class="formItem">
<view class="itemLeft">
确认密码
</view>
<input type="text" value="" placeholder="请确认密码"/>
</view>
</view>
<view class="loginBtnWrap">
<view class="loginBtn">
修改
</view>
</view>
<view class="simpleAlertWrap" v-if="showSimpleAlert">
<view class="simpleAlert">
<view class="alertInfo">
新密码与确认密码不符
</view>
<view class="btn" @click="showSimpleAlert = false">
确认
</view>
</view>
</view>
</view>
</template>
<script>
export default{
data(){
return{
showSimpleAlert:true,
}
}
}
</script>
<style lang="scss">
page{
background-color: $uni-bg-color-hui;
}
.formWrap{
background: $uni-bg-bai-color;
padding: 0 32rpx;
.formItem{
height: 110rpx;
border-bottom: 1rpx solid #ebedf0;
display: flex;
align-items: center;
.itemLeft{
width: 150rpx;
font-size: $uni-font-size-30;
image{width: 24rpx;height: 24rpx;margin-left: 10rpx;}
}
input{flex: 1;}
}
.formItem:nth-of-type(2){border-bottom:none;}
}
.loginBtnWrap{
padding-top: 100rpx;
display: flex;
justify-content: center;
.loginBtn{
width: 686rpx;
height: 88rpx;
background: $uni-bg-main-color;
border-radius: 96rpx;
text-align: center;
color: $uni-bg-bai-color;
line-height: 88rpx;
font-size: $uni-font-size-32;
}
}
.simpleAlertWrap{
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: $uni-bg-color-mask;
display: flex;
justify-content: center;
align-items: center;
.simpleAlert{
width: 622rpx;
background: $uni-bg-bai-color;
border-radius: 32rpx;
font-size: $uni-font-size-32;
.alertInfo{
padding: 48rpx;
text-align: center;
border-bottom: 1rpx solid #ebedf0;
}
.btn{
height: 96rpx;
line-height: 96rpx;
text-align: center;
color: $uni-bg-main-color;
}
}
}
</style>
... ...
<template>
<view>
<!-- 用户信息区域 -->
<view class="userInfoWrap">
<image src="../../static/image/del/ic_90@2x.png" mode="aspectFill"></image>
黑河边境经济
</view>
<!-- 操作区域 -->
<view class="handleWrap">
<view class="handleItem">
<view class="itemLeft">
<image src="../../static/image/my/ic_20@2x.png" mode=""></image>
消息
</view>
<view class="infoNum">
7
</view>
</view>
<view class="handleItem">
<view class="itemLeft">
<image src="../../static/image/my/ic_21@2x.png" mode=""></image>
个人中心
</view>
<image src="../../static/image/ic_7@2x.png" mode=""></image>
</view>
<view class="handleItem">
<view class="itemLeft">
<image src="../../static/image/my/ic_22@2x.png" mode=""></image>
我的产品
</view>
<image src="../../static/image/ic_7@2x.png" mode=""></image>
</view>
<view class="handleItem">
<view class="itemLeft">
<image src="../../static/image/my/ic_23@2x.png" mode=""></image>
我的需求
</view>
<image src="../../static/image/ic_7@2x.png" mode=""></image>
</view>
<view class="handleItem">
<view class="itemLeft">
<image src="../../static/image/my/ic_24@2x.png" mode=""></image>
厂房管理
</view>
<image src="../../static/image/ic_7@2x.png" mode=""></image>
</view>
<view class="handleItem">
<view class="itemLeft">
<image src="../../static/image/my/ic_25@2x.png" mode=""></image>
操作指南
</view>
<image src="../../static/image/ic_7@2x.png" mode=""></image>
</view>
<view class="handleItem" style="border-bottom: none;">
<view class="itemLeft">
<image src="../../static/image/my/ic_26@2x.png" mode=""></image>
客服电话
</view>
<view class="itemRight">
<image src="../../static/image/my/ic_27@2x.png" mode=""></image>
40046-144584
</view>
</view>
</view>
<!-- 底部按钮区域 -->
<view class="loginBtnWrap">
<view class="loginBtn">
退出登录
</view>
</view>
</view>
</template>
<script>
</script>
<style lang="scss" scoped>
/* 用户信息区域 */
.userInfoWrap{
height: 180rpx;
background: $uni-bg-main-color;
padding: 0 32rpx;
display: flex;
align-items: center;
image{width: 116rpx;height: 116rpx;border-radius: 50%;margin-right: 20rpx;}
font-size: $uni-font-size-40;
color: $uni-text-color-bai;
}
/* 操作区域 */
.handleWrap{
padding: 0 32rpx;
.handleItem{
height: 104rpx;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 2rpx solid #ebedf0;
.itemLeft{
display: flex;
align-items: center;
font-size: $uni-font-size-28;
image{width: $uni-img-size-32;height: $uni-img-size-32;margin-right: 24rpx;}
}
.itemRight{
display: flex;
align-items: center;
font-size: $uni-font-size-28;
color: #969799;
image{width: $uni-img-size-32;height: $uni-img-size-32;margin-right: 10rpx;}
}
.infoNum{
width: 32rpx;
height: 32rpx;
background: #ff2f2f;
border-radius: 50%;
text-align: center;
line-height: 32rpx;
font-size: $uni-font-size-26;
color: $uni-text-color-bai;
}
image{width: $uni-img-size-32;height: $uni-img-size-32;}
}
}
/* 底部按钮区域 */
.loginBtnWrap{
padding-top: 100rpx;
display: flex;
justify-content: center;
.loginBtn{
width: 686rpx;
height: 88rpx;
background: #f7f8fa;
border-radius: 96rpx;
text-align: center;
color: $uni-bg-main-color;
line-height: 88rpx;
font-size: $uni-font-size-32;
}
}
</style>
... ...
<template>
<view>
<!-- 操作区域 -->
<view class="handleWrap">
<view class="handleItem">
<view class="itemLeft">
公司名称
</view>
<view class="itemRight">
海尔公司
</view>
</view>
<view class="handleItem">
<view class="itemLeft">
法人
</view>
<view class="itemRight">
王某人
</view>
</view>
<view class="handleItem">
<view class="itemLeft">
手机号
</view>
<view class="itemRight">
13962568952
</view>
</view>
<view class="handleItem">
<view class="itemLeft">
联系人
</view>
<view class="itemRight">
张某人
</view>
</view>
<view class="handleItem">
<view class="itemLeft">
手机号
</view>
<view class="itemRight">
13962568562
</view>
</view>
<view class="handleItem">
<view class="itemLeft">
入驻时间
</view>
<view class="itemRight">
2019年8月12日
</view>
</view>
<view class="handleItem">
<view class="itemLeft">
到期时间
</view>
<view class="itemRight">
2021年8月11日
</view>
</view>
<view class="handleItem">
<view class="itemLeft">
合同管理
</view>
<image src="../../static/image/ic_7@2x.png" mode=""></image>
</view>
<view class="handleItem">
<view class="itemLeft">
企业介绍
</view>
<image src="../../static/image/ic_7@2x.png" mode=""></image>
</view>
<view class="handleItem">
<view class="itemLeft">
账号
</view>
<view class="itemRight">
kk21212121
</view>
</view>
<view class="handleItem">
<view class="itemLeft">
修改密码
</view>
<image src="../../static/image/ic_7@2x.png" mode=""></image>
</view>
<view class="handleItem" style="border-bottom: none;">
<view class="itemLeft" style="width: 232rpx;">
厂房到期服务通知
</view>
<switch style="transform: scale(0.8);" color="#2e7ff9"/>
</view>
</view>
</view>
</template>
<script>
export default{
data(){
return{
switchB: true
}
},
methods:{
SwitchB(e) {
this.switchB = e.detail.value
},
}
}
</script>
<style lang="scss" scoped>
/* 操作区域 */
.handleWrap{
padding: 0 32rpx;
.handleItem{
height: 104rpx;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 2rpx solid #ebedf0;
.itemLeft{
display: flex;
align-items: center;
font-size: $uni-font-size-28;
width: 202rpx;
font-weight: 600;
image{width: $uni-img-size-32;height: $uni-img-size-32;margin-right: 24rpx;}
}
.itemRight{
flex: 1;
display: flex;
align-items: center;
font-size: $uni-font-size-28;
image{width: $uni-img-size-32;height: $uni-img-size-32;margin-right: 10rpx;}
}
.infoNum{
width: 32rpx;
height: 32rpx;
background: #ff2f2f;
border-radius: 50%;
text-align: center;
line-height: 32rpx;
font-size: $uni-font-size-26;
color: $uni-text-color-bai;
}
image{width: $uni-img-size-32;height: $uni-img-size-32;}
}
}
</style>
... ...