b61230d3 by zhangmeng

团体类型国家协会

1 parent 13d49825
<template>
<div class="pd20">
<div class="d-form-border" style="margin-top: 0">
<el-form class="d-form" size="large" :model="form" ref="registerRef" :rules="registerRules" label-width="120"
:label-position="language==0?'left':'top'" style="max-width: 500px;margin: auto">
<el-form
ref="registerRef" :label-position="language==0?'left':'top'" :model="form" :rules="registerRules" class="d-form"
label-width="120"
size="large" style="max-width: 500px;margin: auto"
>
<el-form-item :label="language==0?'用户名':'Account'">
{{userName}}
{{ userName }}
</el-form-item>
<el-form-item :label="language==0?'所属国家/地区':'Country'" required>
<el-select filterable v-model="form.countryId" :disabled="form.type!='4'">
<el-option v-for="item in countryList" :key="item.id" :label="language==0?item.name:item.enName" :value="item.id" />
<el-select v-model="form.countryId" :disabled="form.type!='4'" filterable>
<el-option
v-for="item in countryList" :key="item.id" :label="language==0?item.name:item.enName"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item :label="language==0?'详细地址':'Detailed Address'">
<el-cascader v-if="form.countryId == 240"
<el-cascader
v-if="form.countryId == 240"
v-model="form.regionId"
style="width: 100%;"
:options="regionsList"
:props="{ label:'text' }"
style="width: 100%;"
/>
<el-input type="textarea" v-model="form.address" class="mt10" :placeholder="language==0?'请输入内容':''"/>
<el-input v-model="form.address" :placeholder="language==0?'请输入内容':''" class="mt10" type="textarea" />
</el-form-item>
<el-form-item :label="language==0?'机构名称':'Team Name'" required prop="name">
<el-input type="text" v-model="form.name" :placeholder="language==0?'请输入内容':''"/>
<el-form-item :label="language==0?'机构名称':'Team Name'" prop="name" required>
<el-input v-model="form.name" :placeholder="language==0?'请输入内容':''" type="text" />
</el-form-item>
<el-form-item :label="language==0?'专业/业余':'Professional/Amateur'" prop="majorFlag">
<el-select v-model="form.majorFlag">
......@@ -35,30 +42,32 @@
<el-option :label="language==0?'专业舞蹈学校':'Professional dance school'" value="1" />
<el-option :label="language==0?'培训机构/俱乐部':'Company/Club'" value="2" />
<el-option :label="language==0?'地方协会':'Local Association'" value="3" />
<el-option :label="language==0?'国家协会':'National Association'" value="4" />
<!-- :disabled="form.type!='4'"-->
<el-option v-show="group&&group.type==4" :label="language==0?'国家协会':'National Association'" value="4" />
<!-- :disabled="form.type!='4'"-->
</el-select>
</el-form-item>
<el-form-item :label="language==0?'联系人姓名':'Contact Person'" required prop="contactPerson">
<el-input type="text" v-model="form.contactPerson" :placeholder="language==0?'请输入内容':''"/>
<el-form-item :label="language==0?'联系人姓名':'Contact Person'" prop="contactPerson" required>
<el-input v-model="form.contactPerson" :placeholder="language==0?'请输入内容':''" type="text" />
</el-form-item>
<el-form-item :label="language==0?'联系人电话':'Contact Phone'" required prop="contactTelno">
<el-input v-model="form.contactTelno" type="phone" :placeholder="language==0?'请输入内容':''"/>
<el-form-item :label="language==0?'联系人电话':'Contact Phone'" prop="contactTelno" required>
<el-input v-model="form.contactTelno" :placeholder="language==0?'请输入内容':''" type="phone" />
</el-form-item>
<el-form-item :label="language==0?'联系人邮箱':'Contact Email'" required prop="contactEmail">
<el-input v-model="form.contactEmail" type="email" :placeholder="language==0?'请输入内容':''"/>
<el-form-item :label="language==0?'联系人邮箱':'Contact Email'" prop="contactEmail" required>
<el-input v-model="form.contactEmail" :placeholder="language==0?'请输入内容':''" type="email" />
</el-form-item>
<el-form-item prop="imgUrl" :label="language==0?'机构Logo':'Group Logo'">
<el-form-item :label="language==0?'机构Logo':'Group Logo'" prop="imgUrl">
<ImageUpload2
v-model="form.imgUrl" :crop-height="200" :crop-width="200" :limit="1"
:is-show-tip="false"
v-model="form.imgUrl" :crop-height="200" :crop-width="200" :is-show-tip="false"
:limit="1"
/>
</el-form-item>
</el-form>
</div>
<div class="text-center">
<el-button type="primary" class="btn-lineG" round @click="save">{{ language==0?'确定修改':'Save' }}</el-button>
<el-button class="btn-lineG" round type="primary" @click="save">{{
language == 0 ? '确定修改' : 'Save'
}}
</el-button>
</div>
</div>
......@@ -74,13 +83,16 @@ const { proxy } = getCurrentInstance()
import * as match from '@/apiPc/match'
import { ElMessage, ElMessageBox } from 'element-plus'
import useUserStore from '@/store/modules/user'
import _ from "lodash";
import {useStorage} from "@vueuse/core/index";
const language= useStorage('language',0)
import _ from 'lodash'
import { useStorage } from '@vueuse/core/index'
const language = useStorage('language', 0)
const group = useUserStore().group || {}
console.log(group)
const props = defineProps({
form:{
type:Object,
required:true
form: {
type: Object,
required: true
}
})
const countryList = ref([])
......@@ -89,14 +101,16 @@ const regionsArr = ref([])
const userName = ref('')
const registerRules = ref(
{
countryId: [{ required: true, trigger: 'blur', message: '请选择所属国家' },],
countryId: [{ required: true, trigger: 'blur', message: '请选择所属国家' }],
// address: [{ required: true, trigger: 'blur', message: '请输入地址' },],
name: [{ required: true, trigger: 'blur', message: '请输入' },],
contactPerson: [{ required: true, trigger: 'blur', message: '请输入' },],
contactTelno: [{ required: true, trigger: 'blur', message: '请输入' },],
contactEmail: [{ required: true, trigger: 'blur', message: '请输入' },],
name: [{ required: true, trigger: 'blur', message: '请输入' }],
contactPerson: [{ required: true, trigger: 'blur', message: '请输入' }],
contactTelno: [{ required: true, trigger: 'blur', message: '请输入' }],
contactEmail: [{ required: true, trigger: 'blur', message: '请输入' }]
// imgUrl: [{ required: true, trigger: 'blur', message: '请上传' },],
})
onMounted(() => {
getRegionsList()
getCountryList()
......@@ -109,11 +123,13 @@ function getRegionsList() {
regionsList.value = res.data
})
}
function getCountryList() {
match.countryList().then(res => {
countryList.value = res.data
})
}
function save() {
proxy.$refs['registerRef'].validate((valid) => {
if (valid) {
......@@ -128,7 +144,7 @@ function save() {
}
</script>
<style scoped lang="scss">
<style lang="scss" scoped>
.app-container {
background: #F5F7F9;
}
......@@ -141,15 +157,18 @@ function save() {
padding: 0 15px;
}
.paddingRow{
.paddingRow {
padding: 20px;
.padding-10{
.padding-10 {
padding: 10px;
.matchItem{
.matchItem {
border: 1px solid #eee;
background-color: #f5f7f9;
overflow: hidden;
padding: 10px;
.leftImg {
width: 100px;
height: auto;
......@@ -157,7 +176,7 @@ function save() {
display: flex;
justify-content: center;
img{
img {
width: 60px;
height: 60px;
border-radius: 50%;
......@@ -172,7 +191,8 @@ function save() {
ul {
margin: 0 20px;
display: flex;
li{
li {
width: 60px;
height: 20px;
border-radius: 10px;
......@@ -182,10 +202,11 @@ function save() {
line-height: 20px;
font-size: 14px;
color: #000;
cursor:pointer;
cursor: pointer;
}
.active{
.active {
color: #fff;
background-color: #bf3031;
opacity: 1;
......@@ -193,24 +214,27 @@ function save() {
}
}
.mTop{
.mTop {
margin-top: 20px;
}
.bg{
background-color: #FBFCFD ;
.bg {
background-color: #FBFCFD;
border: 1px solid #eee;
padding: 10px;
.flex{
.flex {
display: flex;
border-bottom: 1px solid #eee;
padding-bottom: 20px;
.leftImg{
.leftImg {
width: 100px;
display: flex;
justify-content: center;
margin-right: 20px;
img{
img {
width: 60px;
height: 60px;
border-radius: 50%;
......@@ -218,58 +242,66 @@ function save() {
margin: 0;
}
}
.rightWen{
.pp{
.labe{
.rightWen {
.pp {
.labe {
font-size: 14px;
color: #7B7F83;
}
}
}
}
}
}
.bottomFunc{
.bottomFunc {
display: flex;
justify-content: space-between;
margin-top: 12px;
div{
color:#05539E ;
div {
color: #05539E;
font-size: 14px;
width: 100px;
text-align: center;
}
span{
span {
color: #eee;
font-size: 14px;
}
}
// 人员管理
.teamSingle{
.teamSingle {
background-color: #fff;
padding: 20px;
.flex{
.flex {
display: flex;
margin-top: 20px;
.leftIMg{
.leftIMg {
width: 100px;
height: 100px;
margin-right: 20px;
img{
img {
width: 100px;
height: 100px;
border-radius: 50%;
}
}
.rightContent{
.rightTop{
.rightContent {
.rightTop {
color: #000000;
font-weight: 500;
font-size: 18px;
}
.el-row{
.el-col-12{
.el-row {
.el-col-12 {
font-weight: 400;
color: #4C5359;
font-size: 14px;
......@@ -279,26 +311,30 @@ function save() {
}
}
.name{
.name {
height: 25px;
line-height: 25px;
display: flex;
.tag-view{
.tag-view {
margin-left: 10px;
}
}
.pp{
.pp {
font-size: 14px;
font-weight: 400;
margin: 5px 0;
.labe{
.labe {
font-size: 14px;
color: #7B7F83;
}
}
}
.m-height{
.m-height {
border-bottom: 1px solid #eee;
padding-bottom: 20px;
}
......
......@@ -47,7 +47,7 @@
<el-form-item :label="language==0?'代表国家/地区':'Representing'" prop="countryId" required>
<el-select v-model="form.countryId" :disabled="language==0&&form.is=='0'" filterable>
<!-- <el-option v-for="item in countryList" :key="item.id" :label="language==0?item.name:item.enName" :value="item.id"/>-->
<el-option v-for="item in countryList" :key="item.id" :label="item.noc||item.enName" :value="item.id" />
<el-option v-for="(item,inx) in countryList" :key="inx" :label="item.noc||item.enName" :value="item.id" />
</el-select>
</el-form-item>
<el-form-item :label="language==0?'详细地址':'Address'" :required="form.is=='0'" prop="address">
......@@ -67,7 +67,8 @@
<el-option :label="language==0?'培训机构/俱乐部':'Company/Club'" value="2" />
<el-option :label="language==0?'地方协会':'Local Association'" value="3" />
<el-option
:disabled="form.is=='0'" :hidden="userStore.group.id"
v-show="group&&group.type==4"
:disabled="form.is=='0'"
:label="language==0?'国家协会':'National Association'" value="4"
/>
</el-select>
......@@ -146,7 +147,7 @@
<script setup>
import { getCurrentInstance } from '@vue/runtime-core'
import { onMounted, toRefs, reactive } from 'vue'
import { onMounted, toRefs, reactive, ref } from 'vue'
import * as match from '@/apiPc/match'
import { ElMessage } from 'element-plus'
import { setToken } from '@/utils/auth'
......@@ -162,6 +163,8 @@ const emit = defineEmits(['submit', 'prev'])
const language = useStorage('language', 0)
const userStore = useUserStore()
const user = useUserStore().user
const group = useUserStore().group || {}
console.log(group)
const props = defineProps({
accont: {
type: String,
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!