Browse Source

常用功能菜单

dev
luyan 12 months ago
parent
commit
a81a89fe62
  1. 22
      src/views/modules/workPc/customer-add-or-update.vue
  2. 68
      src/views/modules/workPc/menu-add-or-update.vue
  3. 86
      src/views/modules/workPc/menu.vue
  4. 109
      src/views/modules/workPc/setpwd.vue

22
src/views/modules/workPc/customer-add-or-update.vue

@ -1,23 +1,15 @@
<template>
<el-dialog :visible.sync="visible"
:title="'选择客户'"
:close-on-click-modal="false"
:close-on-press-escape="false"
<el-dialog :visible.sync="visible" :title="'选择客户'" :close-on-click-modal="false" :close-on-press-escape="false"
:top="diaTop">
<div class="customerDiv"
:style="{height:diaHeight+'px'}">
<div class="customerDiv" :style="{ height: diaHeight + 'px' }">
<el-checkbox :indeterminate="isIndeterminate"
v-model.trim="checkAll"
<el-checkbox :indeterminate="isIndeterminate" v-model.trim="checkAll"
@change="handleCheckAllChange">全选</el-checkbox>
<el-checkbox-group v-model.trim="menuListShow"
@change="handleCheckedCitiesChange">
<el-checkbox-group v-model.trim="menuListShow" @change="handleCheckedCitiesChange">
<el-checkbox v-for="(item,index) in customerList "
:key="index"
class="customerItem"
<el-checkbox v-for="(item, index) in customerList " :key="index" class="customerItem"
:label="item.customerId">{{ item.customerName }}</el-checkbox>
</el-checkbox-group>
@ -26,8 +18,7 @@
<template slot="footer">
<el-button @click="visible = false">{{ $t('cancel') }}</el-button>
<el-button type="primary"
@click="saveMenuList()">{{ $t('confirm') }}</el-button>
<el-button type="primary" @click="saveMenuList()">{{ $t('confirm') }}</el-button>
</template>
</el-dialog>
</template>
@ -192,6 +183,7 @@ export default {
margin-left: 100px;
overflow-y: scroll;
}
.customerItem {
display: block;
margin: 20px;

68
src/views/modules/workPc/menu-add-or-update.vue

@ -1,6 +1,8 @@
<template>
<el-dialog :visible.sync="visible" :title="!dataForm.id ? $t('add') : $t('update')" :close-on-click-modal="false" :close-on-press-escape="false">
<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmitHandle()" label-width="120px">
<el-dialog :visible.sync="visible" :title="!dataForm.id ? $t('add') : $t('update')" :close-on-click-modal="false"
:close-on-press-escape="false">
<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmitHandle()"
label-width="120px">
<el-form-item prop="type" :label="$t('menu.type')" size="mini">
<el-radio-group v-model.trim="dataForm.type" :disabled="!!dataForm.id">
<el-radio :label="0">{{ $t('menu.type0') }}</el-radio>
@ -11,20 +13,17 @@
<el-input v-model.trim="dataForm.name" :placeholder="$t('menu.name')"></el-input>
</el-form-item>
<el-form-item prop="parentName" :label="$t('menu.parentName')" class="menu-list">
<el-popover v-model.trim="menuListVisible" ref="menuListPopover" placement="bottom-start" trigger="click">
<el-tree
:data="menuList"
:props="{ label: 'name', children: 'children' }"
node-key="id"
ref="menuListTree"
:highlight-current="true"
:expand-on-click-node="false"
accordion
<el-popover v-model.trim="menuListVisible" ref="menuListPopover" placement="bottom-start"
trigger="click">
<el-tree :data="menuList" :props="{ label: 'name', children: 'children' }" node-key="id"
ref="menuListTree" :highlight-current="true" :expand-on-click-node="false" accordion
@current-change="menuListTreeCurrentChangeHandle">
</el-tree>
</el-popover>
<el-input v-model.trim="dataForm.parentName" v-popover:menuListPopover :readonly="true" :placeholder="$t('menu.parentName')">
<i v-if="dataForm.pid !== '0'" slot="suffix" @click.stop="deptListTreeSetDefaultHandle()" class="el-icon-circle-close el-input__icon"></i>
<el-input v-model.trim="dataForm.parentName" v-popover:menuListPopover :readonly="true"
:placeholder="$t('menu.parentName')">
<i v-if="dataForm.pid !== '0'" slot="suffix" @click.stop="deptListTreeSetDefaultHandle()"
class="el-icon-circle-close el-input__icon"></i>
</el-input>
</el-form-item>
<el-form-item v-if="dataForm.type === 0" prop="url" :label="$t('menu.url')">
@ -37,38 +36,39 @@
</el-radio-group>
</el-form-item>
<el-form-item prop="sort" :label="$t('menu.sort')">
<el-input-number v-model.trim="dataForm.sort" controls-position="right" :min="0" :label="$t('menu.sort')"></el-input-number>
<el-input-number v-model.trim="dataForm.sort" controls-position="right" :min="0"
:label="$t('menu.sort')"></el-input-number>
</el-form-item>
<el-form-item v-if="dataForm.type === 0" prop="icon" :label="$t('menu.icon')" class="icon-list">
<el-popover v-model.trim="iconListVisible" ref="iconListPopover" placement="bottom-start" trigger="click" popper-class="mod-sys__menu-icon-popover">
<el-popover v-model.trim="iconListVisible" ref="iconListPopover" placement="bottom-start"
trigger="click" popper-class="mod-sys__menu-icon-popover">
<div class="mod-sys__menu-icon-inner">
<div class="mod-sys__menu-icon-list">
<el-button
v-for="(item, index) in iconList"
:key="index"
<el-button v-for="(item, index) in iconList" :key="index"
@click="iconListCurrentChangeHandle(item)"
:class="{ 'is-active': dataForm.icon === item }">
<svg class="icon-svg" aria-hidden="true"><use :xlink:href="`#${item}`"></use></svg>
<svg class="icon-svg" aria-hidden="true">
<use :xlink:href="`#${item}`"></use>
</svg>
</el-button>
</div>
</div>
</el-popover>
<el-input v-model.trim="dataForm.icon" v-popover:iconListPopover :readonly="true" :placeholder="$t('menu.icon')"></el-input>
<el-input v-model.trim="dataForm.icon" v-popover:iconListPopover :readonly="true"
:placeholder="$t('menu.icon')"></el-input>
</el-form-item>
<el-form-item v-if="dataForm.type === 1" prop="permissions" :label="$t('menu.permissions')">
<el-input v-model.trim="dataForm.permissions" :placeholder="$t('menu.permissionsTips')"></el-input>
</el-form-item>
<el-form-item
v-for="(item, index) in dataForm.resourceList"
:key="item.key"
<el-form-item v-for="(item, index) in dataForm.resourceList" :key="item.key"
:prop="`resourceList.${index}.resourceUrl`"
:rules="{ required: true, message: $t('validate.required'), trigger: 'blur' }"
:label="index === 0 ? $t('menu.resource') : ''"
class="resource-list">
:label="index === 0 ? $t('menu.resource') : ''" class="resource-list">
<el-row>
<el-col :span="22">
<el-input v-model.trim="item.resourceUrl" :placeholder="$t('menu.resourceUrl')">
<el-select v-model.trim="item.resourceMethod" slot="prepend" :placeholder="$t('menu.resourceMethod')">
<el-select v-model.trim="item.resourceMethod" slot="prepend"
:placeholder="$t('menu.resourceMethod')">
<el-option label="GET" value="GET"></el-option>
<el-option label="POST" value="POST"></el-option>
<el-option label="PUT" value="PUT"></el-option>
@ -77,12 +77,15 @@
</el-input>
</el-col>
<el-col :span="2" class="text-center">
<el-button @click="resourceDeleteHandle(item)" size="small" type="text">{{ $t('delete') }}</el-button>
<el-button @click="resourceDeleteHandle(item)" size="small" type="text">{{ $t('delete')
}}</el-button>
</el-col>
</el-row>
</el-form-item>
<el-form-item :label="dataForm.resourceList==null || dataForm.resourceList.length <= 0 ? $t('menu.resource') : ''">
<el-button @click="resourceAddHandle()" class="aui-button--dashed w-percent-100">{{ $t('menu.resourceAddItem') }}</el-button>
<el-form-item
:label="dataForm.resourceList == null || dataForm.resourceList.length <= 0 ? $t('menu.resource') : ''">
<el-button @click="resourceAddHandle()" class="aui-button--dashed w-percent-100">{{
$t('menu.resourceAddItem') }}</el-button>
</el-form-item>
</el-form>
<template slot="footer">
@ -235,30 +238,37 @@ export default {
text-align: center;
}
}
.menu-list,
.icon-list {
.el-input__inner,
.el-input__suffix {
cursor: pointer;
}
}
&-icon-popover {
width: 458px;
overflow: hidden;
}
&-icon-inner {
width: 478px;
max-height: 258px;
overflow-x: hidden;
overflow-y: auto;
}
&-icon-list {
width: 458px;
padding: 0;
margin: -8px 0 0 -8px;
>.el-button {
padding: 8px;
margin: 8px 0 0 8px;
>span {
display: inline-block;
vertical-align: middle;

86
src/views/modules/workPc/menu.vue

@ -1,89 +1,49 @@
<template>
<el-card shadow="never"
class="aui-card--fill">
<el-card shadow="never" class="aui-card--fill">
<div class="mod-sys__menu">
<el-form :inline="true"
:model="dataForm"
@keyup.enter.native="getDataList()">
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
<el-form-item>
<el-button type="primary"
@click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
<el-button type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
</el-form-item>
</el-form>
<el-table v-loading="dataListLoading"
:data="dataList"
row-key="id"
border
:height="tableHeight"
<el-table v-loading="dataListLoading" :data="dataList" row-key="id" border :height="tableHeight"
style="width: 100%;">
<el-table-column prop="name"
:label="$t('menu.name')"
header-align="center"
<el-table-column prop="name" :label="$t('menu.name')" header-align="center"
min-width="150"></el-table-column>
<el-table-column prop="icon"
:label="$t('menu.icon')"
header-align="center"
align="center">
<el-table-column prop="icon" :label="$t('menu.icon')" header-align="center" align="center">
<template slot-scope="scope">
<svg class="icon-svg"
aria-hidden="true">
<svg class="icon-svg" aria-hidden="true">
<use :xlink:href="`#${scope.row.icon}`"></use>
</svg>
</template>
</el-table-column>
<el-table-column prop="type"
:label="$t('menu.type')"
header-align="center"
align="center">
<el-table-column prop="type" :label="$t('menu.type')" header-align="center" align="center">
<template slot-scope="scope">
<el-tag v-if="scope.row.type === 0"
size="small">{{ $t('menu.type0') }}</el-tag>
<el-tag v-else
size="small"
type="info">{{ $t('menu.type1') }}</el-tag>
<el-tag v-if="scope.row.type === 0" size="small">{{ $t('menu.type0') }}</el-tag>
<el-tag v-else size="small" type="info">{{ $t('menu.type1') }}</el-tag>
</template>
</el-table-column>
<el-table-column prop="sort"
:label="$t('menu.sort')"
header-align="center"
<el-table-column prop="sort" :label="$t('menu.sort')" header-align="center"
align="center"></el-table-column>
<el-table-column prop="url"
:label="$t('menu.url')"
header-align="center"
align="center"
width="150"
<el-table-column prop="url" :label="$t('menu.url')" header-align="center" align="center" width="150"
:show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="permissions"
:label="$t('menu.permissions')"
header-align="center"
align="center"
width="150"
:show-overflow-tooltip="true"></el-table-column>
<el-table-column :label="$t('handle')"
fixed="right"
header-align="center"
align="center"
width="150">
<el-table-column prop="permissions" :label="$t('menu.permissions')" header-align="center" align="center"
width="150" :show-overflow-tooltip="true"></el-table-column>
<el-table-column :label="$t('handle')" fixed="right" header-align="center" align="center" width="150">
<template slot-scope="scope">
<el-button type="text"
size="small"
@click="addOrUpdateHandle(scope.row.id)">{{ $t('update') }}</el-button>
<el-button type="text"
size="small"
@click="deleteHandle(scope.row.id)">{{ $t('delete') }}</el-button>
<el-button type="text"
size="small"
@click="showCustomerMenu(scope.row.id)">{{ '客户配置' }}</el-button>
<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">{{ $t('update')
}}</el-button>
<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">{{ $t('delete')
}}</el-button>
<el-button type="text" size="small" @click="showCustomerMenu(scope.row.id)">{{ '客户配置'
}}</el-button>
</template>
</el-table-column>
</el-table>
<!-- 弹窗, 新增 / 修改 -->
<add-or-update v-if="addOrUpdateVisible"
ref="addOrUpdate"
@refreshDataList="getDataList"></add-or-update>
<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
<!-- 客户菜单配置 -->
<customer-add-or-update ref="customerForm"
@refreshDataList="getDataList"></customer-add-or-update>
<customer-add-or-update ref="customerForm" @refreshDataList="getDataList"></customer-add-or-update>
</div>
</el-card>
</template>

109
src/views/modules/workPc/setpwd.vue

@ -1,49 +1,25 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<div class="mod-sys__menu">
<el-form
:inline="true"
:model="dataForm"
@keyup.enter.native="getDataList()"
>
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
<el-form-item>
<el-button type="primary" @click="addOrUpdateHandle()">{{
$t('add')
}}</el-button>
</el-form-item>
</el-form>
<el-table
v-loading="dataListLoading"
:data="dataList"
row-key="id"
border
:height="tableHeight"
style="width: 100%"
>
<el-table-column
prop="name"
:label="$t('menu.name')"
header-align="center"
min-width="150"
></el-table-column>
<el-table-column
prop="icon"
:label="$t('menu.icon')"
header-align="center"
align="center"
>
<el-table v-loading="dataListLoading" :data="dataList" row-key="id" border :height="tableHeight"
style="width: 100%">
<el-table-column prop="name" :label="$t('menu.name')" header-align="center"
min-width="150"></el-table-column>
<el-table-column prop="icon" :label="$t('menu.icon')" header-align="center" align="center">
<template slot-scope="scope">
<svg class="icon-svg" aria-hidden="true">
<use :xlink:href="`#${scope.row.icon}`"></use>
</svg>
</template>
</el-table-column>
<el-table-column
prop="type"
:label="$t('menu.type')"
header-align="center"
align="center"
>
<el-table-column prop="type" :label="$t('menu.type')" header-align="center" align="center">
<template slot-scope="scope">
<el-tag v-if="scope.row.type === 0" size="small">{{
$t('menu.type0')
@ -53,68 +29,27 @@
}}</el-tag>
</template>
</el-table-column>
<el-table-column
prop="sort"
:label="$t('menu.sort')"
header-align="center"
align="center"
></el-table-column>
<el-table-column
prop="url"
:label="$t('menu.url')"
header-align="center"
align="center"
width="150"
:show-overflow-tooltip="true"
></el-table-column>
<el-table-column
prop="permissions"
:label="$t('menu.permissions')"
header-align="center"
align="center"
width="150"
:show-overflow-tooltip="true"
></el-table-column>
<el-table-column
:label="$t('handle')"
fixed="right"
header-align="center"
align="center"
width="150"
>
<el-table-column prop="sort" :label="$t('menu.sort')" header-align="center"
align="center"></el-table-column>
<el-table-column prop="url" :label="$t('menu.url')" header-align="center" align="center" width="150"
:show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="permissions" :label="$t('menu.permissions')" header-align="center" align="center"
width="150" :show-overflow-tooltip="true"></el-table-column>
<el-table-column :label="$t('handle')" fixed="right" header-align="center" align="center" width="150">
<template slot-scope="scope">
<el-button
type="text"
size="small"
@click="addOrUpdateHandle(scope.row.id)"
>{{ $t('update') }}</el-button
>
<el-button
type="text"
size="small"
@click="deleteHandle(scope.row.id)"
>{{ $t('delete') }}</el-button
>
<el-button
type="text"
size="small"
@click="showCustomerMenu(scope.row.id)"
>{{ '客户配置' }}</el-button
>
<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">{{ $t('update')
}}</el-button>
<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">{{ $t('delete')
}}</el-button>
<el-button type="text" size="small" @click="showCustomerMenu(scope.row.id)">{{ '客户配置'
}}</el-button>
</template>
</el-table-column>
</el-table>
<!-- 弹窗, 新增 / 修改 -->
<add-or-update
v-if="addOrUpdateVisible"
ref="addOrUpdate"
@refreshDataList="getDataList"
></add-or-update>
<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
<!-- 客户菜单配置 -->
<customer-add-or-update
ref="customerForm"
@refreshDataList="getDataList"
></customer-add-or-update>
<customer-add-or-update ref="customerForm" @refreshDataList="getDataList"></customer-add-or-update>
</div>
</el-card>
</template>

Loading…
Cancel
Save