Skip to content

jijin / dance-pc

Go to a project
Toggle navigation
Toggle navigation pinning
b61230d3 by zhangmeng
Options

团体类型国家协会

1 parent 13d49825
Inline Side-by-side
Showing 2 changed files with 163 additions and 124 deletions
src/viewsPc/center/teamInfo.vue
1 <template> 1 <template>
2 <div class="pd20"> 2 <div class="pd20">
3 <div class="d-form-border" style="margin-top: 0"> 3 <div class="d-form-border" style="margin-top: 0">
4 <el-form class="d-form" size="large" :model="form" ref="registerRef" :rules="registerRules" label-width="120" 4 <el-form
5 :label-position="language==0?'left':'top'" style="max-width: 500px;margin: auto"> 5 ref="registerRef" :label-position="language==0?'left':'top'" :model="form" :rules="registerRules" class="d-form"
6 label-width="120"
7 size="large" style="max-width: 500px;margin: auto"
8 >
6 <el-form-item :label="language==0?'用户名':'Account'"> 9 <el-form-item :label="language==0?'用户名':'Account'">
7 {{userName}} 10 {{ userName }}
8 </el-form-item> 11 </el-form-item>
9 <el-form-item :label="language==0?'所属国家/地区':'Country'" required> 12 <el-form-item :label="language==0?'所属国家/地区':'Country'" required>
10 <el-select filterable v-model="form.countryId" :disabled="form.type!='4'"> 13 <el-select v-model="form.countryId" :disabled="form.type!='4'" filterable>
11 <el-option v-for="item in countryList" :key="item.id" :label="language==0?item.name:item.enName" :value="item.id" /> 14 <el-option
15 v-for="item in countryList" :key="item.id" :label="language==0?item.name:item.enName"
16 :value="item.id"
17 />
12 </el-select> 18 </el-select>
13 </el-form-item> 19 </el-form-item>
14 <el-form-item :label="language==0?'详细地址':'Detailed Address'"> 20 <el-form-item :label="language==0?'详细地址':'Detailed Address'">
15 <el-cascader v-if="form.countryId == 240" 21 <el-cascader
16 v-model="form.regionId" 22 v-if="form.countryId == 240"
17 style="width: 100%;" 23 v-model="form.regionId"
18 :options="regionsList" 24 :options="regionsList"
19 :props="{ label:'text' }" 25 :props="{ label:'text' }"
26 style="width: 100%;"
20 /> 27 />
21 <el-input type="textarea" v-model="form.address" class="mt10" :placeholder="language==0?'请输入内容':''"/> 28 <el-input v-model="form.address" :placeholder="language==0?'请输入内容':''" class="mt10" type="textarea" />
22 </el-form-item> 29 </el-form-item>
23 <el-form-item :label="language==0?'机构名称':'Team Name'" required prop="name"> 30 <el-form-item :label="language==0?'机构名称':'Team Name'" prop="name" required>
24 <el-input type="text" v-model="form.name" :placeholder="language==0?'请输入内容':''"/> 31 <el-input v-model="form.name" :placeholder="language==0?'请输入内容':''" type="text" />
25 </el-form-item> 32 </el-form-item>
26 <el-form-item :label="language==0?'专业/业余':'Professional/Amateur'" prop="majorFlag"> 33 <el-form-item :label="language==0?'专业/业余':'Professional/Amateur'" prop="majorFlag">
27 <el-select v-model="form.majorFlag"> 34 <el-select v-model="form.majorFlag">
...@@ -30,37 +37,39 @@ ...@@ -30,37 +37,39 @@
30 </el-select> 37 </el-select>
31 </el-form-item> 38 </el-form-item>
32 <el-form-item :label="language==0?'团体类型':'Group type'" prop="type"> 39 <el-form-item :label="language==0?'团体类型':'Group type'" prop="type">
33 <el-select v-model="form.type" :placeholder="language==0?'请选择团体类型':''" style="width: 100%;"> 40 <el-select v-model="form.type" :placeholder="language==0?'请选择团体类型':''" style="width: 100%;">
34 <el-option :label="language==0?'普通院校':'School'" value="0" /> 41 <el-option :label="language==0?'普通院校':'School'" value="0" />
35 <el-option :label="language==0?'专业舞蹈学校':'Professional dance school'" value="1" /> 42 <el-option :label="language==0?'专业舞蹈学校':'Professional dance school'" value="1" />
36 <el-option :label="language==0?'培训机构/俱乐部':'Company/Club'" value="2" /> 43 <el-option :label="language==0?'培训机构/俱乐部':'Company/Club'" value="2" />
37 <el-option :label="language==0?'地方协会':'Local Association'" value="3" /> 44 <el-option :label="language==0?'地方协会':'Local Association'" value="3" />
38 <el-option :label="language==0?'国家协会':'National Association'" value="4" /> 45 <el-option v-show="group&&group.type==4" :label="language==0?'国家协会':'National Association'" value="4" />
39 <!-- :disabled="form.type!='4'"--> 46 <!-- :disabled="form.type!='4'"-->
40
41 </el-select> 47 </el-select>
42 </el-form-item> 48 </el-form-item>
43 <el-form-item :label="language==0?'联系人姓名':'Contact Person'" required prop="contactPerson"> 49 <el-form-item :label="language==0?'联系人姓名':'Contact Person'" prop="contactPerson" required>
44 <el-input type="text" v-model="form.contactPerson" :placeholder="language==0?'请输入内容':''"/> 50 <el-input v-model="form.contactPerson" :placeholder="language==0?'请输入内容':''" type="text" />
45 </el-form-item> 51 </el-form-item>
46 <el-form-item :label="language==0?'联系人电话':'Contact Phone'" required prop="contactTelno"> 52 <el-form-item :label="language==0?'联系人电话':'Contact Phone'" prop="contactTelno" required>
47 <el-input v-model="form.contactTelno" type="phone" :placeholder="language==0?'请输入内容':''"/> 53 <el-input v-model="form.contactTelno" :placeholder="language==0?'请输入内容':''" type="phone" />
48 </el-form-item> 54 </el-form-item>
49 <el-form-item :label="language==0?'联系人邮箱':'Contact Email'" required prop="contactEmail"> 55 <el-form-item :label="language==0?'联系人邮箱':'Contact Email'" prop="contactEmail" required>
50 <el-input v-model="form.contactEmail" type="email" :placeholder="language==0?'请输入内容':''"/> 56 <el-input v-model="form.contactEmail" :placeholder="language==0?'请输入内容':''" type="email" />
51 </el-form-item> 57 </el-form-item>
52 <el-form-item prop="imgUrl" :label="language==0?'机构Logo':'Group Logo'"> 58 <el-form-item :label="language==0?'机构Logo':'Group Logo'" prop="imgUrl">
53 <ImageUpload2 59 <ImageUpload2
54 v-model="form.imgUrl" :crop-height="200" :crop-width="200" :limit="1" 60 v-model="form.imgUrl" :crop-height="200" :crop-width="200" :is-show-tip="false"
55 :is-show-tip="false" 61 :limit="1"
56 /> 62 />
57 </el-form-item> 63 </el-form-item>
58 </el-form> 64 </el-form>
59 </div> 65 </div>
60 <div class="text-center"> 66 <div class="text-center">
61 <el-button type="primary" class="btn-lineG" round @click="save">{{ language==0?'确定修改':'Save' }}</el-button> 67 <el-button class="btn-lineG" round type="primary" @click="save">{{
68 language == 0 ? '确定修改' : 'Save'
69 }}
70 </el-button>
62 </div> 71 </div>
63 72
64 </div> 73 </div>
65 </template> 74 </template>
66 75
...@@ -74,13 +83,16 @@ const { proxy } = getCurrentInstance() ...@@ -74,13 +83,16 @@ const { proxy } = getCurrentInstance()
74 import * as match from '@/apiPc/match' 83 import * as match from '@/apiPc/match'
75 import { ElMessage, ElMessageBox } from 'element-plus' 84 import { ElMessage, ElMessageBox } from 'element-plus'
76 import useUserStore from '@/store/modules/user' 85 import useUserStore from '@/store/modules/user'
77 import _ from "lodash"; 86 import _ from 'lodash'
78 import {useStorage} from "@vueuse/core/index"; 87 import { useStorage } from '@vueuse/core/index'
79 const language= useStorage('language',0) 88
89 const language = useStorage('language', 0)
90 const group = useUserStore().group || {}
91 console.log(group)
80 const props = defineProps({ 92 const props = defineProps({
81 form:{ 93 form: {
82 type:Object, 94 type: Object,
83 required:true 95 required: true
84 } 96 }
85 }) 97 })
86 const countryList = ref([]) 98 const countryList = ref([])
...@@ -88,15 +100,17 @@ const regionsList = ref([]) ...@@ -88,15 +100,17 @@ const regionsList = ref([])
88 const regionsArr = ref([]) 100 const regionsArr = ref([])
89 const userName = ref('') 101 const userName = ref('')
90 const registerRules = ref( 102 const registerRules = ref(
91 { 103 {
92 countryId: [{ required: true, trigger: 'blur', message: '请选择所属国家' },], 104 countryId: [{ required: true, trigger: 'blur', message: '请选择所属国家' }],
93 // address: [{ required: true, trigger: 'blur', message: '请输入地址' },], 105 // address: [{ required: true, trigger: 'blur', message: '请输入地址' },],
94 name: [{ required: true, trigger: 'blur', message: '请输入' },], 106 name: [{ required: true, trigger: 'blur', message: '请输入' }],
95 contactPerson: [{ required: true, trigger: 'blur', message: '请输入' },], 107 contactPerson: [{ required: true, trigger: 'blur', message: '请输入' }],
96 contactTelno: [{ required: true, trigger: 'blur', message: '请输入' },], 108 contactTelno: [{ required: true, trigger: 'blur', message: '请输入' }],
97 contactEmail: [{ required: true, trigger: 'blur', message: '请输入' },], 109 contactEmail: [{ required: true, trigger: 'blur', message: '请输入' }]
98 // imgUrl: [{ required: true, trigger: 'blur', message: '请上传' },], 110 // imgUrl: [{ required: true, trigger: 'blur', message: '请上传' },],
99 }) 111 })
112
113
100 onMounted(() => { 114 onMounted(() => {
101 getRegionsList() 115 getRegionsList()
102 getCountryList() 116 getCountryList()
...@@ -109,11 +123,13 @@ function getRegionsList() { ...@@ -109,11 +123,13 @@ function getRegionsList() {
109 regionsList.value = res.data 123 regionsList.value = res.data
110 }) 124 })
111 } 125 }
126
112 function getCountryList() { 127 function getCountryList() {
113 match.countryList().then(res => { 128 match.countryList().then(res => {
114 countryList.value = res.data 129 countryList.value = res.data
115 }) 130 })
116 } 131 }
132
117 function save() { 133 function save() {
118 proxy.$refs['registerRef'].validate((valid) => { 134 proxy.$refs['registerRef'].validate((valid) => {
119 if (valid) { 135 if (valid) {
...@@ -121,14 +137,14 @@ function save() { ...@@ -121,14 +137,14 @@ function save() {
121 props.form.regionId = _.last(props.form.regionId) 137 props.form.regionId = _.last(props.form.regionId)
122 } 138 }
123 match.saveMyGroup(props.form).then(res => { 139 match.saveMyGroup(props.form).then(res => {
124 140
125 }) 141 })
126 } 142 }
127 }) 143 })
128 } 144 }
129 </script> 145 </script>
130 146
131 <style scoped lang="scss"> 147 <style lang="scss" scoped>
132 .app-container { 148 .app-container {
133 background: #F5F7F9; 149 background: #F5F7F9;
134 } 150 }
...@@ -141,23 +157,26 @@ function save() { ...@@ -141,23 +157,26 @@ function save() {
141 padding: 0 15px; 157 padding: 0 15px;
142 } 158 }
143 159
144 .paddingRow{ 160 .paddingRow {
145 padding: 20px; 161 padding: 20px;
146 .padding-10{ 162
163 .padding-10 {
147 padding: 10px; 164 padding: 10px;
148 .matchItem{ 165
166 .matchItem {
149 border: 1px solid #eee; 167 border: 1px solid #eee;
150 background-color: #f5f7f9; 168 background-color: #f5f7f9;
151 overflow: hidden; 169 overflow: hidden;
152 padding: 10px; 170 padding: 10px;
171
153 .leftImg { 172 .leftImg {
154 width: 100px; 173 width: 100px;
155 height: auto; 174 height: auto;
156 border-radius: 4px; 175 border-radius: 4px;
157 display: flex; 176 display: flex;
158 justify-content: center; 177 justify-content: center;
159 178
160 img{ 179 img {
161 width: 60px; 180 width: 60px;
162 height: 60px; 181 height: 60px;
163 border-radius: 50%; 182 border-radius: 50%;
...@@ -172,7 +191,8 @@ function save() { ...@@ -172,7 +191,8 @@ function save() {
172 ul { 191 ul {
173 margin: 0 20px; 192 margin: 0 20px;
174 display: flex; 193 display: flex;
175 li{ 194
195 li {
176 width: 60px; 196 width: 60px;
177 height: 20px; 197 height: 20px;
178 border-radius: 10px; 198 border-radius: 10px;
...@@ -182,123 +202,139 @@ function save() { ...@@ -182,123 +202,139 @@ function save() {
182 line-height: 20px; 202 line-height: 20px;
183 font-size: 14px; 203 font-size: 14px;
184 color: #000; 204 color: #000;
185 cursor:pointer; 205 cursor: pointer;
186 206
207 }
208
209 .active {
210 color: #fff;
211 background-color: #bf3031;
212 opacity: 1;
187 } 213 }
188 .active{
189 color: #fff;
190 background-color: #bf3031;
191 opacity: 1;
192 }
193 } 214 }
194 } 215 }
195 216
196 .mTop{ 217 .mTop {
197 margin-top: 20px; 218 margin-top: 20px;
198 } 219 }
199 .bg{ 220
200 background-color: #FBFCFD ; 221 .bg {
222 background-color: #FBFCFD;
201 border: 1px solid #eee; 223 border: 1px solid #eee;
202 padding: 10px; 224 padding: 10px;
203 .flex{ 225
204 display: flex; 226 .flex {
205 border-bottom: 1px solid #eee;
206 padding-bottom: 20px;
207 .leftImg{
208 width: 100px;
209 display: flex; 227 display: flex;
210 justify-content: center; 228 border-bottom: 1px solid #eee;
211 margin-right: 20px; 229 padding-bottom: 20px;
212 230
213 img{ 231 .leftImg {
214 width: 60px; 232 width: 100px;
215 height: 60px; 233 display: flex;
216 border-radius: 50%; 234 justify-content: center;
217 border: 0; 235 margin-right: 20px;
218 margin: 0; 236
219 } 237 img {
220 } 238 width: 60px;
221 .rightWen{ 239 height: 60px;
222 .pp{ 240 border-radius: 50%;
223 .labe{ 241 border: 0;
224 font-size: 14px; 242 margin: 0;
225 color: #7B7F83; 243 }
226 } 244 }
245
246 .rightWen {
247 .pp {
248 .labe {
249 font-size: 14px;
250 color: #7B7F83;
251 }
252 }
227 } 253 }
228 } 254 }
229 } 255 }
230 } 256
231 .bottomFunc{ 257 .bottomFunc {
232 display: flex; 258 display: flex;
233 justify-content: space-between; 259 justify-content: space-between;
234 margin-top: 12px; 260 margin-top: 12px;
235 div{ 261
236 color:#05539E ; 262 div {
263 color: #05539E;
237 font-size: 14px; 264 font-size: 14px;
238 width: 100px; 265 width: 100px;
239 text-align: center; 266 text-align: center;
240 } 267 }
241 span{ 268
269 span {
242 color: #eee; 270 color: #eee;
243 font-size: 14px; 271 font-size: 14px;
244 } 272 }
245 } 273 }
246 274
247 // 人员管理 275 // 人员管理
248 .teamSingle{ 276 .teamSingle {
249 background-color: #fff; 277 background-color: #fff;
250 padding: 20px; 278 padding: 20px;
251 279
252 .flex{ 280 .flex {
253 display: flex; 281 display: flex;
254 margin-top: 20px; 282 margin-top: 20px;
255 .leftIMg{ 283
284 .leftIMg {
256 width: 100px; 285 width: 100px;
257 height: 100px; 286 height: 100px;
258 margin-right: 20px; 287 margin-right: 20px;
259 img{ 288
289 img {
260 width: 100px; 290 width: 100px;
261 height: 100px; 291 height: 100px;
262 border-radius: 50%; 292 border-radius: 50%;
263 } 293 }
264 } 294 }
265 .rightContent{ 295
266 .rightTop{ 296 .rightContent {
267 color: #000000; 297 .rightTop {
268 font-weight: 500; 298 color: #000000;
269 font-size: 18px; 299 font-weight: 500;
270 } 300 font-size: 18px;
271 .el-row{ 301 }
272 .el-col-12{ 302
273 font-weight: 400; 303 .el-row {
274 color: #4C5359; 304 .el-col-12 {
275 font-size: 14px; 305 font-weight: 400;
276 padding: 5px 0; 306 color: #4C5359;
307 font-size: 14px;
308 padding: 5px 0;
277 } 309 }
278 } 310 }
279 } 311 }
280 312
281 } 313 }
282 .name{ 314
283 height: 25px; 315 .name {
284 line-height: 25px; 316 height: 25px;
285 display: flex; 317 line-height: 25px;
286 .tag-view{ 318 display: flex;
287 margin-left: 10px; 319
320 .tag-view {
321 margin-left: 10px;
322 }
288 } 323 }
289 } 324
290 .pp{ 325 .pp {
291 font-size: 14px;
292 font-weight: 400;
293 margin: 5px 0;
294 .labe{
295 font-size: 14px; 326 font-size: 14px;
296 color: #7B7F83; 327 font-weight: 400;
328 margin: 5px 0;
329
330 .labe {
331 font-size: 14px;
332 color: #7B7F83;
333 }
297 } 334 }
298 }
299 } 335 }
300 336
301 .m-height{ 337 .m-height {
302 border-bottom: 1px solid #eee; 338 border-bottom: 1px solid #eee;
303 padding-bottom: 20px; 339 padding-bottom: 20px;
304 } 340 }
......
src/viewsPc/register/team/step2.vue
...@@ -47,7 +47,7 @@ ...@@ -47,7 +47,7 @@
47 <el-form-item :label="language==0?'代表国家/地区':'Representing'" prop="countryId" required> 47 <el-form-item :label="language==0?'代表国家/地区':'Representing'" prop="countryId" required>
48 <el-select v-model="form.countryId" :disabled="language==0&&form.is=='0'" filterable> 48 <el-select v-model="form.countryId" :disabled="language==0&&form.is=='0'" filterable>
49 <!-- <el-option v-for="item in countryList" :key="item.id" :label="language==0?item.name:item.enName" :value="item.id"/>--> 49 <!-- <el-option v-for="item in countryList" :key="item.id" :label="language==0?item.name:item.enName" :value="item.id"/>-->
50 <el-option v-for="item in countryList" :key="item.id" :label="item.noc||item.enName" :value="item.id" /> 50 <el-option v-for="(item,inx) in countryList" :key="inx" :label="item.noc||item.enName" :value="item.id" />
51 </el-select> 51 </el-select>
52 </el-form-item> 52 </el-form-item>
53 <el-form-item :label="language==0?'详细地址':'Address'" :required="form.is=='0'" prop="address"> 53 <el-form-item :label="language==0?'详细地址':'Address'" :required="form.is=='0'" prop="address">
...@@ -67,7 +67,8 @@ ...@@ -67,7 +67,8 @@
67 <el-option :label="language==0?'培训机构/俱乐部':'Company/Club'" value="2" /> 67 <el-option :label="language==0?'培训机构/俱乐部':'Company/Club'" value="2" />
68 <el-option :label="language==0?'地方协会':'Local Association'" value="3" /> 68 <el-option :label="language==0?'地方协会':'Local Association'" value="3" />
69 <el-option 69 <el-option
70 :disabled="form.is=='0'" :hidden="userStore.group.id" 70 v-show="group&&group.type==4"
71 :disabled="form.is=='0'"
71 :label="language==0?'国家协会':'National Association'" value="4" 72 :label="language==0?'国家协会':'National Association'" value="4"
72 /> 73 />
73 </el-select> 74 </el-select>
...@@ -146,7 +147,7 @@ ...@@ -146,7 +147,7 @@
146 147
147 <script setup> 148 <script setup>
148 import { getCurrentInstance } from '@vue/runtime-core' 149 import { getCurrentInstance } from '@vue/runtime-core'
149 import { onMounted, toRefs, reactive } from 'vue' 150 import { onMounted, toRefs, reactive, ref } from 'vue'
150 import * as match from '@/apiPc/match' 151 import * as match from '@/apiPc/match'
151 import { ElMessage } from 'element-plus' 152 import { ElMessage } from 'element-plus'
152 import { setToken } from '@/utils/auth' 153 import { setToken } from '@/utils/auth'
...@@ -162,6 +163,8 @@ const emit = defineEmits(['submit', 'prev']) ...@@ -162,6 +163,8 @@ const emit = defineEmits(['submit', 'prev'])
162 const language = useStorage('language', 0) 163 const language = useStorage('language', 0)
163 const userStore = useUserStore() 164 const userStore = useUserStore()
164 const user = useUserStore().user 165 const user = useUserStore().user
166 const group = useUserStore().group || {}
167 console.log(group)
165 const props = defineProps({ 168 const props = defineProps({
166 accont: { 169 accont: {
167 type: String, 170 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!