Skip to content

胡锦波 / org-manager-web

Go to a project
Commit b3251ae6 by 胡锦波
Options

1. up

parent 3645121a
Inline Side-by-side
Showing with 814 additions and 21 deletions
src/api/sdk-service.ts
...@@ -54,7 +54,7 @@ class SdkCoreService { ...@@ -54,7 +54,7 @@ class SdkCoreService {
return this.invokeGet(url, config) as Promise<T>; return this.invokeGet(url, config) as Promise<T>;
} }
protected async post<T>(url: string, body: any) { protected async post<T>(url: string, body?: any) {
const config = await this.buildSdkHeaders(); const config = await this.buildSdkHeaders();
return this.invokePost(url, body, config) as Promise<T>; return this.invokePost(url, body, config) as Promise<T>;
} }
...@@ -85,6 +85,21 @@ export interface OrgDepartmentItem extends BaseOrgMemberItem { ...@@ -85,6 +85,21 @@ export interface OrgDepartmentItem extends BaseOrgMemberItem {
children?: OrgDepartmentItem[] | OrgMemberItem[]; children?: OrgDepartmentItem[] | OrgMemberItem[];
} }
export interface AddressItem {
address: string;
city: string;
cityId: string;
county: string;
countyId: string;
default: boolean;
id: string;
mobile: string;
name: string;
oid: string;
province: string;
provinceId: string;
}
export const enum ApplyStatus { export const enum ApplyStatus {
All = '', All = '',
Reject = -1, Reject = -1,
...@@ -180,10 +195,40 @@ class SdkService extends SdkCoreService { ...@@ -180,10 +195,40 @@ class SdkService extends SdkCoreService {
return this.post(`/system/org/${oid}/invoice_title/create`, params); return this.post(`/system/org/${oid}/invoice_title/create`, params);
} }
updateInvoiceTitle(id: string, params: { [key: string]: any }) { public updateInvoiceTitle(id: string, params: { [key: string]: any }) {
const oid = EnterpriseHost.getOid(); const oid = EnterpriseHost.getOid();
return this.post(`/system/org/${oid}/invoice_title/${id}/update`, params); return this.post(`/system/org/${oid}/invoice_title/${id}/update`, params);
} }
public getAddressList() {
const oid = EnterpriseHost.getOid();
return this.get<AddressItem[]>(`/system/org/${oid}/address/list`);
}
public deleteAddress(id: string) {
const oid = EnterpriseHost.getOid();
return this.post(`/system/org/${oid}/address/${id}/delete`);
}
public queryAllTreeLazy(parentId: string | number) {
return this.get(`/general/tree/uniplat_district/node/${parentId}/all/ancestor`);
}
public queryTreeLazy(parentId: string | number) {
return this.post(`/general/tree/uniplat_district/list/lazy`, {
parent: parentId
});
}
public addAddress(params: { [key: string]: any }) {
const oid = EnterpriseHost.getOid();
return this.post(`/system/org/${oid}/address/create`, params);
}
public editAddress(id: string, params: { [key: string]: any }) {
const oid = EnterpriseHost.getOid();
return this.post(`/system/org/${oid}/address/${id}/update`, params);
}
} }
const sdkService = new SdkService(); const sdkService = new SdkService();
......
src/router/direction.ts
...@@ -4,6 +4,7 @@ export enum Direction { ...@@ -4,6 +4,7 @@ export enum Direction {
AddressBook, AddressBook,
ApplicationRecord, ApplicationRecord,
InvoiceTitles, InvoiceTitles,
AddressManagement,
InvoiceRecord, InvoiceRecord,
EnterpriseInfo, EnterpriseInfo,
ApplicationSetting, ApplicationSetting,
......
src/router/index.ts
...@@ -16,14 +16,14 @@ Vue.use(VueRouter); ...@@ -16,14 +16,14 @@ Vue.use(VueRouter);
const routes: Array<RouteConfig> = [ const routes: Array<RouteConfig> = [
{ {
path: "", path: "",
redirect: "/workadmin/addressbook" redirect: "/work-admin/address-book"
}, },
...loginRouters, ...loginRouters,
...entranceRouters, ...entranceRouters,
{ {
path: '/workadmin', path: '/work-admin',
component: () => import('@/views/pages/main.vue'), component: () => import('@/views/pages/main.vue'),
redirect: 'addressbook', redirect: 'address-book',
children: [ children: [
{ {
path: 'home', path: 'home',
...@@ -31,42 +31,47 @@ const routes: Array<RouteConfig> = [ ...@@ -31,42 +31,47 @@ const routes: Array<RouteConfig> = [
meta: { direction: Direction.Home, title: MetaHeader.home }, meta: { direction: Direction.Home, title: MetaHeader.home },
}, },
{ {
path: 'addressbook', path: 'address-book',
component: () => import('@/views/pages/employ-management/address-book/address-book.vue'), component: () => import('@/views/pages/employ-management/address-book/address-book.vue'),
meta: { direction: Direction.AddressBook, title: MetaHeader.employManager.addressBook }, meta: { direction: Direction.AddressBook, title: MetaHeader.employManager.addressBook },
}, },
{ {
path: 'applicationrecord', path: 'application-record',
component: () => import('@/views/pages/employ-management/application-record/application-record.vue'), component: () => import('@/views/pages/employ-management/application-record/application-record.vue'),
meta: { direction: Direction.ApplicationRecord, title: MetaHeader.employManager.applicationRecord }, meta: { direction: Direction.ApplicationRecord, title: MetaHeader.employManager.applicationRecord },
}, },
{ {
path: 'invoicerecord', path: 'invoice-record',
component: () => import('@/views/pages/service-management/invoice-record/invoice-record.vue'), component: () => import('@/views/pages/service-management/invoice-record/invoice-record.vue'),
meta: { direction: Direction.InvoiceRecord, title: MetaHeader.serviceManagement.invoiceRecord }, meta: { direction: Direction.InvoiceRecord, title: MetaHeader.serviceManagement.invoiceRecord },
}, },
{ {
path: 'Invoicetitles', path: 'invoice-titles',
component: () => import('@/views/pages/service-management/invoice-titles/invoice-titles.vue'), component: () => import('@/views/pages/service-management/invoice-titles/invoice-titles.vue'),
meta: { direction: Direction.InvoiceTitles, title: MetaHeader.serviceManagement.invoiceTitles }, meta: { direction: Direction.InvoiceTitles, title: MetaHeader.serviceManagement.invoiceTitles },
}, },
{ {
path: 'orginfo', path: 'address-management',
component: () => import('@/views/pages/service-management/address-management/address-management.vue'),
meta: { direction: Direction.AddressManagement, title: MetaHeader.serviceManagement.invoiceTitles },
},
{
path: 'org-info',
component: () => import('@/views/pages/enterprise-management/enterprise-info/enterprise-info.vue'), component: () => import('@/views/pages/enterprise-management/enterprise-info/enterprise-info.vue'),
meta: { direction: Direction.EnterpriseInfo, title: MetaHeader.enterpriseManagement.enterpriseInfo }, meta: { direction: Direction.EnterpriseInfo, title: MetaHeader.enterpriseManagement.enterpriseInfo },
}, },
{ {
path: 'applysetting', path: 'apply-setting',
component: () => import('@/views/pages/enterprise-management/application-setting/application-setting.vue'), component: () => import('@/views/pages/enterprise-management/application-setting/application-setting.vue'),
meta: { direction: Direction.ApplicationSetting, title: MetaHeader.enterpriseManagement.applicationSetting }, meta: { direction: Direction.ApplicationSetting, title: MetaHeader.enterpriseManagement.applicationSetting },
}, },
{ {
path: 'managersetting', path: 'manager-setting',
component: () => import('@/views/pages/enterprise-management/manager-setting/manager-setting.vue'), component: () => import('@/views/pages/enterprise-management/manager-setting/manager-setting.vue'),
meta: { direction: Direction.ManagerSetting, title: MetaHeader.enterpriseManagement.managerSetting }, meta: { direction: Direction.ManagerSetting, title: MetaHeader.enterpriseManagement.managerSetting },
}, },
{ {
path: 'managerlog', path: 'manager-log',
component: () => import('@/views/pages/enterprise-management/manager-log/manager-log.vue'), component: () => import('@/views/pages/enterprise-management/manager-log/manager-log.vue'),
meta: { direction: Direction.ManagerLog, title: MetaHeader.enterpriseManagement.managerLog }, meta: { direction: Direction.ManagerLog, title: MetaHeader.enterpriseManagement.managerLog },
}, },
......
src/router/meta-header.ts
...@@ -12,6 +12,7 @@ export class MetaHeader { ...@@ -12,6 +12,7 @@ export class MetaHeader {
root: "服务管理", root: "服务管理",
invoiceTitles: '发票抬头', invoiceTitles: '发票抬头',
invoiceRecord: '发票记录', invoiceRecord: '发票记录',
addressManagement: "地址管理",
}; };
public static readonly enterpriseManagement = { public static readonly enterpriseManagement = {
......
src/views/components/svg-icon/image.ts
...@@ -2,7 +2,7 @@ const manager = '<?xml version="1.0" encoding="UTF-8"?><svg width="14px" height= ...@@ -2,7 +2,7 @@ const manager = '<?xml version="1.0" encoding="UTF-8"?><svg width="14px" height=
const application = '<?xml version="1.0" encoding="UTF-8"?><svg width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><title>编组 13备份</title><g id="页面-2" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="账号管理-企业通讯录" transform="translate(-20.000000, -247.000000)" class="_svg-icon" fill="#666666" fill-rule="nonzero"><g id="编组-13备份" transform="translate(20.000000, 247.000000)"><g id="编组" transform="translate(0.000000, 0.800000)"><path d="M0.723121995,3.44245793 C1.1473107,3.41260517 1.51597055,3.7284405 1.55259916,4.15009014 L1.55360577,4.16289063 C1.73140024,6.68457031 3.06529447,8.31634615 5.67325721,9.16739784 L5.75267428,9.19296875 C6.07134916,9.29403546 6.28919772,9.58700421 6.29495192,9.91998197 L6.29507212,9.93348858 L6.29507212,11.8432392 C6.29507212,12.2723257 5.94685998,12.6201923 5.51732272,12.6201923 C5.09208233,12.6201923 4.7465595,12.2792668 4.73967849,11.8560847 L4.73958834,11.8432392 L4.73957332,10.4862831 L4.71198918,10.4759615 C1.84840745,9.38939303 0.248212139,7.32313702 0.00919471154,4.36772837 L0.001953125,4.27208534 C-0.0282301683,3.84405048 0.294651442,3.47261118 0.723121995,3.44245793 Z M13.2191857,3.45748197 C12.794997,3.42762921 12.4263371,3.74346454 12.3897085,4.16511418 L12.3887019,4.17791466 C12.2109075,6.69959435 10.8770132,8.33137019 8.26905048,9.18242188 L8.18963341,9.20799279 C7.87095853,9.3090595 7.65310998,9.60202825 7.64735577,9.93500601 L7.64723558,9.94851262 L7.64723558,11.8582632 C7.64723558,12.2873498 7.99544772,12.6352163 8.42498498,12.6352163 C8.85022536,12.6352163 9.1957482,12.2942909 9.20262921,11.8711088 L9.20271935,11.8582632 L9.20273437,10.5013071 L9.23031851,10.4909856 C12.0939002,9.40441707 13.6940956,7.33816106 13.933113,4.3827524 L13.9403546,4.28710938 C13.9705379,3.85907452 13.6476562,3.48763522 13.2191857,3.45748197 L13.2191857,3.45748197 Z M8.84502704,0 C10.1516827,0 11.1628606,0.99468149 11.1628606,2.2796875 C11.1628606,3.58700421 10.1759465,4.6801232 8.59932392,6.12789964 L8.48432993,6.2331881 L8.36732272,6.33975361 L8.30806791,6.39353966 L8.18808594,6.50211839 L8.06616587,6.61209435 L7.87971755,6.77982272 L7.55976562,7.06702224 L7.31397236,7.28375901 C7.10836839,7.46508413 6.80168269,7.46786358 6.59295373,7.2921274 L6.5832482,7.28375901 L6.33745493,7.06702224 L5.95489784,6.72354267 L5.83106971,6.61210938 L5.64891827,6.44765625 C5.62899289,6.42962679 5.60907602,6.41158793 5.58916767,6.39353966 L5.47115385,6.2863131 C5.45165264,6.26855469 5.43224159,6.25084135 5.41289063,6.2331881 L5.29789663,6.12789964 C3.72130409,4.68013822 2.734375,3.58700421 2.734375,2.2796875 C2.734375,0.99468149 3.74555288,0 5.05220853,0 C5.78970853,0 6.48479567,0.331550481 6.94861779,0.870477764 C7.41240986,0.331565505 8.10754207,0 8.84502704,0 Z" id="形状"></path></g></g></g></g></svg>'; const application = '<?xml version="1.0" encoding="UTF-8"?><svg width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><title>编组 13备份</title><g id="页面-2" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="账号管理-企业通讯录" transform="translate(-20.000000, -247.000000)" class="_svg-icon" fill="#666666" fill-rule="nonzero"><g id="编组-13备份" transform="translate(20.000000, 247.000000)"><g id="编组" transform="translate(0.000000, 0.800000)"><path d="M0.723121995,3.44245793 C1.1473107,3.41260517 1.51597055,3.7284405 1.55259916,4.15009014 L1.55360577,4.16289063 C1.73140024,6.68457031 3.06529447,8.31634615 5.67325721,9.16739784 L5.75267428,9.19296875 C6.07134916,9.29403546 6.28919772,9.58700421 6.29495192,9.91998197 L6.29507212,9.93348858 L6.29507212,11.8432392 C6.29507212,12.2723257 5.94685998,12.6201923 5.51732272,12.6201923 C5.09208233,12.6201923 4.7465595,12.2792668 4.73967849,11.8560847 L4.73958834,11.8432392 L4.73957332,10.4862831 L4.71198918,10.4759615 C1.84840745,9.38939303 0.248212139,7.32313702 0.00919471154,4.36772837 L0.001953125,4.27208534 C-0.0282301683,3.84405048 0.294651442,3.47261118 0.723121995,3.44245793 Z M13.2191857,3.45748197 C12.794997,3.42762921 12.4263371,3.74346454 12.3897085,4.16511418 L12.3887019,4.17791466 C12.2109075,6.69959435 10.8770132,8.33137019 8.26905048,9.18242188 L8.18963341,9.20799279 C7.87095853,9.3090595 7.65310998,9.60202825 7.64735577,9.93500601 L7.64723558,9.94851262 L7.64723558,11.8582632 C7.64723558,12.2873498 7.99544772,12.6352163 8.42498498,12.6352163 C8.85022536,12.6352163 9.1957482,12.2942909 9.20262921,11.8711088 L9.20271935,11.8582632 L9.20273437,10.5013071 L9.23031851,10.4909856 C12.0939002,9.40441707 13.6940956,7.33816106 13.933113,4.3827524 L13.9403546,4.28710938 C13.9705379,3.85907452 13.6476562,3.48763522 13.2191857,3.45748197 L13.2191857,3.45748197 Z M8.84502704,0 C10.1516827,0 11.1628606,0.99468149 11.1628606,2.2796875 C11.1628606,3.58700421 10.1759465,4.6801232 8.59932392,6.12789964 L8.48432993,6.2331881 L8.36732272,6.33975361 L8.30806791,6.39353966 L8.18808594,6.50211839 L8.06616587,6.61209435 L7.87971755,6.77982272 L7.55976562,7.06702224 L7.31397236,7.28375901 C7.10836839,7.46508413 6.80168269,7.46786358 6.59295373,7.2921274 L6.5832482,7.28375901 L6.33745493,7.06702224 L5.95489784,6.72354267 L5.83106971,6.61210938 L5.64891827,6.44765625 C5.62899289,6.42962679 5.60907602,6.41158793 5.58916767,6.39353966 L5.47115385,6.2863131 C5.45165264,6.26855469 5.43224159,6.25084135 5.41289063,6.2331881 L5.29789663,6.12789964 C3.72130409,4.68013822 2.734375,3.58700421 2.734375,2.2796875 C2.734375,0.99468149 3.74555288,0 5.05220853,0 C5.78970853,0 6.48479567,0.331550481 6.94861779,0.870477764 C7.41240986,0.331565505 8.10754207,0 8.84502704,0 Z" id="形状"></path></g></g></g></g></svg>';
const setting = '<?xml version="1.0" encoding="UTF-8"?><svg width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><title>编组 5备份</title><g id="页面-2" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="账号管理-企业通讯录" transform="translate(-20.000000, -497.000000)"><g id="编组-5备份" transform="translate(20.000000, 497.000000)"><rect id="矩形备份-3" x="0" y="0" width="14" height="14"></rect><path class="_svg-icon" d="M7.5,0.288675135 L12.5621778,3.21132487 C12.8715789,3.38995766 13.0621778,3.72008468 13.0621778,4.07735027 L13.0621778,9.92264973 C13.0621778,10.2799153 12.8715789,10.6100423 12.5621778,10.7886751 L7.5,13.7113249 C7.19059892,13.8899577 6.80940108,13.8899577 6.5,13.7113249 L1.43782217,10.7886751 C1.1284211,10.6100423 0.937822174,10.2799153 0.937822174,9.92264973 L0.937822174,4.07735027 C0.937822174,3.72008468 1.1284211,3.38995766 1.43782217,3.21132487 L6.5,0.288675135 C6.80940108,0.11004234 7.19059892,0.11004234 7.5,0.288675135 Z M7,4.3 C5.50883118,4.3 4.3,5.50883118 4.3,7 C4.3,8.49116882 5.50883118,9.7 7,9.7 C8.49116882,9.7 9.7,8.49116882 9.7,7 C9.7,5.50883118 8.49116882,4.3 7,4.3 Z" id="形状结合" fill="#666666"></path></g></g></g></svg>'; const setting = '<?xml version="1.0" encoding="UTF-8"?><svg width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><title>编组 5备份</title><g id="页面-2" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="账号管理-企业通讯录" transform="translate(-20.000000, -497.000000)"><g id="编组-5备份" transform="translate(20.000000, 497.000000)"><rect id="矩形备份-3" x="0" y="0" width="14" height="14"></rect><path class="_svg-icon" d="M7.5,0.288675135 L12.5621778,3.21132487 C12.8715789,3.38995766 13.0621778,3.72008468 13.0621778,4.07735027 L13.0621778,9.92264973 C13.0621778,10.2799153 12.8715789,10.6100423 12.5621778,10.7886751 L7.5,13.7113249 C7.19059892,13.8899577 6.80940108,13.8899577 6.5,13.7113249 L1.43782217,10.7886751 C1.1284211,10.6100423 0.937822174,10.2799153 0.937822174,9.92264973 L0.937822174,4.07735027 C0.937822174,3.72008468 1.1284211,3.38995766 1.43782217,3.21132487 L6.5,0.288675135 C6.80940108,0.11004234 7.19059892,0.11004234 7.5,0.288675135 Z M7,4.3 C5.50883118,4.3 4.3,5.50883118 4.3,7 C4.3,8.49116882 5.50883118,9.7 7,9.7 C8.49116882,9.7 9.7,8.49116882 9.7,7 C9.7,5.50883118 8.49116882,4.3 7,4.3 Z" id="形状结合" fill="#666666"></path></g></g></g></svg>';
export const svgicons = { export const svgIcons = {
manager, manager,
application, application,
setting, setting,
......
src/views/pages/aside-panels/aside-panels.vue
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
@select="changeMenu" @select="changeMenu"
@open="onOpenSub" @open="onOpenSub"
@close="onCloseSub" @close="onCloseSub"
:default-openeds="defaultOpeneds" :default-openeds="defaultOpened"
:default-active="defaultActive" :default-active="defaultActive"
> >
<components <components
...@@ -41,7 +41,7 @@ ...@@ -41,7 +41,7 @@
import { MetaHeader } from "@/router/meta-header"; import { MetaHeader } from "@/router/meta-header";
import { Component, Vue } from "vue-property-decorator"; import { Component, Vue } from "vue-property-decorator";
import SvgIcon from "@/views/components/svg-icon/svg-icon.vue"; import SvgIcon from "@/views/components/svg-icon/svg-icon.vue";
import { svgicons } from "@/views/components/svg-icon/image"; import { svgIcons } from "@/views/components/svg-icon/image";
const SEEEION_SUBMENUS_CACHE = "session-submenus-cache"; const SEEEION_SUBMENUS_CACHE = "session-submenus-cache";
...@@ -57,7 +57,7 @@ ...@@ -57,7 +57,7 @@
@Component({ components: { SvgIcon } }) @Component({ components: { SvgIcon } })
export default class Asidepanels extends Vue { export default class Asidepanels extends Vue {
private defaultActive = MetaHeader.home; private defaultActive = MetaHeader.home;
private defaultOpeneds: string[] = []; private defaultOpened: string[] = [];
private linkLine = "-"; private linkLine = "-";
private items: Menus[] = [ private items: Menus[] = [
// { // {
...@@ -69,7 +69,7 @@ ...@@ -69,7 +69,7 @@
{ {
key: MetaHeader.employManager.root, key: MetaHeader.employManager.root,
title: MetaHeader.employManager.root, title: MetaHeader.employManager.root,
icon: svgicons.manager, icon: svgIcons.manager,
content: [ content: [
{ {
key: Direction.AddressBook, key: Direction.AddressBook,
...@@ -86,19 +86,24 @@ ...@@ -86,19 +86,24 @@
{ {
key: MetaHeader.serviceManagement.root, key: MetaHeader.serviceManagement.root,
title: MetaHeader.serviceManagement.root, title: MetaHeader.serviceManagement.root,
icon: svgicons.application, icon: svgIcons.application,
content: [ content: [
{ {
key: Direction.InvoiceTitles, key: Direction.InvoiceTitles,
direction: Direction.InvoiceTitles, direction: Direction.InvoiceTitles,
title: MetaHeader.serviceManagement.invoiceTitles, title: MetaHeader.serviceManagement.invoiceTitles,
}, },
{
key: Direction.AddressManagement,
direction: Direction.AddressManagement,
title: MetaHeader.serviceManagement.addressManagement,
},
], ],
}, },
{ {
key: MetaHeader.enterpriseManagement.root, key: MetaHeader.enterpriseManagement.root,
title: MetaHeader.enterpriseManagement.root, title: MetaHeader.enterpriseManagement.root,
icon: svgicons.setting, icon: svgIcons.setting,
content: [ content: [
{ {
key: Direction.EnterpriseInfo, key: Direction.EnterpriseInfo,
...@@ -128,7 +133,7 @@ ...@@ -128,7 +133,7 @@
RouterEventer.registerOnRouterChanged(this, () => { RouterEventer.registerOnRouterChanged(this, () => {
this.onRouterChange(); this.onRouterChange();
}).raiseOnRouterChanged(); }).raiseOnRouterChanged();
this.defaultOpeneds = this.getCacheSubMenus(); this.defaultOpened = this.getCacheSubMenus();
} }
private onRouterChange() { private onRouterChange() {
......
src/views/pages/service-management/address-management/adding-address.vue 0 → 100644
<template>
<el-dialog :visible.sync="value" :modal="false" :width="dialogWidth">
<div class="address-selector-container">
<div class="header">
<div class="title">设置地址</div>
<i class="el-icon-close" @click="close"></i>
</div>
<div v-loading="loading">
<div class="form-item">
<div class="item-label">联系人</div>
<div class="item-value">
<el-input
v-model="contact"
placeholder="请输入联系人姓名"
></el-input>
</div>
</div>
<div class="form-item">
<div class="item-label">手机号</div>
<div class="item-value">
<el-input
v-model="phone"
placeholder="请输入手机号"
></el-input>
</div>
</div>
<div class="form-item">
<div class="item-label">所在地区</div>
<div class="item-value">
<CityTree
@update="updateCity"
@onLoading="onLoading"
:addressId="addressId"
></CityTree>
</div>
</div>
<div class="form-item">
<div class="item-label">详细地址</div>
<div class="item-value">
<el-input
v-model="addressDetail"
placeholder="请输入详细地址，如街道、楼层、门牌号等"
></el-input>
</div>
</div>
<div class="d-flex align-items-center default-box">
<div class="radio-img" @click="isDefault = !isDefault">
<!-- <img
v-if="!isDefault"
width="16"
height="16"
src="@/assets/images/attendance/radio_0.png"
/>
<img
v-if="isDefault"
width="16"
height="16"
src="@/assets/images/attendance/radio_1.png"
/> -->
</div>
<div @click="isDefault = !isDefault" class="default-tip">
设为默认地址
</div>
</div>
</div>
<div
class="
footer
d-flex
align-items-center
justify-content-center
buttons-box
"
>
<el-button
size="small"
class="button cancel-button"
@click="close"
>
取消
</el-button>
<el-button
size="small"
type="primary"
class="button sure-button"
@click="confirm"
>
确定
</el-button>
</div>
</div>
</el-dialog>
</template>
<script lang="ts">
import CityTree from "./city-tree.vue";
import DepartmentActor from "@/views/components/department-actor/department-actor";
import { Component, Prop } from "vue-property-decorator";
import { AddressItem, sdkService } from "@/api/sdk-service";
import { popupService } from "@/apppackage/element-upgrades/popup";
@Component({ components: { CityTree } })
export default class AddingAddress extends DepartmentActor {
@Prop({ default: false })
private edit!: boolean;
@Prop({ default: {} })
private info!: AddressItem | { [key: string]: any };
private id = "";
private contact = "";
private phone = "";
private provinceId = "";
private cityId = "";
private regionId = "";
private addressDetail = "";
private isDefault = false;
private addressId = 0;
private loading = true;
protected onOpen() {
if (this.edit && this.info) {
this.id = this.info.id;
this.contact = this.info.name;
this.phone = this.info.mobile;
this.provinceId = this.info.provinceId;
this.cityId = this.info.cityId;
this.regionId = this.info.countyId;
this.addressDetail = this.info.address;
this.isDefault = this.info.default;
this.addressId = +this.regionId || +this.cityId || +this.provinceId;
}
}
protected onClosing() {
this.reset();
}
private confirm() {
if (!this.contact) {
return popupService.toast.error("请输入联系人！");
}
if (!this.phone) {
return popupService.toast.error("请输入手机号！");
}
const isPhone = /^1[0-9]{10}$/.test(this.phone);
if (!isPhone) {
return popupService.toast.error("请输入正确的手机号！");
}
if (!this.addressId) {
return popupService.toast.error("请选择所在区域！");
}
if (!this.addressDetail) {
return popupService.toast.error("请填写详细地址！");
}
if (this.edit) {
this.submitEdit();
} else {
this.submit();
}
}
submit() {
sdkService
.addAddress({
name: this.contact,
mobile: this.phone,
province: this.provinceId || 0,
city: this.cityId || 0,
county: this.regionId || 0,
address: this.addressDetail,
default: this.isDefault,
})
.then(() => {
popupService.toast.success("添加成功!");
this.$emit("reload");
this.reset();
this.close();
})
.catch(popupService.toast.error);
}
submitEdit() {
sdkService
.editAddress(this.id, {
name: this.contact,
mobile: this.phone,
province: this.provinceId || 0,
city: this.cityId || 0,
county: this.regionId || 0,
address: this.addressDetail,
default: this.isDefault,
})
.then(() => {
popupService.toast.success("修改成功!");
this.$emit("reload");
this.close();
})
.catch(popupService.toast.error);
}
reset() {
this.contact = "";
this.phone = "";
this.provinceId = "";
this.cityId = "";
this.regionId = "";
this.addressDetail = "";
this.isDefault = false;
this.addressId = 0;
this.loading = false;
}
updateCity(cityParams: any) {
this.provinceId = cityParams.provinceId;
this.cityId = cityParams.cityId;
this.regionId = cityParams.regionId;
this.addressId = cityParams.lastId;
}
onLoading(loading: boolean) {
this.loading = loading;
}
}
</script>
<style lang="less" scoped>
.address-selector-container {
width: 492px;
background: #ffffff;
// box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.2);
border-radius: 6px;
z-index: 1;
// padding-top: 38px;
// padding-left: 30px;
// padding-right: 30px;
// padding-bottom: 30px;
// height: 580px;
.header {
margin-bottom: 25px;
border-bottom: 1px solid #f1f1f1;
padding-bottom: 10px;
font-size: 18px;
color: #333333;
line-height: 25px;
i {
position: absolute;
font-size: 18px;
top: 20px;
right: 20px;
color: rgba(153, 153, 153, 1);
cursor: pointer;
}
}
.form-item {
margin-bottom: 25px;
.item-label {
font-size: 14px;
color: #333333;
line-height: 20px;
margin-bottom: 10px;
}
.item-value {
/deep/ input {
height: 38px;
}
}
}
.default-box {
cursor: pointer;
.default-tip {
margin-left: 8px;
user-select: none;
position: relative;
top: -1px;
}
}
.footer {
margin-top: 48px;
/deep/ button {
min-width: 96px;
font-size: 14px;
}
}
}
</style>
src/views/pages/service-management/address-management/address-management.vue 0 → 100644
<template>
<div class="address-management-container">
<div class="header d-flex justify-content-between align-items-end">
<div class="title">地址管理</div>
<mg-button @click="add">添加地址</mg-button>
</div>
<div class="table-container">
<el-table
ref="multipleTable"
:data="data"
tooltip-effect="dark"
style="width: 100%"
stripe
class="hrs-table"
>
<el-table-column
fixed
v-for="(item, index) in columns"
:key="`c-${index}`"
:prop="item.prop"
:label="item.label"
align="center"
:width="item.width"
>
<template slot-scope="scope">
<span>{{ scope.row[item.prop] }}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center" :width="150">
<template slot-scope="scope">
<div
class="
d-flex
align-items-center
justify-content-center
"
>
<el-button
type="text"
size="small"
class="handle-button"
@click="edit(scope.row)"
>
编辑
</el-button>
<el-divider direction="vertical"></el-divider>
<el-button
type="text"
size="small"
class="handle-button"
@click="deleteAddress(scope.row.id)"
>
删除
</el-button>
</div>
</template>
</el-table-column>
</el-table>
</div>
<DialogAddress
@reload="getData"
v-model="showDialog"
:edit="isEdit"
:info="info"
></DialogAddress>
</div>
</template>
<script lang="ts">
import { AddressItem, sdkService } from "@/api/sdk-service";
import { popupService } from "@/apppackage/element-upgrades/popup";
import { Component, Vue } from "vue-property-decorator";
import DialogAddress from "./adding-address.vue";
@Component({ components: { DialogAddress } })
export default class AddressManagement extends Vue {
private data: AddressItem[] = [];
private showDialog = false;
private isEdit = false;
private info: AddressItem | { [key: string]: any } = {};
private columns = [
{ label: "联系人", prop: "name", width: "150" },
{ label: "手机号", prop: "mobile", width: "120" },
{ label: "所在地区", prop: "location", width: "300" },
{
label: "详细地址",
prop: "address",
width: "",
},
{
label: "是否默认",
prop: "default4Text",
width: "120",
},
];
created() {
this.getData();
}
private getData() {
sdkService
.getAddressList()
.then((r) => {
const data = r.map((i) => {
const location = `${i.province}${i.city}${i.county}`;
const default4Text = i.default ? "是" : "否";
return {
...i,
location: location,
default4Text: default4Text,
};
});
this.data = [];
this.data.push(...data);
})
.catch(popupService.toast.error);
}
private deleteAddress(id: string) {
this.$notice({
currentTitle: "提示",
message: "是否删除当前地址？",
confirmText: "删除",
cancelText: "取消",
confirm: () => {
sdkService
.deleteAddress(id)
.then(() => {
popupService.toast.success("删除成功");
this.getData();
})
.catch(popupService.toast.error);
},
});
}
add() {
this.showDialog = true;
this.isEdit = false;
this.info = {};
}
edit(info: AddressItem) {
this.showDialog = true;
this.isEdit = true;
this.info = info;
}
}
</script>
<style lang="less" scoped>
@import "~@/css/variables.less";
.address-management-container {
padding-left: 24px;
padding-right: 24px;
.header {
overflow: hidden;
height: 65px;
border-bottom: 1px solid #eee;
padding-bottom: 9px;
.title {
font-size: 18px;
line-height: 30px;
color: #292b33;
.total {
color: #888;
}
}
}
}
</style>
src/views/pages/service-management/address-management/city-tree.vue 0 → 100644
<template>
<div>
<div class="d-flex">
<el-select
v-for="item in data4Model"
:key="`d-${item.type}`"
class="selected-input"
v-model="item.value"
placeholder="请选择"
@change="onChange($event, item.type)"
:disabled="item.disabled"
:loading="item.loading"
>
<el-option
v-for="item in item.data"
:key="item.value + ''"
:label="item.label"
:value="item.value + ''"
>
</el-option>
</el-select>
</div>
</div>
</template>
<script lang="ts">
import { Component, Prop, Vue, Watch } from "vue-property-decorator";
import { popupService } from "@/apppackage/element-upgrades/popup";
import { sdkService } from "@/api/sdk-service";
export interface AreaProperty {
label: string;
value: number;
hasChildren: boolean;
}
export interface EchoAddress extends HTMLElement {
echoAddress: (
provinceId: string,
provinceList: AreaProperty[],
cityId?: string,
cityList?: AreaProperty[],
regionId?: string,
regionList?: AreaProperty[]
) => undefined;
}
const enum RangeType {
Province = "province",
City = "city",
Region = "region",
}
interface ModelItem {
type: RangeType;
value: string;
data: AreaProperty[];
disabled: boolean;
loading: boolean;
cacheValue: string;
}
interface QueryParams {
preId: string | number;
type: RangeType;
model?: ModelItem;
}
@Component({ components: {} })
export default class CityTree extends Vue {
@Prop()
private addressId!: string | number;
@Watch("addressId", { immediate: true })
private onAddressIdChange() {
if (this.addressId) {
this.getAddressInfo();
}
}
private data4Model: ModelItem[] = [
{
type: RangeType.Province,
value: "",
data: [],
disabled: false,
loading: false,
cacheValue: "",
},
{
type: RangeType.City,
value: "",
data: [],
disabled: false,
loading: false,
cacheValue: "",
},
{
type: RangeType.Region,
value: "",
data: [],
disabled: false,
loading: false,
cacheValue: "",
},
];
private isInit = true;
created() {
if (!this.addressId) {
this.$emit("onLoading", false);
this.isInit = false;
this.initRootOptions();
}
}
private getAddressInfo() {
if (!this.isInit) {
return;
}
this.isInit = false;
const id = this.addressId;
sdkService.queryAllTreeLazy(id).then((r: any) => {
if (id !== this.addressId) {
return;
}
if (r && r.idList && r.idList.length) {
const typeList: QueryParams[] = [];
r.idList.forEach((item: any, index: number) => {
this.data4Model[index].cacheValue = item.id;
const preId = index
? this.data4Model[index - 1].cacheValue
: "";
typeList.push({
preId: preId,
type: this.data4Model[index].type,
});
});
this.$emit("onLoading", true);
this.query4All(typeList, true);
}
});
}
private initRootOptions() {
this.query4Id("", RangeType.Province);
}
private onChange(id: number, type: RangeType) {
const index = _.findIndex(this.data4Model, (i) => i.type === type);
const data = _.find(
this.data4Model[index].data,
(i) => i.value + "" === id + ""
);
let currentIndex = 999;
if (data) {
this.data4Model.forEach((item, index) => {
if (item.type === type) {
currentIndex = index;
}
if (currentIndex < index) {
item.disabled = !data.hasChildren;
item.value = "";
}
});
}
const nextModel = this.data4Model[currentIndex + 1];
if (nextModel) {
this.query4Id(id, nextModel.type);
}
this.update();
}
private query4Id(id: number | string, type: RangeType) {
const params = {
preId: id,
type: type,
};
this.query4All([params]);
}
private query4All(params: QueryParams[], all = false) {
params.forEach((p) => {
p.model = _.find(this.data4Model, (i) => i.type === p.type);
if (p.model) {
p.model.loading = true;
}
});
Promise.all(
_.map(params, (i) => {
return this.onQuery(i.preId);
})
)
.then((r: any) => {
if (r && r.length > 0) {
r.forEach((item: any, index: number) => {
const currentModel = params[index].model;
if (currentModel) {
const data: AreaProperty[] = [];
item.forEach((i: any) => {
data.push({
label: i.display,
value: i.id,
hasChildren: i.hasChildren,
});
});
currentModel.data = data;
if (currentModel.cacheValue) {
currentModel.value = currentModel.cacheValue;
currentModel.cacheValue = "";
}
currentModel.loading = false;
}
});
}
})
.catch(popupService.toast.error)
.finally(() => {
all && this.$emit("onLoading", false);
});
}
private onQuery(id: number | string) {
return sdkService.queryTreeLazy(id);
}
private update() {
const provinceId = this.data4Model[0].value;
const cityId = this.data4Model[1].value;
const regionId = this.data4Model[2].value;
const cityParams = {
provinceId,
cityId,
regionId,
lastId: regionId || cityId || provinceId,
};
this.$emit("update", cityParams);
}
}
</script>
<style lang="less" scoped>
@import "~@/css/variables.less";
.selected-input {
margin-right: 10px;
/deep/ i {
line-height: 32px;
}
&:last-child {
margin-right: 0;
}
}
</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 sign in to comment