Skip to content

O
OKR
Commit e78d9706 authored by lshan's avatar lshan
Browse files
Options

lishan

parent dd7d41fa
Hide whitespace changes
Inline Side-by-side
Showing with 59 additions and 71 deletions
src/views/file.vue
View file @ e78d9706
......@@ -11,50 +11,37 @@
:path="require('@/assets/icons/search.png')"
/>
</template> -->
<div class="px-4">
<!-- 输入任意文本 -->
<van-cell-group>
<van-field label="真实姓名" :required="true" disabled ></van-field>
<input type="text" maxlength="10">
</van-cell-group>
<br>
<van-cell-group>
<van-field label="职位" disabled />
<input type="text">
</van-cell-group>
<br>
<van-cell-group >
<!-- 输入手机号，调起手机号键盘 -->
<van-field dot label="手机号" v-model="tel" type="tel" input-align="right" />
<!-- 允许输入整数，调起数字键盘 -->
<van-field label="员工编号" v-model="digit" type="digit" input-align="right" />
<van-field label="入职时间" v-model="date" :value="date" input-align="right" @click="show = true" right-icon="ellipsis"></van-field>
<van-calendar v-model="show" :round="false" @confirm="onConfirm" :show-confirm="false" right-icon="ellipsis" :style="{ height: '100% '}" />
</van-cell-group>
<br>
<van-cell-group>
<van-field label="所属部门" right-icon="ellipsis" disabled />
<van-field/>
<van-field/>
</van-cell-group>
<br><br><br><br>
<c-button
round
buttonBg="bg-color-primary"
class="mt-16"
>
生成邀请二维码
</c-button>
</div>
<div class="px-4">
<!-- 姓名/职位 -->
<van-cell-group>
<van-field label="真实姓名" :required="true" :value="remnant1+'/10'" input-align="right" disabled />
<van-field type="text" @input ="descInput1" v-model="desc1" maxlength=10 placeholder="请在这里输入你的真实姓名"/>
</van-cell-group>
<van-cell-group>
<van-field label="职位" :value="remnant2+'/10'" input-align="right" disabled />
<van-field type="text" @input ="descInput2" v-model="desc2" maxlength=10 placeholder="请在这里输入你的职位"/>
</van-cell-group>
<van-cell-group>
<!-- 手机号/员工编号/入职时间-->
<van-field dot label="手机号" v-model="tel" type="tel" input-align="right" placeholder="请输入手机号"/>
<van-field label="员工编号" v-model="digit" type="digit" input-align="right" placeholder="请输入员工编号"/>
<van-field label="入职时间" v-model="date" :value="date"
input-align="right" @click="show = true"
:right-icon="require('@/assets/icons/dot.png')" placeholder="请选择入职时间"/>
<van-calendar v-model="show" :round="false" @confirm="onConfirm" :show-confirm="false" right-icon="ellipsis-v" :style="{ height: '100% '}" />
</van-cell-group>
<van-cell-group>
<van-field label="所属部门" :right-icon="require('@/assets/icons/dot.png')" disabled />
<van-field placeholder="请选择总部门"/>
<van-field placeholder="请选择子部门"/>
</van-cell-group>
<c-button
round
buttonBg="bg-color-primary"
class="mt-16">
生成邀请二维码
</c-button>
</div>
</main-page>
</div>
</template>
......@@ -62,65 +49,66 @@
<script lang="ts">
import Vue from 'vue'
import { Field, Toast } from 'vant';
import { Field, Toast } from 'vant';
import { Calendar } from 'vant';
import { Popup } from 'vant';
import { Cell, CellGroup } from 'vant';
import { NavBar } from 'vant';
import { Icon } from 'vant';
import { RadioGroup, Radio } from 'vant';
import { Cell, CellGroup } from 'vant';
Vue.use(Radio);
Vue.use(RadioGroup);
Vue.use(Icon);
Vue.use(NavBar);
Vue.use(Cell);
Vue.use(CellGroup);
Vue.use(Icon);
Vue.use(Popup);
Vue.use(Calendar);
Vue.use(Field);
export default Vue.extend({
export default Vue.extend({
name: 'TeamFrame',
components: {
'main-page': () => import('@/layout/main-page.vue'),
'c-button': () => import('./components/c-button.vue'),
'c-button': () => import('./components/c-button.vue'),
},
created() {
// console.log(Mock, 'mock')
},
data() {
return {
realname: '',
job:'',
tel: '',
digit: '',
//入职时间
date: '',
show:false,
realname: '',//姓名
remnant1:0,//字数
desc1:'',
remnant2:0,//字数
desc2:'',
job:'',//职位
tel: '',//电话号码
digit: '',//员工编号
date: '',//入职时间
show:false,//日期弹窗
}
},
methods: {
handleClickLeft() {
this.$router.go(-1)
},
descInput1(){
//获取字数
var txtVal1 = this.desc1.length;
this.remnant1 = txtVal1;
},
descInput2(){
//获取字数
var txtVal2 = this.desc2.length;
this.remnant2 = txtVal2;
},
formatDate(date:Date) {
//获取日期
return `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`;
},
onConfirm(date:Date) {
//日期
this.show = false;
this.date = this.formatDate(date);
},
},
}
})
</script>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment