Skip to content

A
ant-design-pro-vue
Unverified Commit dbdebca1 by JianFeng Ren (mynuolr)
Options

fix: 登陆->登录 #126

parent b5579dcd
Showing with 199 additions and 199 deletions
src/views/account/settings/BaseSetting.vue
......@@ -38,7 +38,7 @@
<a-input placeholder="h3gSbecd"/>
</a-form-item>
<a-form-item
label="登陆密码"
label="登录密码"
:required="false"
>
<a-input placeholder="密码"/>
......@@ -158,4 +158,4 @@ export default {
overflow: hidden;
}
}
</style>
</style>
src/views/list/TreeList.vue
<template>
<a-card :bordered="false">
<a-row :gutter="8">
<a-col :span="5">
<s-tree
:dataSource="orgTree"
:openKeys.sync="openKeys"
:search="true"
@click="handleClick"
@add="handleAdd"
@titleClick="handleTitleClick"></s-tree>
</a-col>
<a-col :span="19">
<s-table
ref="table"
size="default"
:columns="columns"
:data="loadData"
:alert="false"
:rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
>
<span slot="action" slot-scope="text, record">
<template v-if="$auth('table.update')">
<a @click="handleEdit(record)">编辑</a>
<a-divider type="vertical" />
</template>
<a-dropdown>
<a class="ant-dropdown-link">
更多 <a-icon type="down" />
</a>
<a-menu slot="overlay">
<a-menu-item>
<a href="javascript:;">详情</a>
</a-menu-item>
<a-menu-item v-if="$auth('table.disable')">
<a href="javascript:;">禁用</a>
</a-menu-item>
<a-menu-item v-if="$auth('table.delete')">
<a href="javascript:;">删除</a>
</a-menu-item>
</a-menu>
</a-dropdown>
</span>
</s-table>
</a-col>
</a-row>
<org-modal ref="modal" @ok="handleSaveOk" @close="handleSaveClose" />
</a-card>
</template>
<script>
import STree from '@/components/Tree/Tree'
import STable from '@/components/table/'
import OrgModal from './modules/OrgModal'
import { getOrgTree, getServiceList } from '@/api/manage'
export default {
name: 'TreeList',
components: {
STable,
STree,
OrgModal
},
data () {
return {
openKeys: ['key-01'],
// 查询参数
queryParam: {},
// 表头
columns: [
{
title: '#',
dataIndex: 'no'
},
{
title: '成员名称',
dataIndex: 'description'
},
{
title: '登陆次数',
dataIndex: 'callNo',
sorter: true,
needTotal: true,
customRender: (text) => text + ' 次'
},
{
title: '状态',
dataIndex: 'status',
needTotal: true
},
{
title: '更新时间',
dataIndex: 'updatedAt',
sorter: true
},
{
table: '操作',
dataIndex: 'action',
width: '150px',
scopedSlots: { customRender: 'action' }
}
],
// 加载数据方法 必须为 Promise 对象
loadData: parameter => {
return getServiceList(Object.assign(parameter, this.queryParam))
.then(res => {
return res.result
})
},
orgTree: [],
selectedRowKeys: [],
selectedRows: []
}
},
created () {
getOrgTree().then(res => {
this.orgTree = res.result
})
},
methods: {
handleClick (e) {
console.log('handleClick', e)
this.queryParam = {
key: e.key
}
this.$refs.table.refresh(true)
},
handleAdd (item) {
console.log('add button, item', item)
this.$message.info(`提示：你点了 ${item.key} - ${item.title} `)
this.$refs.modal.add(item.key)
},
handleTitleClick (item) {
console.log('handleTitleClick', item)
},
titleClick (e) {
console.log('titleClick', e)
},
handleSaveOk () {
},
handleSaveClose () {
},
onSelectChange (selectedRowKeys, selectedRows) {
this.selectedRowKeys = selectedRowKeys
this.selectedRows = selectedRows
}
}
}
</script>
<style lang="less">
.custom-tree {
/deep/ .ant-menu-item-group-title {
position: relative;
&:hover {
.btn {
display: block;
}
}
}
/deep/ .ant-menu-item {
&:hover {
.btn {
display: block;
}
}
}
/deep/ .btn {
display: none;
position: absolute;
top: 0;
right: 10px;
width: 20px;
height: 40px;
line-height: 40px;
z-index: 1050;
&:hover {
transform: scale(1.2);
transition: 0.5s all;
}
}
}
</style>
<template>
<a-card :bordered="false">
<a-row :gutter="8">
<a-col :span="5">
<s-tree
:dataSource="orgTree"
:openKeys.sync="openKeys"
:search="true"
@click="handleClick"
@add="handleAdd"
@titleClick="handleTitleClick"></s-tree>
</a-col>
<a-col :span="19">
<s-table
ref="table"
size="default"
:columns="columns"
:data="loadData"
:alert="false"
:rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
>
<span slot="action" slot-scope="text, record">
<template v-if="$auth('table.update')">
<a @click="handleEdit(record)">编辑</a>
<a-divider type="vertical" />
</template>
<a-dropdown>
<a class="ant-dropdown-link">
更多 <a-icon type="down" />
</a>
<a-menu slot="overlay">
<a-menu-item>
<a href="javascript:;">详情</a>
</a-menu-item>
<a-menu-item v-if="$auth('table.disable')">
<a href="javascript:;">禁用</a>
</a-menu-item>
<a-menu-item v-if="$auth('table.delete')">
<a href="javascript:;">删除</a>
</a-menu-item>
</a-menu>
</a-dropdown>
</span>
</s-table>
</a-col>
</a-row>
<org-modal ref="modal" @ok="handleSaveOk" @close="handleSaveClose" />
</a-card>
</template>
<script>
import STree from '@/components/Tree/Tree'
import STable from '@/components/table/'
import OrgModal from './modules/OrgModal'
import { getOrgTree, getServiceList } from '@/api/manage'
export default {
name: 'TreeList',
components: {
STable,
STree,
OrgModal
},
data () {
return {
openKeys: ['key-01'],
// 查询参数
queryParam: {},
// 表头
columns: [
{
title: '#',
dataIndex: 'no'
},
{
title: '成员名称',
dataIndex: 'description'
},
{
title: '登录次数',
dataIndex: 'callNo',
sorter: true,
needTotal: true,
customRender: (text) => text + ' 次'
},
{
title: '状态',
dataIndex: 'status',
needTotal: true
},
{
title: '更新时间',
dataIndex: 'updatedAt',
sorter: true
},
{
table: '操作',
dataIndex: 'action',
width: '150px',
scopedSlots: { customRender: 'action' }
}
],
// 加载数据方法 必须为 Promise 对象
loadData: parameter => {
return getServiceList(Object.assign(parameter, this.queryParam))
.then(res => {
return res.result
})
},
orgTree: [],
selectedRowKeys: [],
selectedRows: []
}
},
created () {
getOrgTree().then(res => {
this.orgTree = res.result
})
},
methods: {
handleClick (e) {
console.log('handleClick', e)
this.queryParam = {
key: e.key
}
this.$refs.table.refresh(true)
},
handleAdd (item) {
console.log('add button, item', item)
this.$message.info(`提示：你点了 ${item.key} - ${item.title} `)
this.$refs.modal.add(item.key)
},
handleTitleClick (item) {
console.log('handleTitleClick', item)
},
titleClick (e) {
console.log('titleClick', e)
},
handleSaveOk () {
},
handleSaveClose () {
},
onSelectChange (selectedRowKeys, selectedRows) {
this.selectedRowKeys = selectedRowKeys
this.selectedRows = selectedRows
}
}
}
</script>
<style lang="less">
.custom-tree {
/deep/ .ant-menu-item-group-title {
position: relative;
&:hover {
.btn {
display: block;
}
}
}
/deep/ .ant-menu-item {
&:hover {
.btn {
display: block;
}
}
}
/deep/ .btn {
display: none;
position: absolute;
top: 0;
right: 10px;
width: 20px;
height: 40px;
line-height: 40px;
z-index: 1050;
&:hover {
transform: scale(1.2);
transition: 0.5s all;
}
}
}
</style>
src/views/user/Login.vue
......@@ -12,7 +12,7 @@
:tabBarStyle="{ textAlign: 'center', borderBottom: 'unset' }"
@change="handleTabClick"
>
<a-tab-pane key="tab1" tab="账号密码登陆">
<a-tab-pane key="tab1" tab="账号密码登录">
<a-form-item>
<a-input
size="large"
......@@ -42,7 +42,7 @@
</a-input>
</a-form-item>
</a-tab-pane>
<a-tab-pane key="tab2" tab="手机号登陆">
<a-tab-pane key="tab2" tab="手机号登录">
<a-form-item>
<a-input size="large" type="text" placeholder="手机号" v-decorator="['mobile', {rules: [{ required: true, pattern: /^1[34578]\d{9}$/, message: '请输入正确的手机号' }], validateTrigger: 'change'}]">
<a-icon slot="prefix" type="mobile" :style="{ color: 'rgba(0,0,0,.25)' }"/>
......@@ -71,7 +71,7 @@
</a-tabs>
<a-form-item>
<a-checkbox v-decorator="['rememberMe']">自动登陆</a-checkbox>
<a-checkbox v-decorator="['rememberMe']">自动登录</a-checkbox>
<router-link
:to="{ name: 'recover', params: { user: 'aaa'} }"
class="forge-password"
......@@ -91,7 +91,7 @@
</a-form-item>
<div class="user-login-other">
<span>其他登陆方式</span>
<span>其他登录方式</span>
<a>
<a-icon class="item-icon" type="alipay-circle"></a-icon>
</a>
......@@ -314,4 +314,4 @@ export default {
}
}
}
</style>
</style>
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