弹窗
This commit is contained in:
@@ -18,96 +18,95 @@
|
||||
</tr>
|
||||
<tr v-for="(e, i) in datalist" :key="i">
|
||||
<td>{{i+1}}</td>
|
||||
<td></td>
|
||||
<td>{{e.name}}</td>
|
||||
<td>{{e.name}}</td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td>
|
||||
<div class="row">
|
||||
<button class="button button--primary">修改</button>
|
||||
<button class="button button--primary">分配角色</button>
|
||||
<button class="button button--primary" @click="setPass">重置密码</button>
|
||||
<button class="button button--primary">删除</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<div v-if="active" class="dialog_wrapper">
|
||||
<div class="dialog">
|
||||
<div class="dialog_header">
|
||||
<span class="dialog_title">添加用户</span>
|
||||
<button class="dialog_headerbtn">
|
||||
<i class="iconfont icon_close"></i>
|
||||
</button>
|
||||
<jxDialog
|
||||
ref="child1"
|
||||
title="添加用户">
|
||||
<div class="form">
|
||||
<div class="form_item">
|
||||
<div class="form_item__label"><i>*</i>用户名</div>
|
||||
<div class="form_item__content">
|
||||
<input type="text" class="form_item__input">
|
||||
</div>
|
||||
<div class="dialog_body">
|
||||
<div class="form">
|
||||
<div class="form_item">
|
||||
<div class="form_item__label"><i>*</i>用户名</div>
|
||||
<div class="form_item__content">
|
||||
<input type="text" class="form_item__input">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form_item">
|
||||
<div class="form_item__label">电话</div>
|
||||
<div class="form_item__content">
|
||||
<input type="text" class="form_item__input">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form">
|
||||
<div class="form_item">
|
||||
<div class="form_item__label">姓名</div>
|
||||
<div class="form_item__content">
|
||||
<input type="text" class="form_item__input">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form_item">
|
||||
<div class="form_item__label">性别</div>
|
||||
<div class="form_item__content">
|
||||
<div class="form_item__radio">
|
||||
<div class="radio__input"><i class="iconfont icon_radio icon_radio_checked"></i></div>
|
||||
<div class="radio__label">男</div>
|
||||
</div>
|
||||
<div class="form_item__radio">
|
||||
<div class="radio__input"><i class="iconfont icon_radio"></i></div>
|
||||
<div class="radio__label">女</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form">
|
||||
<div class="form_item">
|
||||
<div class="form_item__label"><i>*</i>密码</div>
|
||||
<div class="form_item__content">
|
||||
<input type="text" class="form_item__input">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form_item">
|
||||
<div class="form_item__label">角色</div>
|
||||
<div class="form_item__content">
|
||||
<el-select v-model="value" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="dialog_footer">
|
||||
<button class="button button--primary" @click="toCancle">取消</button>
|
||||
<button class="button button--primary">确定</button>
|
||||
</div>
|
||||
<div class="form_item">
|
||||
<div class="form_item__label">电话</div>
|
||||
<div class="form_item__content">
|
||||
<input type="text" class="form_item__input">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="active" class="modal"></div>
|
||||
<div class="form">
|
||||
<div class="form_item">
|
||||
<div class="form_item__label">姓名</div>
|
||||
<div class="form_item__content">
|
||||
<input type="text" class="form_item__input">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form_item">
|
||||
<div class="form_item__label">性别</div>
|
||||
<div class="form_item__content">
|
||||
<div class="form_item__radio">
|
||||
<div class="radio__input"><i class="iconfont icon_radio icon_radio_checked"></i></div>
|
||||
<div class="radio__label">男</div>
|
||||
</div>
|
||||
<div class="form_item__radio">
|
||||
<div class="radio__input"><i class="iconfont icon_radio"></i></div>
|
||||
<div class="radio__label">女</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form">
|
||||
<div class="form_item">
|
||||
<div class="form_item__label"><i>*</i>密码</div>
|
||||
<div class="form_item__content">
|
||||
<input type="text" class="form_item__input">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form_item">
|
||||
<div class="form_item__label">角色</div>
|
||||
<div class="form_item__content">
|
||||
<el-select v-model="value" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</jxDialog>
|
||||
<jxDialog ref="child2">确定重置密码吗？</jxDialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import jxDialog from '@components/dialog.vue'
|
||||
export default {
|
||||
components: {
|
||||
jxDialog
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
datalist: [{name: 'a'}, {name: 'a'}, {name: 'a'}, {name: 'a'}, {name: 'a'}, {name: 'a'}, {name: 'a'}, {name: 'ac'}, {name: 'a'}, {name: 'a'}, {name: 'a'}, {name: 'a'}, {name: 'a'}, {name: 'a'}, {name: 'ad'}],
|
||||
datalist: [{name: 'a氪金大佬发家里的饭交流交流'}, {name: 'a'}, {name: 'a'}, {name: 'a'}, {name: 'a'}, {name: 'a'}, {name: 'a'}, {name: 'ac'}, {name: 'a'}, {name: 'a'}, {name: 'a'}, {name: 'a'}, {name: 'a'}, {name: 'a'}, {name: 'ad'}],
|
||||
options: [{
|
||||
value: '选项1',
|
||||
label: '超级管理员'
|
||||
@@ -127,10 +126,10 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
addData () {
|
||||
this.active = true
|
||||
this.$refs.child1.active = true
|
||||
},
|
||||
toCancle () {
|
||||
this.active = false
|
||||
setPass () {
|
||||
this.$refs.child2.active = true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user