Commit c255eb5a authored by 赵伟庚's avatar 赵伟庚

update:首页配置需求&部分需求优化

parent b552c48f
<template>
<div class="item_card">
<div class="action_box" v-if="props.flag">
<div class="can_click_text" @click="deleteItem(props.item)">删除</div>
<div class="can_click_text" @click="move(1)" :class="props.item.canDown ? '' : 'disabled'">下移</div>
<div class="can_click_text" @click="move(2)" :class="props.item.canUp ? '' : 'disabled'">上移</div>
</div>
<div class="top_info">
<el-checkbox
class="select_box"
v-model="props.item.checked"
@change="change_check"
></el-checkbox>
<div class="logo">
<img v-if="props.item.ability_logo" :src="props.item.ability_logo" alt="">
<img v-else src="../assets/imgs/img_cover_ability.png" alt="">
</div>
<div class="info">
<div class="name">
<span class="ability_name">{{props.item.ability_name}}</span>
<span class="icon_box openness" :class="openClassObj[props.item.openness_id]">{{props.item.openness}}</span>
<span class="icon_box mock" v-if="props.item.include_mock_service">mock</span>
</div>
<div class="count">
<div class="box1">
<div class="score_box">
<el-rate
v-model="props.item.score"
disabled
/>
</div>
<span class="score">{{props.item.score}}</span>
</div>
<div class="line"></div>
<div class="box2">
阅读{{
props.item.browse_count == 0 || (props.item.browse_count && props.item.browse_count < 10000)
? props.item.browse_count
: props.item.browse_count < 10000000
? Math.floor(props.item.browse_count/10000) + '万+'
: '999万+'
}}
</div>
<div class="line"></div>
<div class="box3">
调用{{
props.item.call_count == 0 || (props.item.call_count && props.item.call_count < 10000)
? props.item.call_count
: props.item.call_count < 10000000
? Math.floor(props.item.call_count/10000) + '万+'
: '999万+'
}}
</div>
</div>
</div>
</div>
<div class="bottom_info">
<div class="desc" :title="props.item.synopsis">
{{props.item.synopsis}}
</div>
<div class="action">
<span class="fws" :title="props.item.develop">
<bg-icon style="font-size: 14px; color: #909bb6;" icon="#bg-ic-shop" />
{{props.item.develop}}
</span>
</div>
</div>
</div>
</template>
<script setup>
import { useRouter } from "vue-router"
const router = useRouter()
const props = defineProps({
item: {
type: Object,
default: {}
},
flag: {
type: Boolean,
default: false
}
})
const emit = defineEmits(["change_check","deleteItem","move"])
const openClassObj = {
'9de06ba6-6ee2-4449-91d9-31a1c7554311':'open',
'4e8b4c37-e565-4195-8303-3b1ccd48dd13':'share',
'4e8b4c37-e565-4195-8303-3b1ccd48dd12':'limit',
'4e8b4c37-e565-4195-8303-3b1ccd48dd16':'sensitive'
}
const change_check = () => {
console.log(props.item)
emit("change_check",props.item)
}
const deleteItem = (item) => {
emit("deleteItem",item)
}
const move = (type) => {
if ((type == 1 && !props.item.canDown) || (type == 2 && !props.item.canUp)) {
return
}
let temp = {
item: props.item,
type: type
}
emit("move",temp)
}
</script>
<style lang="scss" scoped>
.item_card {
width: 100%;
margin-right: 16px;
margin-bottom: 16px;
height: 206px;
background-color: #ffffff;
box-shadow: 0px 4px 16px 0px
rgba(18, 30, 63, 0.08);
border-radius: 6px;
&:nth-child(3n) {
margin-right: 0;
}
.action_box {
height: 36px;
background-color: #dfe5f5;
display: flex;
line-height: 36px;
flex-direction: row-reverse;
.can_click_text {
margin-right: 16px;
}
.disabled {
cursor: not-allowed;
color: #a9b1c7;
}
}
.top_info {
width: 100%;
height: 92px;
padding: 0 16px 0 8px;
padding-top: 24px;
border-bottom: 1px solid #edeff2;
display: flex;
.select_box {
width: 16px;
height: 16px;
margin-right: 8px;
margin-top: 16px;
}
.logo {
width: 48px;
height: 48px;
margin-right: 16px;
img {
width: 48px;
}
}
.info {
width: calc(100% - 86px);
.name {
width: 100%;
display: flex;
align-items: center;
.ability_name {
max-width: calc(100% - 85px);
font-size: 16px;
font-weight: 700;
line-height: 24px;
color: #202531;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.icon_box {
height: 18px;
border: 1px solid #fff;
font-size: 12px;
line-height: 16px;
margin-left: 6px;
text-align: center;
border-radius: 3px;
}
.openness {
width: 33px;
color: #429e8a;
background-color: #ecf5f4;
border-color: #a1cfc5;
}
.open{
background-color: #f0f5eb;
border-color:#bbd19e;
color: #78a33d;
}
.share{
}
.limit{
background-color: #fcf0e6;
border-color: #f2b380;
color: #e56600;
}
.sensitive{
background-color: #fbeeeb;
border-color: #eba89c;
color: #d75138;
}
.mock {
width: 40px;
color: #3759be;
background-color: #ebeff9;
border-color: #9bacdf;
}
}
.count {
width: 100%;
display: flex;
align-items: center;
margin-top: 10px;
font-size: 12px;
color: #404a62;
.line {
width: 1px;
height: 12px;
margin: 0 8px;
background-color: #cbced7;
}
.box1 {
max-width: calc(100% - 166px);
height: 14px;
display: flex;
align-items: center;
.score_box {
max-width: 60px;
padding-top: 1px;
overflow: hidden;
.el-rate {
height: 14px;
// padding-top: 1px;
:deep().el-rate__item {
width: 12px;
height: 12px;
.el-rate__icon {
font-size: 14px;
}
}
}
}
.score {
color: #e56600;
margin-left: 5px;
font-size: 14px;
}
}
.box2,
.box3 {
max-width: 66px;
}
}
}
}
.bottom_info {
height: calc(100% - 92px);
background-color: #fbfbfc;
border-radius: 0 0 6px 6px;
padding: 20px 24px 24px;
font-size: 14px;
color: #404a62;
line-height: 22px;
.desc {
height: 44px;
overflow: hidden;
text-overflow: ellipsis;
// white-space: nowrap;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
margin-bottom: 6px;
text-align: left;
}
.action {
display: flex;
justify-content: space-between;
.fws {
color: #7784a6;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
max-width: 160px;
}
}
}
}
</style>
\ No newline at end of file
<template>
<div class="card_list">
<div v-for="(e,i) in props.list" :key="'card' + i" class="item" style="width: calc((100% - 32px) / 3)">
<ability-card v-if="e.id" :item="e" @change_check="changeCheck" :flag="props.flag" @deleteItem="deleteItem" @move="move"/>
<div v-else class="empty_card" @click="open">
<span>+</span>
</div>
</div>
</div>
</template>
<script setup>
import abilityCard from "./ability-card.vue"
const props = defineProps({
list: {
type: Array,
default: []
},
flag: {
type: Boolean,
default: false
}
})
const emit = defineEmits(["changeCheck","openBox","deleteItem","move"])
const changeCheck = (item) => {
emit("changeCheck",item)
}
const open = () => {
console.log(3333)
emit("openBox")
}
const deleteItem = (item) => {
emit("deleteItem",item)
}
const move = (temp) => {
emit("move",temp)
}
</script>
<style lang="scss" scoped>
.card_list {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
// .item {
// width: calc(100% - 32px);
// }
.empty_card {
cursor: pointer;
width: 384px;
height: 242px;
border: 1px dashed #dadee7;
border-radius: 4px;
margin-bottom: 24px;
color: #dadee7;
text-align: center;
line-height: 242px;
font-size: 48px;
font-weight: 100;
}
}
</style>
\ No newline at end of file
......@@ -54,22 +54,22 @@ const checkPhone = (rule, value, callback) => {
});
};
const checkPhoneRepet = (rule, value, callback) => {
let params = null;
if (props.id){
params = {id: parseInt(props.id),contact_phone: value,}
}else {
params = {id: 0,contact_phone: value}
}
$axios.post(`/apaas/system/v5/org/check`,params)
.then((res) => {
if (res.data.code == 200) {
callback()
}else {
callback(new Error(res.data.data))
}
})
}
// const checkPhoneRepet = (rule, value, callback) => {
// let params = null;
// if (props.id){
// params = {id: parseInt(props.id),contact_phone: value,}
// }else {
// params = {id: 0,contact_phone: value}
// }
// $axios.post(`/apaas/system/v5/org/check`,params)
// .then((res) => {
// if (res.data.code == 200) {
// callback()
// }else {
// callback(new Error(res.data.data))
// }
// })
// }
const checkName = (rule, value, callback) => {
var reg = /^[a-zA-Z0-9\u4e00-\u9fa5]+$/
......@@ -89,7 +89,7 @@ const contactFormRules = reactive({
contact_phone: [
{ required: true, message: '请输入联系人手机号', trigger: 'blur' },
{ validator: checkPhone, trigger: 'blur' },
{ validator: checkPhoneRepet, trigger: 'blur' }
// { validator: checkPhoneRepet, trigger: 'blur' }
],
contact_email: [
{ type: 'email', message: '请输入正确的邮箱', trigger: 'blur' },
......
......@@ -180,7 +180,13 @@ const continueCreate = () => {
}
//取消
const cancel = () => {
router.go(-1);
// router.go(-1);
router.push({
path: "/develop/account",
query: {
id: formData.organization_id
}
})
}
const getDetail = () => {
......
......@@ -245,10 +245,9 @@ const getOrgTree = () => {
const copyText = (data) => {
navigator.clipboard.writeText(data).then(
function () {
$message.success("复制成功")
},
function () {
}
);
}
......
......@@ -20,14 +20,14 @@
/>
</div>
<div class="tree">
<el-tree ref="treeRef"
:data="orgData"
:props="defaultProps"
@node-click="handleNodeClick"
node-key="id"
:highlight-current="true"
:filter-node-method="filterNode"
:default-expand-all="true">
<el-tree ref="treeRef"
:data="orgData"
:props="defaultProps"
@node-click="handleNodeClick"
node-key="id"
:highlight-current="true"
:filter-node-method="filterNode"
:default-expand-all="true">
<template #default="{ node, data }">
<div class="custom_tree_node">
<span
......@@ -205,7 +205,7 @@ import { Search } from '@element-plus/icons-vue'
import { reactive, toRefs, ref, } from '@vue/reactivity'
import { getCurrentInstance, watch, nextTick } from 'vue'
import { computed, onBeforeMount } from '@vue/runtime-core'
import { useRouter } from 'vue-router';
import { useRoute, useRouter } from 'vue-router';
import { edit } from 'ace-builds';
import CryptoJS from "crypto-js";
......@@ -272,6 +272,7 @@ import CryptoJS from "crypto-js";
confirm_password: '',
})
const selectNode = ref(null)
const selectNodeObj = ref(null)
const filterTree = ref('')
const treeRef = ref(null)
const validatePass = (rule, value, callback) => {
......@@ -294,7 +295,7 @@ import CryptoJS from "crypto-js";
})
const router = useRouter();
const route = useRoute()
const getTableRows = () => {
let params = {...filter, organization_id: selectNode.value}
$axios.get(
......@@ -320,20 +321,30 @@ import CryptoJS from "crypto-js";
}
const handleNodeClick = (data) => {
console.log(data.data_type)
if(data.data_type == 1) {
selectNode.value = data.id;
changePage(1)
}else {
nextTick(() => {
treeRef.value.setCurrentKey(null)
})
}
}
const orgData = ref([])
const customNodeClass = (data,node) => {
if (data.data_type == 0) {
return 'noFocus'
}else {
return ''
}
}
const defaultProps = {
label: 'name',
children: 'Child',
value: 'organization_id'
value: 'organization_id',
class: customNodeClass,
}
const getOrgTree = () => {
$axios.get(`/apaas/system/v5/org/tree`)
.then((res) => {
......@@ -341,10 +352,18 @@ import CryptoJS from "crypto-js";
orgData.value = res.data.data || [];
orgData.value.shift()
const orgList = searchOrg(orgData.value);
selectNode.value = orgList.length > 0 ? orgList[0].id : '';
if (route.query.id) {
searchItem(orgData.value,route.query.id)
}else {
selectNode.value = orgList.length > 0 ? orgList[0].id : '';
}
nextTick(() =>{
if(orgList.length > 0) {
treeRef.value.setCurrentNode(orgList[0])
if (route.query.id) {
treeRef.value.setCurrentNode(selectNodeObj.value)
}else {
if(orgList.length > 0) {
treeRef.value.setCurrentNode(orgList[0])
}
}
})
getTableRows()
......@@ -353,7 +372,18 @@ import CryptoJS from "crypto-js";
}
})
}
const searchItem = (data,id) => {
data.forEach(e => {
if (e.organization_id == id) {
selectNodeObj.value = e
selectNode.value = e.id
}else {
if (e.Child) {
searchItem(e.Child,id)
}
}
})
}
const searchOrg = (data) => {
const arr = []
data.forEach(item => {
......@@ -596,6 +626,9 @@ import CryptoJS from "crypto-js";
.tree :deep() .el-tree-node>.el-tree-node__children {
overflow: unset;
}
.tree :deep().noFocus:focus>.el-tree-node__content {
background-color: #fff;
}
.custom_tree_node {
width: 100%;
font-size: 14px;
......
......@@ -21,13 +21,14 @@
class="file-tree"
:data="data"
:props="defaultProps"
@node-click="handleNodeClick"
@node-click="handleNodeClick"
:default-expand-all="true"
:highlight-current="true"
node-key="menu_id"
ref="menuTree"
:filter-node-method="filterNode"
:expand-on-click-node="false"
>
<template #default="{ node, data }">
<div class="custom-tree-node" pointer-events="none">
......@@ -182,6 +183,9 @@ const getMenuTree = (type,id) => {
if (type == 1) { // 删除数据后默认选中父节点或第一个节点
state.menuTree && state.menuTree.setCurrentKey(state.selectParentData.menu_id);
handleNodeClick(state.selectParentData);
nextTick().then(() => {
setScroll()
})
}else {
state.menuTree && state.menuTree.setCurrentKey(state.data[0].menu_id);
handleNodeClick(state.data[0]);
......@@ -193,6 +197,9 @@ const getMenuTree = (type,id) => {
if (state.selectData) {
state.menuTree && state.menuTree.setCurrentKey(state.selectData.menu_id);
handleNodeClick(state.selectData);
nextTick().then(() => {
setScroll()
})
}else {
state.menuTree && state.menuTree.setCurrentKey(state.data[0].menu_id);
handleNodeClick(state.data[0]);
......@@ -205,7 +212,21 @@ const getMenuTree = (type,id) => {
}
})
} // 获取菜单树
const setScroll = () => {
setTimeout(()=> {
var nodeOffsetTop = document.querySelector(
".file-tree .is-current"
).offsetTop
var treeScroll = document.querySelector(
".tree"
)
var parentHeight = treeScroll.clientHeight
if (nodeOffsetTop > parentHeight) {
treeScroll.scrollTop = nodeOffsetTop - parentHeight / 2
}
},300)
}
const findData = (arr,id) => {
arr.forEach(e => {
if (e.menu_id == id) {
......@@ -309,6 +330,8 @@ const fileAction = (val,data,parent,disabled=false) => {
level: data.level, // 当前的level
p_menu_type: parent ? parent.menu_type : 0, // 父级的类型,用于判断菜单下不能建目录
system_type: "", // 系统类型
new_window: 0,
remark: "",
}
state.menuTree.insertAfter(newChild,parent? parent.Child[parent.Child.length-1] : state.data[state.data.length -1])
state.menuTree && state.menuTree.setCurrentKey(newChild.menu_id);
......@@ -331,6 +354,8 @@ const fileAction = (val,data,parent,disabled=false) => {
p_menu_type: data.menu_type,
level: data.level + 1,
system_type: "", // 系统类型
new_window: 0,
remark: "",
}
state.menuTree.append(newChild,data)
state.menuTree && state.menuTree.setCurrentKey(newChild.menu_id);
......@@ -338,11 +363,15 @@ const fileAction = (val,data,parent,disabled=false) => {
state.selectParentData = data
state.newMenuId++
}else if (val == 3) { // 删除菜单
if (data.state == 1) {
ElMessage.error("删除内容中有启用状态的数据,不可删除!")
return
if (data.id) {
if (data.state == 1) {
ElMessage.error("删除内容中有启用状态的数据,不可删除!")
return
}
state.delDialog = true
}else {
state.delDialog = true
}
state.delDialog = true
}else if (val == 4) { // 菜单上移
if (disabled) {
......@@ -395,19 +424,33 @@ const fileAction = (val,data,parent,disabled=false) => {
} // 各种操作按钮
const deleteData = () => {
axios
.delete(`/apaas/system/v5/menu/${state.selectData.id}`)
.then((res) => {
if (res.data.code == 200) {
ElMessage.success(res.data.msg)
state.selectData = null
let type = state.selectParentData ? 1 : 2 // 1--有父级 2--无父级
getMenuTree(type)
state.delDialog = false
}else {
ElMessage.error(res.data.data)
}
})
if (state.selectData.id) {
axios
.delete(`/apaas/system/v5/menu/${state.selectData.id}`)
.then((res) => {
if (res.data.code == 200) {
ElMessage.success(res.data.msg)
state.selectData = null
let type = state.selectParentData ? 1 : 2 // 1--有父级 2--无父级
getMenuTree(type)
state.delDialog = false
}else {
ElMessage.error(res.data.data)
}
})
}else {
state.menuTree.remove(state.selectData)
state.selectData = null
let type = state.selectParentData ? 1 : 2 // 1--有父级 2--无父级
if (type == 1) {
state.menuTree && state.menuTree.setCurrentKey(state.selectParentData.menu_id);
handleNodeClick(state.selectParentData);
}else {
state.menuTree && state.menuTree.setCurrentKey(state.data[0].menu_id);
handleNodeClick(state.data[0]);
}
state.delDialog = false
}
}
const changeSort = (data,nextObj) => {
......@@ -449,6 +492,8 @@ const saveMenu = (el,type) => {
menu_logo: el.menuForm.menu_logo,
source: el.menuForm.menu_type == 0 ? "" : el.menuForm.source,
system_type: el.menuForm.system_type,
new_window: el.menuForm.new_window,
remark: el.menuForm.remark,
}
if (state.selectData.id) { // 编辑
axios
......
......@@ -28,6 +28,15 @@
/>
</el-select>
</el-form-item>
<el-form-item label="跳转方式" prop="new_window" v-if="menuForm.menu_type !=0">
<el-radio-group v-model="menuForm.new_window">
<el-radio :label="0">当前窗口</el-radio>
<el-radio :label="1">新窗口</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input v-model="menuForm.remark" show-word-limit maxlength="8" placeholder="请输入备注" />
</el-form-item>
<el-form-item label="系统类型" prop="system_type" v-if="topLevel">
<el-select v-model="menuForm.system_type" placeholder="请选择系统类型">
<el-option
......@@ -131,6 +140,8 @@ const state = reactive({
menu_logo: "",
source: "",
system_type: "",
new_window: 0,
remark: "",
},
formRules: {
menu_name: [
......@@ -147,6 +158,9 @@ const state = reactive({
],
menu_url: [
{ required: true, message: '请输入菜单路径', trigger: 'blur' },
],
new_window: [
{ required: true, message: '请选择跳转方式', trigger: 'change' },
]
},
groupList: [], // 菜单分组
......
......@@ -22,7 +22,7 @@ import axios from '../../../../../request/http.js'
import { ElMessage } from 'element-plus'
import { useRoute, useRouter } from 'vue-router'
import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
import bannerForm from "./banner_form.vue"
import bannerForm from "./banner-form.vue"
const router = useRouter()
const route = useRoute()
const bannerFormRef = ref(null);
......
......@@ -17,11 +17,11 @@
<el-form-item label="公司地址" prop="company_address">
<el-input v-model="formData.company_address" placeholder="请输入公司地址" show-word-limit maxlength="100"/>
</el-form-item>
<el-form-item label="公司logo" prop="company_logo">
<bg-upload-image v-model="formData.company_logo" :limit="1" listType="picture-card" :accept="['.jpg','.jpeg','.png']"></bg-upload-image>
<el-form-item label="公司logo" prop="logo">
<bg-upload-image v-model="formData.logo" :fileSize="500" :fileSizeUnit="'KB'" :showTips="true" customTips="请选择图片上传:大小80 * 80像素支持jpg、png等格式,图片需小于500KB" :limit="1" listType="picture-card" :accept="['.jpg','.jpeg','.png']"></bg-upload-image>
</el-form-item>
<el-form-item label="公司电话" prop="company_phone">
<el-input v-model="formData.company_phone" placeholder="请输入公司电话" show-word-limit maxlength="20" />
<el-form-item label="公司电话" prop="contact_phone">
<el-input v-model="formData.contact_phone" placeholder="请输入公司电话" show-word-limit maxlength="20" />
</el-form-item>
</el-form>
</div>
......@@ -43,12 +43,28 @@ import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
const router = useRouter()
const route = useRoute()
const formRef = ref(null);
const checkPhone = (rule,value,callback) => {
let reg = /^((1[0-9]{10})|(((([0-9]{3}-)?[0-9]{8})|(([0-9]{4}-)?[0-9]{7}))(-[0-9]{1,4})?))$/
if (value !== '') {
console.log(1)
if (!reg.test(value)) {
console.log(2)
callback(new Error("电话号码格式不正确,请重新输入"))
}else {
console.log(3)
callback()
}
}else {
callback()
}
}
const state = reactive({
formData: {
company_name: "",
company_address: "",
company_logo: [],
company_phone: ""
logo: [],
contact_phone: ""
},
formRules: {
company_name: [
......@@ -58,40 +74,52 @@ const state = reactive({
company_address: [
],
company_logo: [
logo: [
],
company_phone: [
contact_phone: [
{ validator: checkPhone, trigger: "blur"}
],
}
})
const getFootInfo = () => {
// axios
// .get(`/apaas/system/v5/banner/${id}`)
// .then(res => {
// if (res.data.code == 200) {
// const data = res.data.data
// bannerFormRef.value.setForm({
// company_name: data.company_name,
// company_address: data.company_address,
// company_logo: data.company_logo ? [{url: data.company_logo}] : [],
// company_phone: data.company_phone
// })
// }else {
// ElMessage.error(res.data.data)
// }
// })
// .catch(err => {
// console.log(err)
// })
axios
.get(`/apaas/system/v5/config/get`)
.then(res => {
if (res.data.code == 200) {
const data = res.data.data
state.formData = {
company_name: data.company_name,
company_address: data.company_address,
logo: data.logo ? [{url: data.logo}] : [],
contact_phone: data.contact_phone
}
}else {
ElMessage.error(res.data.data)
}
})
.catch(err => {
console.log(err)
})
}
const submit = () => {
formRef.value.validate((valid, fields) => {
if (valid) {
let params = {
...state.formData,
logo: state.formData.logo && state.formData.logo.length > 0 ? state.formData.logo[0].url : '',
}
axios
.post(`/apaas/system/v5/config/set`,params)
.then(res => {
if (res.data.code == 200) {
ElMessage.success(res.data.msg)
}else {
ElMessage.error(res.data.data)
}
})
}
})
}
......@@ -139,6 +167,18 @@ const {
.form {
.el-form-item {
display: block;
:deep().bg-upload {
.el-upload--picture-card {
width: 80px;
height: 80px;
background-color: #fff;
border: 1px solid #dadee7;
}
.el-upload-list--picture-card .el-upload-list__item {
width: 80px;
height: 80px;
}
}
}
}
}
......
<template>
<el-form
:model="formData"
:rules="formRules"
ref="form"
style="max-width: 1048px"
class="form"
>
<el-form-item label="能力类型" prop="type">
<el-select v-model="formData.type" placeholder="请选择能力类型" style="width: 100%" @change="changeType">
<el-option
v-for="item in TypeList"
:key="item.dict_id"
:label="item.name"
:value="item.dict_id"
/>
</el-select>
</el-form-item>
<el-form-item label="上传图标" prop="icon">
<bg-upload-image v-model="formData.icon" :fileSize="500" :fileSizeUnit="'KB'" :showTips="true" customTips="请选择图片上传:大小36 * 36像素支持jpg、png等格式,图片需小于500KB" :limit="1" listType="picture-card" :accept="['.jpg','.jpeg','.png']"></bg-upload-image>
</el-form-item>
</el-form>
</template>
<script setup>
import { reactive, toRefs, ref, onBeforeMount, nextTick } from 'vue'
import axios from '../../../../../request/http.js'
import { ElMessage } from 'element-plus'
import { useRoute, useRouter } from 'vue-router'
const router = useRouter()
const route = useRoute()
const form = ref(null)
const state = reactive({
formData: {
type: "",
icon: [],
},
formRules: {
type: [
{ required: true, message: '请选择业务类型', trigger: 'change' },
],
icon: [
{ required: true, message: '请上传图标', trigger: 'change' },
],
},
TypeList: [],
})
const emit = defineEmits(['action','changeType'])
const submitForm = async () => {
if (!form) return
await form.value.validate((valid, fields) => {
if (valid) {
emit('action', state.formData)
} else {
emit('action',null)
}
})
}
const changeType = (val) => {
emit("changeType",val)
}
const clearForm = () => {
if (!form) return
form.value.resetFields()
}
const setForm = (data) => {
Object.assign(state.formData, data);
}
const getTypeList = () => {
axios
.get("/apaas/system/v5/dictionary/alllist")
.then((res) => {
if (res.data.code == 200) {
let data = res.data.data || []
data.forEach(e => {
if (e.classify_id == "eb9c7d70-c123-42b7-8e61-dde1b022b669") {
state.TypeList = e.list || [];
}
})
}else {
ElMessage.error(res.data.data)
}
})
}
onBeforeMount(() => {
getTypeList()
})
const {
formData,
formRules,
TypeList,
} = toRefs(state)
defineExpose({ submitForm, clearForm, setForm })
</script>
<style lang="scss" scoped>
.form {
.el-form-item {
display: block;
}
:deep().bg-upload {
.el-upload--picture-card {
width: 56px;
height: 56px;
background-color: #fff;
border: 1px solid #dadee7;
}
.el-upload-list--picture-card .el-upload-list__item {
width: 56px;
height: 56px;
}
}
}
</style>
\ No newline at end of file
......@@ -191,7 +191,8 @@ const getOperations = (row) => {
} // 表格操作按钮
const addBanner = () => {
console.log("新增banner")
console.log("新建")
router.push("/home-config/recommend/add")
}
const edit_row = (row) => {
......
......@@ -79,7 +79,7 @@ import { reactive, ref, onMounted, onBeforeMount, getCurrentInstance, nextTick }
label: 'name',
children: 'Child',
value: 'organization_id',
// disabled: 'disabled'
disabled: 'disabled'
}
const getOrgTree = () => {
$axios.get(`/apaas/system/v5/org/tree`)
......
......@@ -88,23 +88,23 @@
</template>
</bg-filter-group>
<div class="table_container apaas_scroll">
<bg-table ref="dataTable" :headers="headers" :rows="tableRows" :isIndex="true" :stripe="true" :select="true" @selectAc="selectRows">
<bg-table ref="dataTable" :headers="headers" :rows="tableRows" :isIndex="true" canEdit canEditFlag='canSelect' :stripe="true" :select="true" @selectAc="selectRows">
<template v-slot:system_account="{ row }">
<span @click="goDetail(row)" class="can_click_text">
{{ row.system_account }}
</span>
</template>
<template v-slot:state="{ row }">
<bg-switch @click="stateChange(row)" :labels="['否','是']" :values="[0,1]" v-model="row.state"></bg-switch>
<bg-switch @click="stateChange(row)" :labels="['否','是']" :values="[0,1]" v-model="row.state" :disabled="row.is_admin== 4"></bg-switch>
</template>
<template v-slot:action="{ row }">
<bg-table-btn @click="editAccount(row)" class="can_click_text">
<bg-table-btn :disabled="row.is_admin== 4" @click="editAccount(row)" class="can_click_text">
编辑
</bg-table-btn>
<bg-table-btn @click="editPsdAccount(row)" class="can_click_text">
<bg-table-btn :disabled="row.is_admin== 4 && userInfo.is_admin !== 4" @click="editPsdAccount(row)" class="can_click_text">
修改密码
</bg-table-btn>
<bg-table-btn @click="deleteAccount(row)" class="can_click_text">
<bg-table-btn :disabled="row.is_admin== 4" @click="deleteAccount(row)" class="can_click_text">
删除
</bg-table-btn>
</template>
......@@ -285,6 +285,7 @@ import directoryForm from './directory-form.vue';
import orgForm from './org-form.vue';
import CryptoJS from "crypto-js";
import { downloadFileFormatNew } from '@/services/helper'
import store from '@/store'
const { proxy } = getCurrentInstance()
const { $axios,$message } = proxy
......@@ -428,6 +429,9 @@ import { downloadFileFormatNew } from '@/services/helper'
confirm_password: '',
})
const search = ref('')
const userInfo = computed(() => {
return store.state.userInfo
})
const validatePass = (rule, value, callback) => {
if (value !== passwordForm.password) {
callback(new Error("密码输入不一致"))
......@@ -696,10 +700,16 @@ import { downloadFileFormatNew } from '@/services/helper'
.then((res) => {
if (res.data.code == 200) {
tableRows.value = (res.data.data.org_users.data || []).map(item => {
item.system_role = item.system_role ? item.system_role.join('') : '';
item.system_role = item.system_role ? item.system_role.join('') : '-';
return item;
});
tableRows.value.forEach(e => {
if (e.is_admin == 4 && userInfo.value.is_admin != 4) {
e.canSelect = 1
}else {
e.canSelect = 0
}
})
tableTotal.value = res.data.data.org_users.total;
if(params.data_type === 1) {
baseInfo[0].value = res.data.data.org_info.organization_type;
......@@ -735,6 +745,9 @@ import { downloadFileFormatNew } from '@/services/helper'
}
const stateChange = (row) => {
if (row.is_admin== 4) {
return
}
const state = row.state.toString();
$axios.post(
`/apaas/system/v5/user/state/${row.id}/${state}`,
......
......@@ -183,7 +183,12 @@ const continueCreate = () => {
}
//取消
const cancel = () => {
router.go(-1);
router.push({
path: "/system/organization",
query: {
id: route.query.orgId
}
})
}
const getDetail = () => {
$axios.get(`/apaas/system/v5/org/user/${route.query.id}`)
......
......@@ -117,15 +117,15 @@ const nextStep = () => {
}
//账号信息表单检验触发事件 data为null 校验失败
const getPlatformAccountFormData = (data) => {
if(data) {
if(route.query.id) {
Object.assign(formData,data);
let params = {
...formData,
logo: formData.logo && formData.logo.length > 0 ? formData.logo[0].url : '',
}
$axios.put(`/apaas/system/v5/org/update/user/${route.query.id}`,params)
.then((res) => {
if(data) {
if(route.query.id) {
Object.assign(formData,data);
let params = {
...formData,
logo: formData.logo && formData.logo.length > 0 ? formData.logo[0].url : '',
}
$axios.put(`/apaas/system/v5/org/update/user/${route.query.id}`,params)
.then((res) => {
if (res.data.code == 200) {
successFlag.value = true;
step.value = 3;
......@@ -133,18 +133,18 @@ const getPlatformAccountFormData = (data) => {
$message.error(res.data.data)
}
})
}else {
Object.assign(formData,data);
step.value = 2;
}
}else {
Object.assign(formData,data);
step.value = 2;
}
}else {
}
}
//个人信息表单检验触发事件 data为null 校验失败
const getPlatformPersonFormData = (data) => {
if(data) {
if(data) {
Object.assign(formData,data);
if(route.query.id) {
console.log(formData)
......@@ -163,11 +163,11 @@ const getPlatformPersonFormData = (data) => {
}else {
const params = {...formData,
organization_id: orgId.value,
logo: formData.logo && formData.logo.length > 0 ? formData.logo[0].url : '',
is_admin: 3,
password: CryptoJS.AES.encrypt(formData.password,"swuE9cmCZQwrkYRV").toString()
};
organization_id: orgId.value,
logo: formData.logo && formData.logo.length > 0 ? formData.logo[0].url : '',
is_admin: 3,
password: CryptoJS.AES.encrypt(formData.password,"swuE9cmCZQwrkYRV").toString()
};
$axios.post(`/apaas/system/v5/org/add/user`,params)
.then((res) => {
if (res.data.code == 200) {
......@@ -213,22 +213,24 @@ const getOrgTree = () => {
const getDetail = () => {
$axios.get(`/apaas/system/v5/org/user/${route.query.id}`)
.then((res) => {
if (res.data.code == 200) {
const form = res.data.data;
platformAccountFormRef.value.setForm({
logo: form.logo ? [{url:form.logo}] : [],
system_account: form.system_account,
contact_phone: form.contact_phone,
state: form.state,
contact_name: form.contact_name,
contact_email: form.contact_email,
remark: form.remark,
})
}else {
$message.error(res.data.data)
}
.then((res) => {
if (res.data.code == 200) {
const form = res.data.data;
console.log(form)
platformAccountFormRef.value.setForm({
logo: form.logo ? [{url:form.logo}] : [],
system_account: form.system_account,
contact_phone: form.contact_phone,
state: form.state,
contact_name: form.contact_name,
contact_email: form.contact_email,
remark: form.remark,
select_role: form.select_role
})
}else {
$message.error(res.data.data)
}
})
}
onBeforeMount(() => {
......
......@@ -22,7 +22,7 @@
<el-form-item v-if="!formType" label="确认密码" prop="confirm_password">
<el-input type="password" v-model="platformAccountForm.confirm_password" />
</el-form-item>
<el-form-item v-if="!formType" label="角色授权" prop="select_role">
<el-form-item label="角色授权" prop="select_role">
<el-select v-model="platformAccountForm.select_role" multiple placeholder="请选择角色" style="width: 100%">
<el-option
v-for="item in roleList"
......@@ -85,50 +85,50 @@ const validatePass = (rule, value, callback) => {
}
}
const checkPhone = (rule, value, callback) => {
var phone_ruler = /^(?:(?:\+|00)86)?1[3-9]\d{9}$/;
setTimeout(() => {
if (!phone_ruler.test(value)&&value.length!==0) {
callback(new Error("请输入正确的手机号码"));
} else {
callback();
}
});
var phone_ruler = /^(?:(?:\+|00)86)?1[3-9]\d{9}$/;
setTimeout(() => {
if (!phone_ruler.test(value)&&value.length!==0) {
callback(new Error("请输入正确的手机号码"));
} else {
callback();
}
});
};
const validateSystemAccount = (rule, value, callback) => {
let params = null;
if (props.id){
params = {id: parseInt(props.id),system_account: value,}
}else {
params = {system_account: value}
}
if (props.id){
params = {id: parseInt(props.id),system_account: value,}
}else {
params = {system_account: value}
}
$axios.post(`/apaas/system/v5/user/check/account`,params)
.then((res) => {
.then((res) => {
if (res.data.code == 200) {
callback()
callback()
}else {
callback(new Error(res.data.data))
callback(new Error(res.data.data))
}
})
})
}
const checkPhoneRepet = (rule, value, callback) => {
let params = null;
if (props.id){
params = {id: parseInt(props.id),contact_phone: value,}
}else {
params = {id: 0,contact_phone: value}
}
if (props.id){
params = {id: parseInt(props.id),contact_phone: value,}
}else {
params = {id: 0,contact_phone: value}
}
$axios.post(`/apaas/system/v5/org/check`,params)
.then((res) => {
.then((res) => {
if (res.data.code == 200) {
callback()
callback()
}else {
callback(new Error(res.data.data))
callback(new Error(res.data.data))
}
})
})
}
const platformAccountFormRules = reactive({
......@@ -149,7 +149,7 @@ const platformAccountFormRules = reactive({
{min: 8,message: '密码长度不得低于8位',trigger: 'blur'}
],
confirm_password: [
{ required: true, message: '请确认密码', trigger: 'blur' },
{ required: true, message: '请确认密码', trigger: 'blur' },
{ validator: validatePass, trigger: 'blur' }
],
contact_email: [
......@@ -159,8 +159,6 @@ const platformAccountFormRules = reactive({
const roleList = ref([])
const platformAccountRef = ref(null)
const emit = defineEmits(['action'])
......@@ -186,13 +184,13 @@ const setForm = (data) => {
const getRoleList = () => {
$axios.get(`/apaas/system/v5/org/select/role?is_admin=3`)
.then((res) => {
.then((res) => {
if (res.data.code == 200) {
roleList.value = res.data.data;
roleList.value = res.data.data;
}else {
}
})
})
}
onBeforeMount(() => {
......
......@@ -34,11 +34,12 @@
</template>
</el-tree>
<Teleport to="body">
<div
<div
ref="treeActionRef"
class="tree-action"
v-show="actionFlag"
:style="{ top: acTop, left: acLeft }"
>
:style="{ top: acTop, left: acLeft, bottom:acBottom }"
>
<!-- 平台用户组织 -->
<div v-if="selectData && selectData.data_type === 2" class="action" @click="treeAction({type: 'directory',action: 'create',target: null})">新建目录</div>
<div v-if="selectData && selectData.data_type === 2" class="action" @click="treeAction({type: 'org',action: 'create',target: null})" >新建组织</div>
......@@ -65,23 +66,35 @@
import { reactive, toRefs, ref } from '@vue/reactivity'
import { getCurrentInstance, watch, nextTick} from 'vue'
import { computed, onBeforeMount, onBeforeUnmount } from '@vue/runtime-core'
import { useRouter } from 'vue-router';
import { useRoute, useRouter } from 'vue-router';
const route = useRoute()
const { proxy } = getCurrentInstance()
const { $axios,$message } = proxy
const acTop = ref(0);
const acLeft = ref(0);
const acTop = ref('');
const acLeft = ref('');
const acBottom = ref('')
const actionFlag = ref(false)
const selectData = ref(null)
const selectDataParent = ref(null)
const mvDataParent = ref([])
const treeRef = ref(null)
const treeActionRef = ref(null)
const bottomGap = ref(30) //弹窗吸底高度
const orgData = ref([])
const selectNodeObj = ref(null)
const customNodeClass = (data,node) => {
if (data.data_type == 0) {
return 'noFocus'
}else {
return ''
}
}
const defaultProps = {
label: 'name',
children: 'Child',
value: 'organization_id'
value: 'organization_id',
class: customNodeClass,
}
const getOrgTree = (data) => {
......@@ -89,6 +102,11 @@ import { useRouter } from 'vue-router';
.then((res) => {
if (res.data.code == 200) {
orgData.value = res.data.data || [];
console.log(route.query.id)
if (route.query.id) {
searchItem(orgData.value,route.query.id)
data = selectNodeObj.value
}
if(data) {
nextTick(() =>{
setCurrentNode(data)
......@@ -106,7 +124,17 @@ import { useRouter } from 'vue-router';
})
}
const searchItem = (data,id) => {
data.forEach(e => {
if (e.organization_id == id) {
selectNodeObj.value = e
}else {
if (e.Child) {
searchItem(e.Child,id)
}
}
})
}
const filterTree =(val) => {
treeRef.value.filter(val)
}
......@@ -132,13 +160,32 @@ import { useRouter } from 'vue-router';
}
const showAction = (e, data,node) => {
const rect = e.target.getBoundingClientRect(); //获取点击的dom的位置
acTop.value = rect.y - 17 + "px";
acLeft.value = rect.x + 35 + "px";
acTop.value = ''
acLeft.value = ''
acBottom.value = ''
var allHeight = document.body.scrollHeight
actionFlag.value = true;
selectData.value = data;
selectDataParent.value = node.parent.data.name ? node.parent.data : null;
mvDataParent.value = node.parent.data.Child ? node.parent.data.Child : node.parent.data;
const rect = e.target.getBoundingClientRect(); //获取点击的dom的位置
nextTick().then(()=>{
setTimeout(()=>{
var height = window.getComputedStyle(treeActionRef.value).height
height = parseInt(height)
//判断弹窗位置是否超过屏幕,超过则吸底展示
if(height+rect.y - 17>allHeight-bottomGap.value){
console.log(123)
acBottom.value = bottomGap.value+ "px";
acLeft.value = rect.x + 35 + "px";
}else{
acTop.value = rect.y - 17 + "px";
acLeft.value = rect.x + 35 + "px";
}
})
})
// acTop.value = rect.y - 17 + "px";
// acLeft.value = rect.x + 35 + "px";
};
const isSticky = (data) => {
......@@ -157,8 +204,14 @@ import { useRouter } from 'vue-router';
const emit = defineEmits(['action','select'])
const handleNodeClick = (node,nodeAttr,treeNode,event) => {
selectData.value = node;
emit('select',{data: selectData,type: 'click'});
if (node.data_type !== 0) {
selectData.value = node;
emit('select',{data: selectData,type: 'click'});
}else {
nextTick(() => {
treeRef.value.setCurrentKey(null)
})
}
//只读则无操作事件
closeAction();
}
......@@ -347,4 +400,7 @@ import { useRouter } from 'vue-router';
color: #616f94;
}
.file-tree :deep().noFocus:focus>.el-tree-node__content {
background-color: #fff;
}
</style>
\ No newline at end of file
......@@ -306,7 +306,7 @@ const getRoleRows = () => {
state.tableRows = res.data.data || []
state.tableTotal = res.data.total
}else {
ElMessage.error(re.data.data)
ElMessage.error(res.data.data)
}
})
} // 获取角色列表
......
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