123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195 |
- <template>
- <mobile-frame>
- <view class="main">
- <view class="one">
- <uni-forms ref="form" :modelValue="form" :rules="rules" label-width="auto">
- <uni-forms-item label="姓名" required name="name">
- <uni-easyinput type="text" v-model="form.name" placeholder="请输入真实姓名" />
- </uni-forms-item>
- <uni-forms-item label="身份证号" required name="card">
- <uni-easyinput type="text" v-model="form.card" placeholder="请输入身份证号" />
- </uni-forms-item>
- <uni-forms-item label="手机号" required name="phone">
- <uni-easyinput type="text" v-model="form.phone" placeholder="请输入手机号" />
- </uni-forms-item>
- <uni-forms-item label="确认" required name="is_affirm">
- <uni-data-checkbox v-model="form.is_affirm" :localdata="affirmList"
- style="position: relative;top: 7px;" />
- </uni-forms-item>
- </uni-forms>
- <view class="btn">
- <button type="primary" @click="onSubmit('form')" size="mini">提交</button>
- <button type="primary" @click="toApply" size="mini">申请记录</button>
- </view>
- <view class="config">
- <rich-text :nodes="config&&config.leader_rule"></rich-text>
- </view>
- </view>
- </view>
- </mobile-frame>
- </template>
- <script>
- export default {
- data() {
- return {
- // 系统设置
- config: {},
- form: {},
- rules: {
- name: {
- rules: [{
- required: true,
- errorMessage: '请填写真实姓名',
- }]
- },
- card: {
- rules: [{
- required: true,
- errorMessage: '请填写身份证',
- }]
- },
- phone: {
- rules: [{
- required: true,
- errorMessage: '请填写手机号码',
- }]
- },
- is_affirm: {
- rules: [{
- required: true,
- errorMessage: '请确认团长申请',
- }]
- },
- },
- // 是否确认
- affirmList: [ //
- {
- text: '是',
- value: 0
- }, {
- text: '否',
- value: 1
- }
- ]
- };
- },
- onLoad: function(e) {
- const that = this;
- that.watchLogin();
- },
- methods: {
- watchLogin() {
- const that = this;
- uni.getStorage({
- key: 'token',
- success: async (res) => {
- let user = that.$jwt(res.data);
- if (user) {
- that.$set(that, `form`, {
- user_id: user.id,
- openid: user.openid,
- phone: user.phone
- })
- }
- // 系统设置
- let config = await that.$api(`/config`, 'GET', {});
- if (config.errcode == '0') {
- if (config.data.leader_rule) config.data.leader_rule = config.data.leader_rule.replace(/\<img/gi,
- '<img class="rich-img"');
- that.$set(that, `config`, config.data);
- }
- },
- fail: (err) => {}
- })
- },
- // 提交保存
- onSubmit(ref) {
- const that = this;
- that.$refs[ref].validate().then(async params => {
- if (params.is_affirm == '1') {
- uni.showToast({
- title: '请确认团长申请',
- icon: 'none'
- })
- } else {
- const arr = await that.$api(`/userleader`, 'POST', that.form);
- if (arr.errcode == '0') {
- uni.showToast({
- title: `团长身份申请成功`,
- icon: 'success',
- });
- that.back();
- } else {
- uni.showToast({
- title: arr.errmsg,
- })
- }
- }
- })
- },
- // 团长记录
- toApply() {
- uni.navigateTo({
- url: `/pagesMy/apply/index`
- })
- },
- // 返回
- back() {
- uni.navigateBack({
- delta: 1
- })
- },
- },
- }
- </script>
- <style lang="scss">
- .main {
- display: flex;
- flex-direction: column;
- width: 100vw;
- height: 100vh;
- .one {
- padding: 2vw;
- .uni-input {
- border: #f1f1ff 1px solid;
- padding: 2vw 2vw;
- border-radius: 1vw;
- }
- .btn {
- text-align: center;
- margin: 0 0 1vw 0;
- button {
- margin: 0 2vw 2vw 2vw;
- background-color: #23B67A;
- color: var(--fffColor);
- }
- .name {
- color: var(--f85Color);
- font-size: var(--font14Size);
- }
- }
- .config{
- .rich-img {
- width: 100% !important;
- display: block;
- }
- }
- }
- }
- .uni-forms-item {
- margin-bottom: 6vw !important;
- display: flex;
- flex-direction: row;
- }
- </style>
|