Commit 6438032c authored by 陈浩玮's avatar 陈浩玮

Merge branch 'feature/chw' into 'master'

Feature/chw

See merge request product/kim3-web-vue/starter-web-vue!31
parents 742d0162 54d62d0f
import { delReq, getReq, postReq, putReq } from '@/utils';
function getOceanusTreeApi(data) {
return getReq('/oceanus/api/v1/categories', data);
}
function addOceanusTreeApi(data) {
return postReq('/oceanus/api/v1/categories', data);
}
function updateOceanusTreeApi(data) {
return putReq('/oceanus/api/v1/categories', data);
}
function delOceanusTreeApi(data) {
return putReq(`/oceanus/api/v1/categories/${data.categoryId}`, data);
}
function addAttributesApi(data) {
return postReq('/oceanus/api/v1/categories/attributes', data);
}
function updateAttributesApi(data) {
return putReq('/oceanus/api/v1/categories/attributes', data);
}
function movementAttributesApi(data) {
return putReq('/oceanus/api/v1/categories/attributes/movement', data);
}
function getEquipmentsTreeApi(data) {
return getReq(`/oceanus/api/v1/equipments/catalogs/${data.catalogId}`, data);
}
export default {
getOceanusTree: getOceanusTreeApi,
addOceanusTree: addOceanusTreeApi,
updateOceanusTree: updateOceanusTreeApi,
delOceanusTree: delOceanusTreeApi,
addAttributes: addAttributesApi,
updateAttributes: updateAttributesApi,
movementAttributes: movementAttributesApi,
getEquipmentsTree: getEquipmentsTreeApi,
};
...@@ -3,6 +3,7 @@ export default { ...@@ -3,6 +3,7 @@ export default {
return { return {
type: 0, type: 0,
form: {}, form: {},
title: '',
}; };
}, },
computed: { computed: {
...@@ -29,7 +30,15 @@ export default { ...@@ -29,7 +30,15 @@ export default {
setData(data, type) { setData(data, type) {
this.form = { ...data }; this.form = { ...data };
this.type = type; this.type = type;
console.log(data, type); if (type === 0) {
this.title = '新增';
} else if (type === 1) {
this.title = '编辑';
} else if (type === 2) {
this.title = '查看';
} else {
this.title = '';
}
}, },
}, },
}; };
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
v-if="btn.type === 'confirm'" v-if="btn.type === 'confirm'"
:cb="btn.after" :cb="btn.after"
:title="btn.title" :title="btn.title"
:onOk="btn.onOk" :onOk="() => btn.onOk && btn.onOk(row)"
:label="btn.label" :label="btn.label"
/> />
<a v-else @click="() => btn.click(row)" v-bind="btn.option">{{ btn.label }}</a> <a v-else @click="() => btn.click(row)" v-bind="btn.option">{{ btn.label }}</a>
...@@ -23,7 +23,7 @@ ...@@ -23,7 +23,7 @@
v-if="btn.type === 'confirm'" v-if="btn.type === 'confirm'"
:cb="btn.after" :cb="btn.after"
:title="btn.title" :title="btn.title"
:onOk="btn.onOk" :onOk="() => btn.onOk && btn.onOk(row)"
:label="btn.label" :label="btn.label"
/> />
<a v-else @click="() => btn.click(row)" v-bind="btn.option">{{ btn.label }}</a> <a v-else @click="() => btn.click(row)" v-bind="btn.option">{{ btn.label }}</a>
...@@ -77,10 +77,10 @@ export default { ...@@ -77,10 +77,10 @@ export default {
return url; return url;
}, },
init() { init() {
this.buttons.map(i => { this.buttons.map((i) => {
i.__hidden__ = i.isHidden && i.isHidden(this.row); i.__hidden__ = i.isHidden && i.isHidden(this.row);
}); });
this.buttonsArr = this.buttons.filter(i => !i.__hidden__); this.buttonsArr = this.buttons.filter((i) => !i.__hidden__);
}, },
}, },
}; };
......
...@@ -32,6 +32,7 @@ export default { ...@@ -32,6 +32,7 @@ export default {
props: { props: {
oncancel: Function, oncancel: Function,
onOk: Function, onOk: Function,
colesAfter: Function,
value: Boolean, value: Boolean,
width: { type: Number, default: 600 }, width: { type: Number, default: 600 },
}, },
...@@ -72,6 +73,7 @@ export default { ...@@ -72,6 +73,7 @@ export default {
// TODO // TODO
} }
this.loading = false; this.loading = false;
this.colesAfter && this.colesAfter();
}, },
}, },
}; };
......
...@@ -15,7 +15,7 @@ ...@@ -15,7 +15,7 @@
</div> </div>
</my-card> </my-card>
<my-card class="tw-mt-3"> <my-card :class="$scopedSlots.search ? 'tw-mt-3' : ''">
<a-space class="tw-mb-2.5"> <a-space class="tw-mb-2.5">
<a-button v-if="addBtn" type="primary" key="add" v-bind="addBtn.options" @click="add"> <a-button v-if="addBtn" type="primary" key="add" v-bind="addBtn.options" @click="add">
{{ addBtn.text || '新建' }} {{ addBtn.text || '新建' }}
...@@ -89,11 +89,16 @@ export default { ...@@ -89,11 +89,16 @@ export default {
formatData: Function, formatData: Function,
noPage: Boolean, noPage: Boolean,
rowSelection: Object, // radio OR checkbox rowSelection: Object, // radio OR checkbox
tableParam: {
type: Object,
default: () => ({}),
},
}, },
data() { data() {
return { return {
initQuery: { initQuery: {
...initQuery, ...initQuery,
...this.tableParam,
}, },
title: '新增', title: '新增',
data: [], data: [],
...@@ -126,6 +131,9 @@ export default { ...@@ -126,6 +131,9 @@ export default {
addVisible(val) { addVisible(val) {
if (!val && this?.addBtn?.onCancel) this.addBtn.onCancel(); if (!val && this?.addBtn?.onCancel) this.addBtn.onCancel();
}, },
tableParam(val) {
this.reset();
},
}, },
mounted() { mounted() {
this.getData(); this.getData();
...@@ -165,14 +173,14 @@ export default { ...@@ -165,14 +173,14 @@ export default {
}, },
async getDataNoPage() { async getDataNoPage() {
const res = await request(this.url, METHOD.GET, this.queryForm); const res = await request(this.url, METHOD.GET, this.queryForm);
if (this.formatData) this.data = this.formatData(res); if (this.formatData) this.data = await this.formatData(res);
else this.data = res; else this.data = res;
}, },
async getDataWithPage() { async getDataWithPage() {
const res = await request(this.url, METHOD.GET, { ...this.initQuery, ...this.queryForm }); const res = await request(this.url, METHOD.GET, { ...this.initQuery, ...this.queryForm });
this.total = res.total; this.total = res.total;
if (this.formatData) this.data = this.formatData(res); if (this.formatData) this.data = await this.formatData(res);
else this.data = res.records; else this.data = res.records;
}, },
...@@ -214,7 +222,7 @@ export default { ...@@ -214,7 +222,7 @@ export default {
}, },
reset() { reset() {
this.queryForm = {}; this.queryForm = {};
this.initQuery = { ...initQuery }; this.initQuery = { ...initQuery, ...this.tableParam };
this.getData(); this.getData();
}, },
pageChange(page) { pageChange(page) {
...@@ -236,6 +244,9 @@ export default { ...@@ -236,6 +244,9 @@ export default {
getTableData() { getTableData() {
return this.data; return this.data;
}, },
setTableData(data) {
this.data = data;
},
}, },
}; };
</script> </script>
<template> <template>
<a-col v-bind="span"> <a-col v-bind="attr">
<a-form-model-item v-bind="layout"> <a-form-model-item v-bind="layout">
<slot /> <slot />
</a-form-model-item> </a-form-model-item>
...@@ -8,9 +8,15 @@ ...@@ -8,9 +8,15 @@
<script> <script>
export default { export default {
props: {
colAttr: {
type: Object,
default: undefined,
},
},
data() { data() {
return { return {
span: { xs: 24, sm: 24, lg: 12, xl: 6 }, attr: this.colAttr ? this.colAttr : { xs: 24, sm: 24, lg: 12, xl: 6 },
layout: { labelCol: { span: 6 }, wrapperCol: { span: 18 }, ...this.$attrs }, layout: { labelCol: { span: 6 }, wrapperCol: { span: 18 }, ...this.$attrs },
}; };
}, },
......
<template>
<div>
<my-card>
<a-row :gutter="[16, 16]">
<a-col :span="24">
<a-select
show-search
v-model="searchValue"
placeholder="input search text"
style="width: 100%"
:default-active-first-option="false"
:show-arrow="false"
:filter-option="false"
:not-found-content="null"
:options="dataSource"
@search="onSearch"
@change="onChange"
/>
</a-col>
<a-col :span="24" class="tw-text-right">
<a-button-group>
<a-button type="primary" ghost @click="add">新增</a-button>
<a-button type="primary" ghost @click="edit">编辑</a-button>
<a-button type="primary" ghost @click="del">删除</a-button>
</a-button-group>
</a-col>
</a-row>
</my-card>
<my-card class="tw-mt-2.5">
<a-row :gutter="[16, 16]">
<a-col :span="24">
<a-tree
:treeData="treeObj.treeData || []"
:replaceFields="replaceFields"
:expandedKeys="expandedKeys"
:selectedKeys="selectedKeys"
@select="onSelect"
@expand="onExpand"
/>
</a-col>
</a-row>
</my-card>
<TreeDrawer ref="TreeDrawer" :refresh="init" />
</div>
</template>
<script>
import Api from '@/api/oceanus';
import { arrayToTree, formatObj } from '@/utils';
import TreeDrawer from './TreeDrawer.vue';
export default {
components: { TreeDrawer },
data() {
return {
searchValue: undefined,
treeObj: {},
replaceFields: { title: 'categoryName', key: 'categoryId', children: 'children' },
selectedKeys: [],
expandedKeys: [],
dataSource: [],
selectedObj: {},
};
},
model: {
prop: 'value',
event: 'change',
},
mounted() {
this.init();
},
methods: {
async init() {
const data = await Api.getOceanusTree();
const expandedKeys = [];
const treeObj = new arrayToTree({
data: data,
rootValue: -1,
parentKey: 'parentCategoryId',
key: 'categoryId',
});
treeObj.data.map((i) => {
if (i.children) {
expandedKeys.push(i.categoryId);
}
});
this.treeObj = treeObj;
this.expandedKeys = expandedKeys;
this.selectedKeys = [treeObj.treeData[0]?.categoryId];
this.selectedObj = treeObj.treeData[0];
this.$emit('change', treeObj.treeData[0]);
},
async onSearch(searchText) {
const dataList = this.treeObj.data;
const newData = dataList.filter((i) => i.categoryName.indexOf(searchText) != -1);
this.dataSource = await formatObj(newData, { label: 'categoryName', value: 'categoryId' });
},
onChange(val) {
const data = this.treeObj.data.find((i) => i.categoryId === val);
delete data.children;
this.selectedObj = data;
this.selectedKeys = [val];
this.searchValue = val;
this.$emit('change', data);
},
onSelect(selectedKeys, { node }) {
if (selectedKeys.length !== 0) {
this.selectedKeys = selectedKeys;
const cueData = node.$props.dataRef;
this.selectedObj = cueData;
this.searchValue = undefined;
this.$emit('change', cueData);
}
},
onExpand(expandedKeys) {
this.expandedKeys = expandedKeys;
},
async view(data = {}, type = 0) {
this.$refs['TreeDrawer']?.open();
this.$nextTick(() => {
this.$refs['TreeDrawer'].setData({ ...data }, type);
});
},
add() {
const { categoryId } = this.selectedObj;
this.view({ parentCategoryId: categoryId }, 0);
},
edit() {
const data = this.selectedObj;
delete data.children;
this.view(data, 1);
},
del() {
const categoryId = this.selectedObj?.categoryId;
if (categoryId) return;
try {
this.Api.delOceanusTree({ categoryId });
this.$message.success('删除成功!');
this.init();
} catch (e) {
this.$message.warning('删除失败!');
}
},
},
};
</script>
<style scoped>
</style>
<template>
<my-table
:style="{ marginTop: 0 }"
url="/oceanus/api/v1/categories/attributes"
:tableParam="{ categoryId: tableParam.categoryId }"
rowKey="key"
ref="table"
:formatData="formatData"
>
<template v-if="tableParam.categoryId !== 1" #search="{ query }">
<my-form-item label="账号" :colAttr="{ span: 12 }">
<a-input placeholder="Basic usage" v-model="query.attributeName" />
</my-form-item>
</template>
<template v-if="tableParam.categoryId !== 1" #buttons>
<a-button type="primary" @click="onAddTableRow">新增</a-button>
</template>
<a-table-column title="属性名称">
<template #default="row">
<a-input v-if="row.editable" v-model="row.attributeName" />
<span v-else>
{{ row.attributeName }}
</span>
</template>
</a-table-column>
<a-table-column title="操作" :width="180">
<template #default="row">
<ActionButton v-if="row.editable" :buttons="editButtons" :row="row" />
<ActionButton v-else :buttons="buttons" :row="row" />
</template>
</a-table-column>
</my-table>
</template>
<script>
import Api from '@/api/oceanus';
import { formatObj } from '@/utils';
import ActionButton from '@/components/action_button/index.vue';
export default {
components: { ActionButton },
props: {
param: Object,
},
watch: {
param(val) {
this.tableParam = val;
},
},
data() {
return {
buttons: [
{
label: '编辑',
click: this.onEditTableRow,
},
{
type: 'confirm',
url: (row) => `/oceanus/api/v1/categories/attributes/${row.attributeId}`,
after: () => this.refreshTable(),
},
{
label: '置顶',
click: async (row) => {
const { attributeId, categoryId } = row;
try {
await Api.movementAttributes({ attributeId, categoryId, moveType: 'TOP' });
this.refreshTable();
this.$message.success('置顶成功!');
} catch (e) {
this.$message.warning('置顶失败!');
}
},
},
{
label: '置底',
click: async (row) => {
const { attributeId, categoryId } = row;
try {
await Api.movementAttributes({ attributeId, categoryId, moveType: 'BOTTOM' });
this.refreshTable();
this.$message.success('置顶成功!');
} catch (e) {
this.$message.warning('置顶失败!');
}
},
},
],
editButtons: [
{
label: '确定',
click: this.onSubmitTableRow,
},
{
type: 'confirm',
label: '取消',
title: '确认是否取消?',
onOk: this.onCancelTableRow,
},
],
tableParam: {},
};
},
methods: {
async formatData(data) {
const newData = await formatObj(data.records, { key: 'attributeId' });
return newData;
},
onAddTableRow() {
const data = this.$refs['table']?.getTableData();
const isEdit = data.find((i) => i.action === 'add');
if (isEdit) return;
const obj = {
editable: true,
key: +new Date(),
attributeName: '',
action: 'add',
categoryId: this.tableParam.categoryId,
viewIndex: 1,
};
this.$refs['table']?.setTableData([obj, ...data]);
},
onCancelTableRow(row) {
const data = this.$refs['table']?.getTableData();
if (row.action === 'add') {
const newData = data.filter((i) => i.key !== row.key);
this.$refs['table']?.setTableData(newData);
}
if (row.action === 'edit') {
const newData = data.map((i) => {
const data = { ...i };
if (i.key === row.key) {
data.editable = false;
delete data.action;
}
return data;
});
this.$refs['table']?.setTableData(newData);
}
},
async onSubmitTableRow(row) {
if (row.attributeName === '') {
return this.$message.warning('请输入属性名称!');
} else {
try {
if (row.action === 'add') {
await Api.addAttributes(row);
}
if (row.action === 'edit') {
await Api.updateAttributes(row);
}
this.refreshTable();
this.$message.success('提交成功!');
} catch (e) {
this.$message.warning('保存失败!');
}
}
},
onEditTableRow(row) {
const data = this.$refs['table']?.getTableData();
const newData = data.map((i) => {
const oData = { ...i };
if (i.key === row.key) {
oData.editable = true;
oData.action = 'edit';
}
return oData;
});
this.$refs['table']?.setTableData(newData);
},
refreshTable() {
this.$refs['table']?.reset();
},
},
};
</script>
<style scoped>
</style>
<template>
<Drawer ref="drawerRef" v-model="visible" :title="title" :onOk="submit" :colesAfter="refresh">
<a-form-model layout="vertical" :model="form" :rules="rules" ref="DrawerForm">
<a-form-model-item label="编码" prop="categoryCode">
<a-input v-model="form.categoryCode" :disabled="isView" />
</a-form-model-item>
<a-form-model-item label="名称" prop="categoryName">
<a-input v-model="form.categoryName" :disabled="isView" />
</a-form-model-item>
<a-form-model-item label="说明" prop="remark">
<a-textarea v-model="form.remark" :disabled="isView" :rows="4" />
</a-form-model-item>
</a-form-model>
</Drawer>
</template>
<script>
import Drawer from '@/components/table/drawer.vue';
import FormMixin from '@/components/FormMixin';
import Api from '@/api/oceanus';
export default {
components: { Drawer },
props: {
refresh: Function,
},
mixins: [FormMixin],
data() {
return {
visible: false,
form: {},
rules: {
categoryCode: [{ required: true, message: 'Please select Activity zone', trigger: 'change' }],
categoryName: [{ required: true, message: 'Please select Activity zone', trigger: 'change' }],
remark: [{ required: true, message: 'Please select Activity zone', trigger: 'change' }],
},
Api,
};
},
async mounted() {},
methods: {
open() {
this.form = {};
this.visible = true;
},
add() {
return Api.addOceanusTree(this.form);
},
edit() {
return Api.updateOceanusTree(this.form);
},
},
};
</script>
<template>
<a-row :gutter="10">
<a-col :span="8">
<LeftTree v-model="treeVale" />
</a-col>
<a-col :span="16">
<RightTable :param="treeVale" />
</a-col>
</a-row>
</template>
<script>
import RightTable from './components/RightTable.vue';
import LeftTree from './components/LeftTree.vue';
export default {
components: { RightTable, LeftTree },
data() {
return {
treeVale: {},
};
},
methods: {},
};
</script>
<template>
<div>
<my-card>
<a-row :gutter="[16, 16]">
<a-col :span="24">
<a-select
show-search
v-model="searchValue"
placeholder="input search text"
style="width: 100%"
:default-active-first-option="false"
:show-arrow="false"
:filter-option="false"
:not-found-content="null"
:options="dataSource"
@search="onSearch"
@change="onChange"
/>
</a-col>
<a-col :span="24" class="tw-text-right">
<a-button-group>
<a-dropdown>
<a-menu slot="overlay">
<a-menu-item key="1" @click="addOrg">新增组织 </a-menu-item>
<a-menu-item key="2" @click="addEqu">新增设备 </a-menu-item>
</a-menu>
<a-button type="primary" ghost>新增 <a-icon type="down" /></a-button>
</a-dropdown>
<a-button
type="primary"
ghost
@click="edit"
:disabled="selectedObj.catalogType !== 'ORGANIZATION'"
>编辑</a-button
>
<a-button type="primary" ghost @click="del">删除</a-button>
</a-button-group>
</a-col>
</a-row>
</my-card>
<my-card class="tw-mt-2.5">
<a-row :gutter="[16, 16]">
<a-col :span="24">
<a-tree
:treeData="treeData"
:replaceFields="replaceFields"
:selectedKeys="selectedKeys"
@select="onSelect"
:load-data="onLoadData"
/>
</a-col>
</a-row>
<TreeDrawer ref="TreeDrawer" :refresh="init" />
</my-card>
</div>
</template>
<script>
import Api from '@/api/oceanus';
import { formatObj } from '@/utils';
import TreeDrawer from './TreeDrawer.vue';
export default {
components: { TreeDrawer },
data() {
return {
catalogId: -1,
searchValue: undefined,
dataSource: [],
replaceFields: { title: 'catalogName', key: 'catalogId', children: 'children' },
treeData: [],
selectedKeys: [],
selectedObj: {},
allData: [],
};
},
model: {
prop: 'value',
event: 'change',
},
mounted() {
this.init(this.catalogId);
},
methods: {
async init(id) {
const data = await Api.getEquipmentsTree({ catalogId: id });
this.treeData = data;
this.selectedKeys = [data[0]?.catalogId];
this.selectedObj = data[0];
this.$emit('change', data[0]);
this.allData = [...this.allData, ...data];
},
onLoadData(treeNode) {
return new Promise((resolve) => {
if (treeNode.dataRef.children) {
resolve();
return;
}
Api.getEquipmentsTree({ catalogId: treeNode.dataRef.catalogId }).then((resp) => {
if (resp.length === 0) {
treeNode.dataRef.isLeaf = true;
} else {
this.allData = [...this.allData, ...resp];
const newData = resp.map((i) => {
return {
...i,
isLeaf: i.catalogType !== 'ORGANIZATION',
};
});
treeNode.dataRef.children = newData;
}
this.treeData = [...this.treeData];
resolve();
});
});
},
async onSearch(searchText) {
const dataList = this.allData;
const newData = dataList.filter((i) => i.catalogName.indexOf(searchText) != -1);
this.dataSource = await formatObj(newData, { label: 'catalogName', value: 'catalogId' });
},
onChange(val) {
const data = this.allData.find((i) => i.catalogId === val);
this.selectedObj = data;
this.selectedKeys = [val];
this.searchValue = val;
this.$emit('change', data);
},
onSelect(selectedKeys, { node }) {
if (selectedKeys.length !== 0) {
this.selectedKeys = selectedKeys;
const cueData = node.$props.dataRef;
this.selectedObj = cueData;
this.searchValue = undefined;
this.$emit('change', cueData);
}
},
async view(data = {}, type = 0) {
this.$refs['TreeDrawer']?.open();
this.$nextTick(() => {
this.$refs['TreeDrawer'].setData({ ...data }, type);
});
},
addEqu() {
const { categoryId } = this.selectedObj;
this.view({ parentCategoryId: categoryId }, 0);
},
addOrg() {},
edit() {
const data = this.selectedObj;
delete data.children;
this.view(data, 1);
},
del() {
const categoryId = this.selectedObj?.categoryId;
if (categoryId) return;
try {
this.Api.delOceanusTree({ categoryId });
this.$message.success('删除成功!');
this.init();
} catch (e) {
this.$message.warning('删除失败!');
}
},
},
};
</script>
<template>
<my-table
:style="{ marginTop: 0 }"
url="/oceanus/api/v1/categories/attributes"
:tableParam="{ categoryId: tableParam.categoryId }"
rowKey="key"
ref="table"
:formatData="formatData"
>
<template v-if="tableParam.categoryId !== 1" #search="{ query }">
<my-form-item label="账号" :colAttr="{ span: 12 }">
<a-input placeholder="Basic usage" v-model="query.attributeName" />
</my-form-item>
</template>
<template v-if="tableParam.categoryId !== 1" #buttons>
<a-button type="primary" @click="onAddTableRow">新增</a-button>
</template>
<a-table-column title="属性名称">
<template #default="row">
<a-input v-if="row.editable" v-model="row.attributeName" />
<span v-else>
{{ row.attributeName }}
</span>
</template>
</a-table-column>
<a-table-column title="操作" :width="180">
<template #default="row">
<ActionButton v-if="row.editable" :buttons="editButtons" :row="row" />
<ActionButton v-else :buttons="buttons" :row="row" />
</template>
</a-table-column>
</my-table>
</template>
<script>
import Api from '@/api/oceanus';
import { formatObj } from '@/utils';
import ActionButton from '@/components/action_button/index.vue';
export default {
components: { ActionButton },
props: {
param: Object,
},
watch: {
param(val) {
this.tableParam = val;
},
},
data() {
return {
buttons: [
{
label: '编辑',
click: this.onEditTableRow,
},
{
type: 'confirm',
url: (row) => `/oceanus/api/v1/categories/attributes/${row.attributeId}`,
after: () => this.refreshTable(),
},
{
label: '置顶',
click: async (row) => {
const { attributeId, categoryId } = row;
try {
await Api.movementAttributes({ attributeId, categoryId, moveType: 'TOP' });
this.refreshTable();
this.$message.success('置顶成功!');
} catch (e) {
this.$message.warning('置顶失败!');
}
},
},
{
label: '置底',
click: async (row) => {
const { attributeId, categoryId } = row;
try {
await Api.movementAttributes({ attributeId, categoryId, moveType: 'BOTTOM' });
this.refreshTable();
this.$message.success('置顶成功!');
} catch (e) {
this.$message.warning('置顶失败!');
}
},
},
],
editButtons: [
{
label: '确定',
click: this.onSubmitTableRow,
},
{
type: 'confirm',
label: '取消',
title: '确认是否取消?',
onOk: this.onCancelTableRow,
},
],
tableParam: {},
};
},
methods: {
async formatData(data) {
const newData = await formatObj(data.records, { key: 'attributeId' });
return newData;
},
onAddTableRow() {
const data = this.$refs['table']?.getTableData();
const isEdit = data.find((i) => i.action === 'add');
if (isEdit) return;
const obj = {
editable: true,
key: +new Date(),
attributeName: '',
action: 'add',
categoryId: this.tableParam.categoryId,
viewIndex: 1,
};
this.$refs['table']?.setTableData([obj, ...data]);
},
onCancelTableRow(row) {
const data = this.$refs['table']?.getTableData();
if (row.action === 'add') {
const newData = data.filter((i) => i.key !== row.key);
this.$refs['table']?.setTableData(newData);
}
if (row.action === 'edit') {
const newData = data.map((i) => {
const data = { ...i };
if (i.key === row.key) {
data.editable = false;
delete data.action;
}
return data;
});
this.$refs['table']?.setTableData(newData);
}
},
async onSubmitTableRow(row) {
if (row.attributeName === '') {
return this.$message.warning('请输入属性名称!');
} else {
try {
if (row.action === 'add') {
await Api.addAttributes(row);
}
if (row.action === 'edit') {
await Api.updateAttributes(row);
}
this.refreshTable();
this.$message.success('提交成功!');
} catch (e) {
this.$message.warning('保存失败!');
}
}
},
onEditTableRow(row) {
const data = this.$refs['table']?.getTableData();
const newData = data.map((i) => {
const oData = { ...i };
if (i.key === row.key) {
oData.editable = true;
oData.action = 'edit';
}
return oData;
});
this.$refs['table']?.setTableData(newData);
},
refreshTable() {
this.$refs['table']?.reset();
},
},
};
</script>
<style scoped>
</style>
<template>
<Drawer ref="drawerRef" v-model="visible" :title="title" :onOk="submit" :colesAfter="refresh">
<a-form-model layout="vertical" :model="form" :rules="rules" ref="DrawerForm">
<a-form-model-item label="编码" prop="categoryCode">
<a-input v-model="form.categoryCode" :disabled="isView" />
</a-form-model-item>
<a-form-model-item label="名称" prop="categoryName">
<a-input v-model="form.categoryName" :disabled="isView" />
</a-form-model-item>
<a-form-model-item label="说明" prop="remark">
<a-textarea v-model="form.remark" :disabled="isView" :rows="4" />
</a-form-model-item>
</a-form-model>
</Drawer>
</template>
<script>
import Drawer from '@/components/table/drawer.vue';
import FormMixin from '@/components/FormMixin';
import Api from '@/api/oceanus';
export default {
components: { Drawer },
props: {
refresh: Function,
},
mixins: [FormMixin],
data() {
return {
visible: false,
form: {},
rules: {
categoryCode: [{ required: true, message: 'Please select Activity zone', trigger: 'change' }],
categoryName: [{ required: true, message: 'Please select Activity zone', trigger: 'change' }],
remark: [{ required: true, message: 'Please select Activity zone', trigger: 'change' }],
},
Api,
};
},
async mounted() {},
methods: {
open() {
this.form = {};
this.visible = true;
},
add() {
return Api.addOceanusTree(this.form);
},
edit() {
return Api.updateOceanusTree(this.form);
},
},
};
</script>
<template>
<a-row :gutter="10">
<a-col :span="8">
<LeftTree v-model="treeVale" />
</a-col>
<a-col :span="16">
<RightTable />
</a-col>
</a-row>
</template>
<script>
import RightTable from './components/RightTable.vue';
import LeftTree from './components/LeftTree.vue';
export default {
components: { RightTable, LeftTree },
data() {
return {
treeVale: {},
};
},
methods: {},
};
</script>
...@@ -37,9 +37,13 @@ export default { ...@@ -37,9 +37,13 @@ export default {
}; };
}, },
async mounted() { async mounted() {
this.rawData = await api.getOrganizationList(); const rawData = await api.getOrganizationList();
const newData = rawData.map((i) => ({
...i,
selectable: i.orgType === 'DEPARTMENT',
}));
const newArr = new arrayToTree({ const newArr = new arrayToTree({
data: this.rawData, data: newData,
rootValue: 0, rootValue: 0,
parentKey: 'parentOrgId', parentKey: 'parentOrgId',
key: 'orgId', key: 'orgId',
......
...@@ -52,8 +52,13 @@ export default { ...@@ -52,8 +52,13 @@ export default {
}); });
}, },
formatData(data) { formatData(data) {
const newData = data.map((i) => ({
...i,
selectable: i.orgType === 'DEPARTMENT',
}));
const newArr = new arrayToTree({ const newArr = new arrayToTree({
data: data, data: newData,
rootValue: 0, rootValue: 0,
parentKey: 'parentOrgId', parentKey: 'parentOrgId',
key: 'orgId', key: 'orgId',
......
...@@ -117,15 +117,17 @@ export default { ...@@ -117,15 +117,17 @@ export default {
key: 'certificateId', key: 'certificateId',
}); });
userCertificateList.map((i) => { userCertificateList.map((i) => {
const name = i.pictureUrl.split('/'); if (i.pictureUrl) {
const data = { const name = i.pictureUrl.split('/');
uid: +new Date(), const data = {
status: 'done', uid: +new Date(),
name: name[name.length - 1], status: 'done',
url: i.pictureUrl, name: name[name.length - 1],
thumbUrl: 'http://platform.kuopu.net:9300/' + i.pictureUrl, url: i.pictureUrl,
}; thumbUrl: 'http://platform.kuopu.net:9300/' + i.pictureUrl,
i.pictureUrl = [data]; };
i.pictureUrl = [data];
}
}); });
this.$nextTick(() => { this.$nextTick(() => {
this.$refs['form'].setData( this.$refs['form'].setData(
......
<template> <template>
<a-col :span="12"> <a-col :span="12">
<a-card hoverable style="width: 100%"> <a-card hoverable style="width: 100%">
<img class="tw-h-40" slot="cover" alt="example" :src="value.pictureUrl[0].thumbUrl" /> <img
class="tw-h-40"
slot="cover"
alt="example"
:src="value.pictureUrl && value.pictureUrl[0].thumbUrl"
/>
<template slot="actions" class="ant-card-actions"> <template slot="actions" class="ant-card-actions">
<div class="tw-h-full" @click="onEdit">编辑</div> <div class="tw-h-full" @click="onEdit">编辑</div>
<div class="tw-h-full"> <div class="tw-h-full">
...@@ -35,6 +40,14 @@ export default { ...@@ -35,6 +40,14 @@ export default {
props: { props: {
value: Object, value: Object,
}, },
watch: {
value: {
handler(val) {
console.log(val);
},
deep: true,
},
},
data() { data() {
return {}; return {};
}, },
......
...@@ -74,6 +74,7 @@ export default { ...@@ -74,6 +74,7 @@ export default {
this.current--; this.current--;
}, },
async onSubmit() { async onSubmit() {
console.log(this.form);
if (this.form.userJobRelationList.length === 0) { if (this.form.userJobRelationList.length === 0) {
this.$message.error('必须设置岗位!'); this.$message.error('必须设置岗位!');
return; return;
...@@ -81,9 +82,10 @@ export default { ...@@ -81,9 +82,10 @@ export default {
const userCertificateList = this.form.userCertificateList.map((i) => { const userCertificateList = this.form.userCertificateList.map((i) => {
return { return {
...i, ...i,
pictureUrl: i.pictureUrl[0]?.url || undefined, pictureUrl: i.pictureUrl && (i.pictureUrl[0]?.url || undefined),
}; };
}); });
console.log(userCertificateList);
const userRoleRelationList = this.form.userRoleRelationList.map((i) => ({ roleId: i })); const userRoleRelationList = this.form.userRoleRelationList.map((i) => ({ roleId: i }));
const data = { ...this.form, userRoleRelationList, userCertificateList }; const data = { ...this.form, userRoleRelationList, userCertificateList };
if (this.form.userId) { if (this.form.userId) {
......
...@@ -136,6 +136,26 @@ const hasAuthorityRoutes = [ ...@@ -136,6 +136,26 @@ const hasAuthorityRoutes = [
}, },
], ],
}, },
{
path: 'oceanus',
name: '设备管理',
meta: {
icon: 'control',
},
component: PageTemplateView,
children: [
{
path: 'category',
name: '分类配置',
component: () => import('@/pages/oceanus/category/index.vue'),
},
{
path: 'equipment',
name: '设备台账',
component: () => import('@/pages/oceanus/equipment/index.vue'),
},
],
},
{ {
path: 'user', path: 'user',
name: '个人中心', name: '个人中心',
......
...@@ -89,7 +89,6 @@ export function arrayToTree(options) { ...@@ -89,7 +89,6 @@ export function arrayToTree(options) {
const THISDATA = JSON.parse(JSON.stringify(this.data)); const THISDATA = JSON.parse(JSON.stringify(this.data));
for (let i = 0; i < this.data.length; i++) { for (let i = 0; i < this.data.length; i++) {
let currentElement = this.data[i]; let currentElement = this.data[i];
currentElement.selectable = currentElement.orgType === 'DEPARTMENT';
let tempCurrentElementParent = this.indexStorage[currentElement[this.parentKey]]; // 临时变量里面的当前元素的父元素 let tempCurrentElementParent = this.indexStorage[currentElement[this.parentKey]]; // 临时变量里面的当前元素的父元素
if (tempCurrentElementParent) { if (tempCurrentElementParent) {
// 如果存在父元素 // 如果存在父元素
......
...@@ -11,6 +11,8 @@ axios.defaults.withCredentials = true; ...@@ -11,6 +11,8 @@ axios.defaults.withCredentials = true;
axios.defaults.xsrfHeaderName = xsrfHeaderName; axios.defaults.xsrfHeaderName = xsrfHeaderName;
axios.defaults.xsrfCookieName = xsrfHeaderName; axios.defaults.xsrfCookieName = xsrfHeaderName;
axios.defaults.baseURL = '/api';
/** /**
* @param {*} info 提示函数 * @param {*} info 提示函数
*/ */
......
...@@ -193,14 +193,14 @@ const assetsCDN = { ...@@ -193,14 +193,14 @@ const assetsCDN = {
module.exports = { module.exports = {
devServer: { devServer: {
proxy: { proxy: {
'/api': { '/api/': {
//此处要与 /services/api.js 中的 API_PROXY_PREFIX 值保持一致 //此处要与 /services/api.js 中的 API_PROXY_PREFIX 值保持一致
// target: process.env.VUE_APP_API_BASE_URL, // target: process.env.VUE_APP_API_BASE_URL,
target: 'http://platform.kuopu.net:9300', target: 'http://platform.kuopu.net:9300',
changeOrigin: true, changeOrigin: true,
// pathRewrite: { pathRewrite: {
// '^/api': '' '^/api/': '',
// } },
}, },
}, },
}, },
......
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