|
|
- <template>
- <view class="team">
- <!-- logo -->
- <div class="logo">
- 打卡系统
- </div>
-
- <!-- 标题 -->
- <view class="login-title">工程项目打卡系统</view>
-
- <!-- 团队选择表单 -->
- <view class="team-form">
- <view class="team-form-item">
- <view class="title">团队</view>
- <view class="select">
- <uni-data-select
- v-model="form.teamId"
- :localdata="range"
- style="width: 600rpx;font-size: 30rpx;"
- :clear="false"></uni-data-select>
- </view>
- </view>
- <view class="team-form-item">
- <view class="title">姓名</view>
- <view class="name-input">
- <input type="text" placeholder="请输入姓名" v-model="form.name"/>
- </view>
- </view>
- </view>
-
- <uv-popup ref="popup" :round="30">
- <view class="content-popup">
-
- </view>
- </uv-popup>
-
- <!-- 提交审核 -->
- <div @click="submit" class="btn">
- 提交审核
- </div>
- </view>
- </template>
-
- <script>
- import { mapState } from 'vuex'
- export default {
- name: "Team",
- data() {
- return {
- range: [],
- form : {
- name : '',
- teamId : '',
- },
- }
- },
- computed : {
- ...mapState(['teamList', 'userInfo']),
- },
- onLoad() {
- let team = []
-
- this.teamList.forEach(n => {
- team.push({
- value: n.id,
- text: n.name
- })
- })
-
- this.range = team
- },
- methods: {
- submit() {
- // this.$refs.popup.open()
- // return
-
- if (this.$utils.verificationAll(this.form, {
- teamId : '请选择团队',
- name : '请输入姓名',
- })) {
- return
- }
-
- this.$api('teamApply', this.form, res => {
- if(res.code == 200){
- uni.reLaunch({
- url: '/pages/index/index'
- })
- }
- })
- }
- }
- }
- </script>
-
- <style lang="scss" scoped>
- .content-popup{
- padding: 40rpx;
- display: flex;
- flex-direction: column;
- align-items: center;
- width: 600rpx;
- }
- .team {
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
- min-height: 100vh;
- background: white;
- /deep/ .uni-select__input-text{
- font-size: 30rpx !important;
- }
-
- // logo
- .logo {
- display: flex;
- align-items: center;
- justify-content: center;
- padding: 20rpx 0rpx;
- width: 40%;
- color: white;
- background: linear-gradient(180deg, #4C9EEA, #6DB9FF);
- border-radius: 45rpx 13rpx 45rpx 13rpx;
- font-size: 60rpx;
- }
-
- // 标题
- .login-title {
- font-size: 40rpx;
- font-weight: bold;
- margin: 20rpx 0rpx;
- }
-
- // 团队选择表单
- .team-form {
- width: 83%;
- margin: 30rpx auto;
-
- .team-form-item {
- display: flex;
- align-items: center;
- justify-content: space-between;
- border-bottom: 1px solid #CBCBCB;
- margin: 30rpx 0rpx;
-
- &:nth-child(2) {
- margin-top: 50rpx;
- }
-
- .title {}
-
- .select,
- .name-input {
- display: flex;
- justify-content: flex-end;
- width: 40%;
- font-size: 32rpx;
-
- input {
- width: 100%;
- }
- }
-
- &::v-deep .uni-select {
- border: none;
- padding: 0rpx;
- }
- }
- }
-
- // 提交审核
- .btn {
- display: flex;
- align-items: center;
- justify-content: center;
- width: 83%;
- background: $main-color;
- color: white;
- height: 100rpx;
- border-radius: 50rpx;
- margin: 120rpx auto 0rpx auto;
- }
- }
- </style>
|