Commit 86b042cd authored by 张俊's avatar 张俊

组织管理编辑页面

parent 1ed97988
<template> <template>
<div> <div class="detail_contain">
1111 <p class="now_page_title">
权限管理 / 组织管理 /
<span>组织编辑</span>
</p>
<div class="info_contain">
<el-form ref="form" :rules="rules" :model="form" label-width="0px">
<el-form-item prop="name">
<p class="formname">组织机构名称:</p>
<el-input v-model="form.name"></el-input>
</el-form-item>
<el-form-item prop="shortname">
<p class="formname">组织机构简称:</p>
<el-input v-model="form.shortname"></el-input>
</el-form-item>
<el-form-item prop="code">
<p class="formname">组织机构编码:</p>
<el-input v-model="form.code" disabled></el-input>
</el-form-item>
<el-form-item prop="fileList">
<p class="formname">组织机构图标:</p>
<upload-file
:multiple="false"
:max="1"
type="picture"
:readOnly="false"
fit="fill"
:list="imgList"
@getNewList="getNewList"
ref="servicepic"
></upload-file>
<span class="removepic" @click="removepic">更换封面</span>
</el-form-item>
<el-form-item prop="desc">
<p class="formname">说明:</p>
<el-input type="textarea" v-model="form.desc"></el-input>
</el-form-item>
<el-form-item prop="person">
<p class="formname">创建人:</p>
<el-input v-model="form.person" disabled></el-input>
</el-form-item>
<el-form-item prop="date">
<p class="formname">创建日期:</p>
<el-input v-model="form.date" disabled></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit('form')" class="right">保存</el-button>
<el-button class="right">取消</el-button>
</el-form-item>
</el-form>
</div>
</div> </div>
</template> </template>
<script> <script>
import uploadFile from '@/components/upload_file'
import { getRole } from "@/utils/common";
export default { export default {
props: [], props: {},
components: { components: {
uploadFile
}, },
data() { data() {
return { return {
form: {
}; name: '',
shortname:'',
code:'',
desc:'',
person:'',
date:'',
fileList:''
}, },
watch: { open:true,
open1:false,
open2:'true',
now_user: 2, //0:普通用户,1:组织管理员,2:超级管理员
imgList: [],
area_arr:[
{
label:'应急领域',
value:0,
}, },
computed: { {
label:'公安领域',
value:1,
}, },
created() { {
label:'交通领域',
value:2,
},
{
label:'全领域',
value:3,
}
],
type_arr:[
{
label:'基础工具',
value:0,
},
{
label:'通用应用',
value:1,
}, },
mounted() { {
label:'业务应用',
value:2,
},
{
label:'其他',
value:3,
}
],
origin_arr:[],
rules:{
name:[
{ required: true, message: '请输入组织机构名称', trigger: 'blur' },
],
shortname:[
{ required: true, message: '请输入组织机构简称', trigger: 'blur' },
],
desc:[
{ required: true, message: '请输入组织说明', trigger: 'blur' },
{ max: 200, message: '长度小于200个字符', trigger: 'blur' }
],
fileList:[
{required: true, message: '请上传图片', trigger: 'change'}
]
}
};
}, },
watch: {},
computed: {},
created() {
this.now_user = this.$store.state.role
getRole().then(data => {
this.now_user = data;
this.$store.commit('rolefun',data)
this.getOriginArr()
});
},
mounted() {},
methods: { methods: {
getOriginArr(){
this.$http
.get('/static/serviceedit.json')
.then(response => {
let data = response.data.data
this.origin_arr = data.origin_arr
})
.catch(function(response) {
});
},
removepic(){
this.$refs.servicepic.handleRemove()
},
onSubmit(formName) {
console.log('submit!');
this.$refs[formName].validate((valid) => {
if (valid) {
alert('submit!');
} else {
console.log('error submit!!');
return false;
}
});
}, },
getNewList(val) {
console.log(val);
this.form.fileList = ""
this.form.fileList = url.map((v,k)=>{
return v.url
}).join(';')
console.log(this.form.fileList)
}
}
}; };
</script> </script>
<style>
.info_contain .el-input__inner{
background-color: #f7f8f9;
width: 1022px;
}
.info_contain .el-textarea__inner{
background-color: #f7f8f9;
width: 1022px;
}
.limitsd .timeslect .el-input__inner{
width: 150px;
border-radius: 0 8px 8px 0;
background-color: rgba(15, 38, 131, 1);
color: rgba(248, 249, 253, 1);
border: 0;
}
.info_contain .el-input.is-disabled .el-input__inner{
background-color: #e3e4e6;
}
</style>
<style scoped> <style scoped>
.detail_contain {
width: 100%;
padding: 0 20px;
height: calc(100% - 55px);
}
.info_contain {
padding: 25px 20px;
background-color: #fff;
width: 100%;
box-shadow: 0px 3px 6px 0px #f4f7fc;
border-radius: 12px;
min-height: calc(100% - 20px);
margin-bottom: 20px;
position: relative;
}
.now_page_title {
margin: 15px 0;
color: #898d9e;
}
.now_page_title span {
color: #242c43;
}
.formname{
color: #58617a;
}
.right{
float: right;
margin-left: 20px;
}
.removepic{
display: inline-block;
margin-top: -40px;
float: left;
margin-left: 180px;
width: 76px;
height: 32px;
background-color: #495feb;
border-radius: 8px;
line-height: 32px;
text-align: center;
color: #e6ebfe;
cursor: pointer;
}
.edit_change{
width: 100%;
border-bottom: 2px solid #f4f7fc;
overflow: hidden;
}
.edit_change_box{
width: 163px;
height: 48px;
line-height: 48px;
background-color: #e3e5ef;
border-radius: 8px;
color: #8890a7;
text-align: center;
float: left;
margin-right: 20px;
font-weight: 600;
margin-bottom: 25px;
font-size: 16px;
cursor: pointer;
}
.edit_change_box img{
vertical-align: -3px;
margin-right: 5px;
}
.safe_title{
width: 100%;
height: 65px;
line-height: 65px;
border-bottom: 2px solid #f4f7fc;
}
.safe_select{
float: left;
width: auto;
margin-right: 40px;
height: 65px;
cursor: pointer;
}
.safe_box_select{
padding: 30px 10px 10px 10px;
width: 100%;
height: 100%;
}
.openbgc{
width: 56px;
height: 23px;
background-image: url('~@/assets/imgs/btn_on_hov.png');
background-size:contain;
cursor: pointer;
}
.formtitle{
color: #58617a;
margin: 15px 0;
}
.savebtn{
position: absolute;
right: 20px;
bottom:20px;
width: 278px;
overflow: hidden;
}
.btnsty{
width: 124px;
height: 44px;
line-height: 44px;
background-color: rgba(195, 202, 248, 0.5);
border-radius: 8px;
color: rgba(15, 38, 131, 1);
text-align: center;
float: left;
margin-right: 30px;
cursor: pointer;
}
.savebtn .btnsty:nth-last-of-type(1){
margin-right: 0px;
background-color: rgba(15, 38, 131, 1);
color: rgba(248, 249, 253, 1);
}
.limitsd{
position: relative;
width: 1022px;
}
.limitsd .timeslect{
position: absolute;
right: 0;
}
</style> </style>
<template>
<div class="detail_contain">
<p class="now_page_title">
权限管理 / 组织管理 / 组织详情 /
<span>用户管理</span>
</p>
<div class="info_contain">
<el-form ref="form" :rules="rules" :model="form" label-width="0px">
<el-form-item prop="account">
<p class="formname">用户账号:</p>
<el-input v-model="form.account"></el-input>
</el-form-item>
<el-form-item prop="password">
<p class="formname">登录密码:</p>
<el-input v-model="form.password"></el-input>
</el-form-item>
<el-form-item prop="nickname">
<p class="formname">昵称:</p>
<el-input v-model="form.nickname"></el-input>
</el-form-item>
<el-form-item prop="type">
<p class="formname">用户类型:</p>
<el-select v-model="form.type" placeholder="请选择">
<el-option
v-for="item in typeoptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item prop="systemname">
<p class="formname">业务系统名称:</p>
<el-input v-model="form.systemname"></el-input>
</el-form-item>
<el-form-item prop="domain" v-if="now_user==0">
<p class="formname">域名:</p>
<el-input v-model="form.domain"></el-input>
</el-form-item>
<el-form-item prop="ip" v-if="now_user==0">
<p class="formname">IP地址:</p>
<el-input v-model="form.ip"></el-input>
</el-form-item>
<el-form-item prop="contact">
<p class="formname">联系人:</p>
<el-input v-model="form.contact"></el-input>
</el-form-item>
<el-form-item prop="phone">
<p class="formname">手机号码:</p>
<el-input v-model="form.phone"></el-input>
</el-form-item>
<el-form-item prop="email">
<p class="formname">邮箱:</p>
<el-input v-model="form.email"></el-input>
</el-form-item>
<el-form-item prop="origin">
<p class="formname">用户组织机构:</p>
<el-select v-model="form.origin" placeholder="请选择">
<el-option
v-for="item in originoptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item prop="able">
<p class="formname">是否禁用:</p>
<el-select v-model="form.able" placeholder="请选择">
<el-option
v-for="item in ableoptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item prop="desc">
<p class="formname">描述:</p>
<el-input type="textarea" v-model="form.desc"></el-input>
</el-form-item>
<el-form-item prop="person">
<p class="formname">登记人:</p>
<el-input v-model="form.person" disabled></el-input>
</el-form-item>
<el-form-item prop="date">
<p class="formname">登记日期:</p>
<el-input v-model="form.date" disabled></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit('form')" class="right">保存</el-button>
<el-button class="right">取消</el-button>
</el-form-item>
</el-form>
</div>
</div>
</template>
<script>
import uploadFile from '@/components/upload_file'
import { getRole } from "@/utils/common";
export default {
props: {},
components: {
uploadFile
},
data() {
return {
form: {
account:'',
password:'',
nickname:'',
type:'',
systemname:'',
contact:'',
phone:'',
email:'',
origin:'',
able:'',
desc:'',
person:'',
date:'',
},
open:true,
open1:false,
open2:'true',
now_user: 0, //0:普通用户,1:组织管理员,2:超级管理员
typeoptions:[
{
label:'普通用户',
value:0,
},
{
label:'组织管理员',
value:1,
},
{
label:'超级管理员',
value:2,
},
{
label:'开发者',
value:3,
}
],
originoptions:[
{
label:'贵阳水利局',
value:0,
},
{
label:'云上贵州',
value:1,
},
{
label:'迪艾斯',
value:2,
},
],
ableoptions:[
{
label:'',
value:1,
},
{
label:'',
value:0,
},
],
origin_arr:[],
rules:{
able:[
{ required: true, message: '请选择是否禁用', trigger: 'change' }
],
domain:[
{ required: true, message: '请输入域名', trigger: 'blur' }
],
ip:[
{ required: true, message: '请输入ip地址', trigger: 'blur' }
],
}
};
},
watch: {},
computed: {},
created() {
this.now_user = this.$store.state.role
getRole().then(data => {
this.now_user = data;
this.now_user = 0;
console.log(data);
this.$store.commit('rolefun',data)
this.getOriginArr()
});
},
mounted() {},
methods: {
getOriginArr(){
this.$http
.get('/static/serviceedit.json')
.then(response => {
let data = response.data.data
this.origin_arr = data.origin_arr
})
.catch(function(response) {
});
},
removepic(){
this.$refs.servicepic.handleRemove()
},
onSubmit(formName) {
console.log('submit!');
this.$refs[formName].validate((valid) => {
if (valid) {
alert('submit!');
} else {
console.log('error submit!!');
return false;
}
});
},
getNewList(val) {
console.log(val);
this.form.fileList = ""
this.form.fileList = url.map((v,k)=>{
return v.url
}).join(';')
console.log(this.form.fileList)
}
}
};
</script>
<style>
.info_contain .el-input__inner{
background-color: #f7f8f9;
width: 1022px;
}
.info_contain .el-textarea__inner{
background-color: #f7f8f9;
width: 1022px;
}
.limitsd .timeslect .el-input__inner{
width: 150px;
border-radius: 0 8px 8px 0;
background-color: rgba(15, 38, 131, 1);
color: rgba(248, 249, 253, 1);
border: 0;
}
.info_contain .el-input.is-disabled .el-input__inner{
background-color: #e3e4e6;
}
</style>
<style scoped>
.detail_contain {
width: 100%;
padding: 0 20px;
height: calc(100% - 55px);
}
.info_contain {
padding: 25px 20px;
background-color: #fff;
width: 100%;
box-shadow: 0px 3px 6px 0px #f4f7fc;
border-radius: 12px;
min-height: calc(100% - 20px);
margin-bottom: 20px;
position: relative;
}
.now_page_title {
margin: 15px 0;
color: #898d9e;
}
.now_page_title span {
color: #242c43;
}
.formname{
color: #58617a;
}
.right{
float: right;
margin-left: 20px;
}
.removepic{
display: inline-block;
margin-top: -40px;
float: left;
margin-left: 180px;
width: 76px;
height: 32px;
background-color: #495feb;
border-radius: 8px;
line-height: 32px;
text-align: center;
color: #e6ebfe;
cursor: pointer;
}
.edit_change{
width: 100%;
border-bottom: 2px solid #f4f7fc;
overflow: hidden;
}
.edit_change_box{
width: 163px;
height: 48px;
line-height: 48px;
background-color: #e3e5ef;
border-radius: 8px;
color: #8890a7;
text-align: center;
float: left;
margin-right: 20px;
font-weight: 600;
margin-bottom: 25px;
font-size: 16px;
cursor: pointer;
}
.edit_change_box img{
vertical-align: -3px;
margin-right: 5px;
}
.safe_title{
width: 100%;
height: 65px;
line-height: 65px;
border-bottom: 2px solid #f4f7fc;
}
.safe_select{
float: left;
width: auto;
margin-right: 40px;
height: 65px;
cursor: pointer;
}
.safe_box_select{
padding: 30px 10px 10px 10px;
width: 100%;
height: 100%;
}
.openbgc{
width: 56px;
height: 23px;
background-image: url('~@/assets/imgs/btn_on_hov.png');
background-size:contain;
cursor: pointer;
}
.formtitle{
color: #58617a;
margin: 15px 0;
}
.savebtn{
position: absolute;
right: 20px;
bottom:20px;
width: 278px;
overflow: hidden;
}
.btnsty{
width: 124px;
height: 44px;
line-height: 44px;
background-color: rgba(195, 202, 248, 0.5);
border-radius: 8px;
color: rgba(15, 38, 131, 1);
text-align: center;
float: left;
margin-right: 30px;
cursor: pointer;
}
.savebtn .btnsty:nth-last-of-type(1){
margin-right: 0px;
background-color: rgba(15, 38, 131, 1);
color: rgba(248, 249, 253, 1);
}
.limitsd{
position: relative;
width: 1022px;
}
.limitsd .timeslect{
position: absolute;
right: 0;
}
</style>
...@@ -229,10 +229,20 @@ export default new Router({ ...@@ -229,10 +229,20 @@ export default new Router({
component: () => import("@/pages/authority/organization"), component: () => import("@/pages/authority/organization"),
}, },
{ {
path: "/authority/organizationdetail", // 组织管理 path: "/authority/organizationdetail", // 组织管理详情
name: "organizationdetail", name: "organizationdetail",
component: () => import("@/pages/authority/organizationdetail"), component: () => import("@/pages/authority/organizationdetail"),
}, },
{
path: "/authority/organizationedit", // 组织管理组织编辑
name: "organizationedit",
component: () => import("@/pages/authority/organizationedit"),
},
{
path: "/authority/organizationuser", // 组织管理组织用户
name: "organizationuser",
component: () => import("@/pages/authority/organizationuser"),
},
{ {
path: "/authority/users", // 用户管理页 path: "/authority/users", // 用户管理页
name: "users", name: "users",
......
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