Showing
1 changed file
with
210 additions
and
353 deletions
| 1 | -<template> | |
| 2 | - <div class="card"> | |
| 3 | - <Card :bordered="false" class="card"> | |
| 4 | - <BasicForm @register="registerForm"> | |
| 5 | - <template #qrcode> | |
| 6 | - <ContentUploadText> | |
| 7 | - <template #uploadImg> | |
| 8 | - <CustomUploadComp :imgUrl="qrcodePic" @setImg="handleSetCodeImgUrl" /> | |
| 9 | - </template> | |
| 10 | - <template #uploadText> | |
| 11 | - <div class="box-outline"> 支持.PNG、.JPG格式,建议尺寸为300*300px,大小不超过5M </div> | |
| 12 | - </template> | |
| 13 | - </ContentUploadText> | |
| 14 | - </template> | |
| 15 | - <template #customProv> | |
| 16 | - <BasicForm @register="registerCustomForm" /> | |
| 17 | - </template> | |
| 18 | - </BasicForm> | |
| 19 | - </Card> | |
| 20 | - <Loading v-bind="compState" /> | |
| 21 | - <Authority value="api:yt:enterprise:update:update"> | |
| 22 | - <a-button | |
| 23 | - v-if="isWhereAdmin !== 'CUSTOMER_USER'" | |
| 24 | - @click="handleUpdateInfo" | |
| 25 | - type="primary" | |
| 26 | - class="mt-4" | |
| 27 | - >更新基本信息</a-button | |
| 28 | - > | |
| 29 | - </Authority> | |
| 30 | - </div> | |
| 31 | -</template> | |
| 32 | - | |
| 33 | -<script lang="ts"> | |
| 34 | - import { defineComponent, onMounted, ref, computed } from 'vue'; | |
| 35 | - import { Card } from 'ant-design-vue'; | |
| 36 | - import { BasicForm, useForm } from '/@/components/Form/index'; | |
| 37 | - import { schemas, provSchemas } from '../config/enterPriseInfo.config'; | |
| 38 | - import { getAreaList, getEnterPriseDetail, updateEnterPriseDetail } from '/@/api/oem/index'; | |
| 39 | - import { Loading } from '/@/components/Loading'; | |
| 40 | - import { useMessage } from '/@/hooks/web/useMessage'; | |
| 41 | - import { useUserStore } from '/@/store/modules/user'; | |
| 42 | - import { createLocalStorage } from '/@/utils/cache'; | |
| 43 | - import type { CityItem, Code } from '../types'; | |
| 44 | - import { Authority } from '/@/components/Authority'; | |
| 45 | - import { USER_INFO_KEY } from '/@/enums/cacheEnum'; | |
| 46 | - import { getAuthCache } from '/@/utils/auth'; | |
| 47 | - import ContentUploadText from './ContentUploadText.vue'; | |
| 48 | - import { CustomUploadComp } from './customUplaod/index'; | |
| 49 | - | |
| 50 | - export default defineComponent({ | |
| 51 | - components: { | |
| 52 | - Card, | |
| 53 | - BasicForm, | |
| 54 | - Loading, | |
| 55 | - Authority, | |
| 56 | - ContentUploadText, | |
| 57 | - CustomUploadComp, | |
| 58 | - }, | |
| 59 | - setup() { | |
| 60 | - const userInfo: any = getAuthCache(USER_INFO_KEY); | |
| 61 | - const isWhereAdmin: any = computed(() => { | |
| 62 | - if (userInfo.roles.includes('TENANT_ADMIN')) { | |
| 63 | - return 'TENANT_ADMIN'; | |
| 64 | - } else if (userInfo.roles.includes('CUSTOMER_USER')) { | |
| 65 | - return 'CUSTOMER_USER'; | |
| 66 | - } else { | |
| 67 | - return 'SYS_ADMIN'; | |
| 68 | - } | |
| 69 | - }); | |
| 70 | - | |
| 71 | - const loading = ref(false); | |
| 72 | - const compState = ref({ | |
| 73 | - absolute: false, | |
| 74 | - loading: false, | |
| 75 | - tip: '拼命加载中...', | |
| 76 | - }); | |
| 77 | - const [registerForm, { getFieldsValue, setFieldsValue, validate, clearValidate }] = useForm({ | |
| 78 | - labelWidth: 80, | |
| 79 | - schemas, | |
| 80 | - showResetButton: false, | |
| 81 | - showSubmitButton: false, | |
| 82 | - wrapperCol: { | |
| 83 | - span: 12, | |
| 84 | - }, | |
| 85 | - }); | |
| 86 | - | |
| 87 | - const [ | |
| 88 | - registerCustomForm, | |
| 89 | - { getFieldsValue: getNameTown, updateSchema, setFieldsValue: setNameTown }, | |
| 90 | - ] = useForm({ | |
| 91 | - labelWidth: 80, | |
| 92 | - schemas: provSchemas, | |
| 93 | - showResetButton: false, | |
| 94 | - showSubmitButton: false, | |
| 95 | - compact: true, | |
| 96 | - actionColOptions: { | |
| 97 | - span: 0, | |
| 98 | - }, | |
| 99 | - }); | |
| 100 | - | |
| 101 | - const { createMessage } = useMessage(); | |
| 102 | - | |
| 103 | - const qrcodePic = ref(); | |
| 104 | - const handleSetCodeImgUrl = (d) => { | |
| 105 | - qrcodePic.value = d; | |
| 106 | - }; | |
| 107 | - // 更新 | |
| 108 | - const handleUpdateInfo = async () => { | |
| 109 | - try { | |
| 110 | - const fieldsValue = getFieldsValue(); | |
| 111 | - const { nameTown } = getNameTown(); | |
| 112 | - const newFieldValue: any = { | |
| 113 | - ...fieldsValue, | |
| 114 | - codeTown: nameTown, | |
| 115 | - qrCode: qrcodePic.value, | |
| 116 | - }; | |
| 117 | - delete newFieldValue.nameProv; | |
| 118 | - delete newFieldValue.nameCity; | |
| 119 | - delete newFieldValue.nameCoun; | |
| 120 | - delete newFieldValue.nameTown; | |
| 121 | - // 表单校验 | |
| 122 | - let validateArray = [ | |
| 123 | - 'name', | |
| 124 | - 'abbreviation', | |
| 125 | - 'officialWebsite', | |
| 126 | - 'email', | |
| 127 | - 'synopsis', | |
| 128 | - 'nameCountry', | |
| 129 | - 'address', | |
| 130 | - 'contacts', | |
| 131 | - 'tel', | |
| 132 | - 'id', | |
| 133 | - ]; | |
| 134 | - if (newFieldValue.qrCode == undefined || newFieldValue.qrCode == '') { | |
| 135 | - validateArray.push('qrcode'); | |
| 136 | - } else { | |
| 137 | - const findExistIndex = validateArray.findIndex((o) => o == 'qrcode'); | |
| 138 | - if (findExistIndex !== -1) { | |
| 139 | - validateArray.splice(findExistIndex, 1); | |
| 140 | - } | |
| 141 | - } | |
| 142 | - if (newFieldValue.codeTown == undefined) { | |
| 143 | - validateArray.push('prov'); | |
| 144 | - console.log(validateArray); | |
| 145 | - } else { | |
| 146 | - const findExistIndex1 = validateArray.findIndex((o) => o == 'prov'); | |
| 147 | - if (findExistIndex1 !== -1) { | |
| 148 | - validateArray.splice(findExistIndex1, 1); | |
| 149 | - } | |
| 150 | - clearValidate('prov'); | |
| 151 | - } | |
| 152 | - const values = await validate(validateArray); | |
| 153 | - if (!values) return; | |
| 154 | - compState.value.loading = true; | |
| 155 | - await updateEnterPriseDetail(newFieldValue); | |
| 156 | - createMessage.success('更新信息成功'); | |
| 157 | - setEnterPriseInfo(newFieldValue); | |
| 158 | - } finally { | |
| 159 | - compState.value.loading = false; | |
| 160 | - } | |
| 161 | - }; | |
| 162 | - | |
| 163 | - const userStore = useUserStore(); | |
| 164 | - const storage = createLocalStorage(); | |
| 165 | - | |
| 166 | - // 设置企业信息 | |
| 167 | - function setEnterPriseInfo(newFieldValue) { | |
| 168 | - // 保存store | |
| 169 | - userStore.setEnterPriseInfo(newFieldValue); | |
| 170 | - // 保存本地缓存 | |
| 171 | - storage.set('enterpriseInfo', newFieldValue); | |
| 172 | - } | |
| 173 | - | |
| 174 | - // 地区显示回显和数据联动 | |
| 175 | - async function updateCityData( | |
| 176 | - cities: CityItem[], | |
| 177 | - couns: CityItem[], | |
| 178 | - towns: CityItem[], | |
| 179 | - code: Code | |
| 180 | - ) { | |
| 181 | - // 加工后端返回字段 | |
| 182 | - | |
| 183 | - cities.forEach((item) => { | |
| 184 | - item.label = item.name; | |
| 185 | - item.value = item.code; | |
| 186 | - }); | |
| 187 | - | |
| 188 | - couns.forEach((item) => { | |
| 189 | - item.label = item.name; | |
| 190 | - item.value = item.code; | |
| 191 | - }); | |
| 192 | - towns.forEach((item) => { | |
| 193 | - item.label = item.name; | |
| 194 | - item.value = item.code; | |
| 195 | - }); | |
| 196 | - const { codeProv, codeCity, codeCoun, codeTown } = code; | |
| 197 | - updateSchema([ | |
| 198 | - { | |
| 199 | - field: 'nameCity', | |
| 200 | - componentProps: ({ formModel }) => { | |
| 201 | - return { | |
| 202 | - options: cities, | |
| 203 | - async onChange(value) { | |
| 204 | - if (value === undefined) { | |
| 205 | - formModel.nameCoun = undefined; // reset city value | |
| 206 | - formModel.nameTown = undefined; | |
| 207 | - updateSchema([ | |
| 208 | - { | |
| 209 | - field: 'nameCoun', | |
| 210 | - componentProps: { | |
| 211 | - options: [], | |
| 212 | - }, | |
| 213 | - }, | |
| 214 | - { | |
| 215 | - field: 'nameTown', | |
| 216 | - componentProps: { | |
| 217 | - options: [], | |
| 218 | - }, | |
| 219 | - }, | |
| 220 | - ]); | |
| 221 | - } else { | |
| 222 | - let couns: CityItem[] = await getAreaList({ parentId: value }); | |
| 223 | - couns.forEach((item) => { | |
| 224 | - item.label = item.name; | |
| 225 | - item.value = item.code; | |
| 226 | - }); | |
| 227 | - formModel.nameCoun = undefined; // reset city value | |
| 228 | - formModel.nameTown = undefined; | |
| 229 | - updateSchema({ | |
| 230 | - field: 'nameCoun', | |
| 231 | - componentProps: { | |
| 232 | - // 请选择区 | |
| 233 | - options: couns, | |
| 234 | - async onChange(value) { | |
| 235 | - if (value === undefined) { | |
| 236 | - formModel.nameTown = undefined; | |
| 237 | - } else { | |
| 238 | - let towns: CityItem[] = await getAreaList({ parentId: value }); | |
| 239 | - towns.forEach((item) => { | |
| 240 | - item.label = item.name; | |
| 241 | - item.value = item.code; | |
| 242 | - }); | |
| 243 | - formModel.nameTown = undefined; | |
| 244 | - updateSchema({ | |
| 245 | - field: 'nameTown', | |
| 246 | - componentProps: { | |
| 247 | - placeholder: '城镇/街道', | |
| 248 | - options: towns, | |
| 249 | - }, | |
| 250 | - }); | |
| 251 | - } | |
| 252 | - }, | |
| 253 | - }, | |
| 254 | - }); | |
| 255 | - } | |
| 256 | - }, | |
| 257 | - }; | |
| 258 | - }, | |
| 259 | - }, | |
| 260 | - { | |
| 261 | - field: 'nameCoun', | |
| 262 | - componentProps: { | |
| 263 | - options: couns, | |
| 264 | - async onChange(value) { | |
| 265 | - if (value === undefined) { | |
| 266 | - setNameTown({ | |
| 267 | - nameTown: undefined, | |
| 268 | - }); | |
| 269 | - updateSchema({ | |
| 270 | - field: 'nameTown', | |
| 271 | - componentProps: { | |
| 272 | - placeholder: '城镇/街道', | |
| 273 | - options: [], | |
| 274 | - }, | |
| 275 | - }); | |
| 276 | - } else { | |
| 277 | - let towns = await getAreaList({ parentId: value }); | |
| 278 | - towns.forEach((item) => { | |
| 279 | - item.label = item.name; | |
| 280 | - item.value = item.code; | |
| 281 | - }); | |
| 282 | - setNameTown({ | |
| 283 | - nameTown: undefined, | |
| 284 | - }); | |
| 285 | - updateSchema({ | |
| 286 | - field: 'nameTown', | |
| 287 | - componentProps: { | |
| 288 | - placeholder: '城镇/街道', | |
| 289 | - options: towns, | |
| 290 | - }, | |
| 291 | - }); | |
| 292 | - } | |
| 293 | - }, | |
| 294 | - }, | |
| 295 | - }, | |
| 296 | - { | |
| 297 | - field: 'nameTown', | |
| 298 | - componentProps: { | |
| 299 | - options: towns, | |
| 300 | - }, | |
| 301 | - }, | |
| 302 | - ]); | |
| 303 | - setNameTown({ | |
| 304 | - nameProv: codeProv, | |
| 305 | - nameCity: codeCity, | |
| 306 | - nameCoun: codeCoun, | |
| 307 | - nameTown: codeTown, | |
| 308 | - }); | |
| 309 | - } | |
| 310 | - | |
| 311 | - onMounted(async () => { | |
| 312 | - const res = await getEnterPriseDetail(); | |
| 313 | - if (res.sysTown) { | |
| 314 | - const { cities, couns, towns, codeCountry, codeProv, codeCity, codeCoun, codeTown } = | |
| 315 | - res.sysTown; | |
| 316 | - const code = { | |
| 317 | - codeCountry, | |
| 318 | - codeProv, | |
| 319 | - codeCity, | |
| 320 | - codeCoun, | |
| 321 | - codeTown, | |
| 322 | - }; | |
| 323 | - updateCityData(cities, couns, towns, code); | |
| 324 | - setFieldsValue({ nameCountry: codeCountry }); | |
| 325 | - } | |
| 326 | - setFieldsValue(res); | |
| 327 | - qrcodePic.value = res.qrCode; | |
| 328 | - }); | |
| 329 | - | |
| 330 | - return { | |
| 331 | - registerForm, | |
| 332 | - compState, | |
| 333 | - qrcodePic, | |
| 334 | - handleUpdateInfo, | |
| 335 | - registerCustomForm, | |
| 336 | - loading, | |
| 337 | - isWhereAdmin, | |
| 338 | - handleSetCodeImgUrl, | |
| 339 | - }; | |
| 340 | - }, | |
| 341 | - }); | |
| 342 | -</script> | |
| 343 | - | |
| 344 | -<style lang="less" scoped> | |
| 345 | - .box-outline { | |
| 346 | - border: 1px dashed #d9d9d9; | |
| 347 | - } | |
| 348 | - | |
| 349 | - .fill-img { | |
| 350 | - width: 100%; | |
| 351 | - height: 100%; | |
| 352 | - } | |
| 353 | -</style> | |
| 1 | +<template> | |
| 2 | + <div class="card"> | |
| 3 | + <Card :bordered="false" class="card"> | |
| 4 | + <BasicForm @register="registerForm"> | |
| 5 | + <template #qrcode> | |
| 6 | + <ContentUploadText> | |
| 7 | + <template #uploadImg> | |
| 8 | + <CustomUploadComp :imgUrl="qrcodePic" @setImg="handleSetCodeImgUrl" /> | |
| 9 | + </template> | |
| 10 | + <template #uploadText> | |
| 11 | + <div class="box-outline"> 支持.PNG、.JPG格式,建议尺寸为300*300px,大小不超过5M </div> | |
| 12 | + </template> | |
| 13 | + </ContentUploadText> | |
| 14 | + </template> | |
| 15 | + <template #customProv> | |
| 16 | + <BasicForm @register="registerCustomForm" /> | |
| 17 | + </template> | |
| 18 | + </BasicForm> | |
| 19 | + </Card> | |
| 20 | + <Loading v-bind="compState" /> | |
| 21 | + <Authority value="api:yt:enterprise:update:update"> | |
| 22 | + <a-button | |
| 23 | + v-if="isWhereAdmin !== 'CUSTOMER_USER'" | |
| 24 | + @click="handleUpdateInfo" | |
| 25 | + type="primary" | |
| 26 | + class="mt-4" | |
| 27 | + >更新基本信息</a-button | |
| 28 | + > | |
| 29 | + </Authority> | |
| 30 | + </div> | |
| 31 | +</template> | |
| 32 | + | |
| 33 | +<script lang="ts"> | |
| 34 | + import { defineComponent, onMounted, ref, computed } from 'vue'; | |
| 35 | + import { Card } from 'ant-design-vue'; | |
| 36 | + import { BasicForm, useForm } from '/@/components/Form/index'; | |
| 37 | + import { schemas, provSchemas } from '../config/enterPriseInfo.config'; | |
| 38 | + import { getEnterPriseDetail, updateEnterPriseDetail } from '/@/api/oem/index'; | |
| 39 | + import { Loading } from '/@/components/Loading'; | |
| 40 | + import { useMessage } from '/@/hooks/web/useMessage'; | |
| 41 | + import { useUserStore } from '/@/store/modules/user'; | |
| 42 | + import { createLocalStorage } from '/@/utils/cache'; | |
| 43 | + import { Authority } from '/@/components/Authority'; | |
| 44 | + import { USER_INFO_KEY } from '/@/enums/cacheEnum'; | |
| 45 | + import { getAuthCache } from '/@/utils/auth'; | |
| 46 | + import ContentUploadText from './ContentUploadText.vue'; | |
| 47 | + import { CustomUploadComp } from './customUplaod/index'; | |
| 48 | + | |
| 49 | + export default defineComponent({ | |
| 50 | + components: { | |
| 51 | + Card, | |
| 52 | + BasicForm, | |
| 53 | + Loading, | |
| 54 | + Authority, | |
| 55 | + ContentUploadText, | |
| 56 | + CustomUploadComp, | |
| 57 | + }, | |
| 58 | + setup() { | |
| 59 | + const userInfo: any = getAuthCache(USER_INFO_KEY); | |
| 60 | + const isWhereAdmin: any = computed(() => { | |
| 61 | + if (userInfo.roles.includes('TENANT_ADMIN')) { | |
| 62 | + return 'TENANT_ADMIN'; | |
| 63 | + } else if (userInfo.roles.includes('CUSTOMER_USER')) { | |
| 64 | + return 'CUSTOMER_USER'; | |
| 65 | + } else { | |
| 66 | + return 'SYS_ADMIN'; | |
| 67 | + } | |
| 68 | + }); | |
| 69 | + | |
| 70 | + const loading = ref(false); | |
| 71 | + const compState = ref({ | |
| 72 | + absolute: false, | |
| 73 | + loading: false, | |
| 74 | + tip: '拼命加载中...', | |
| 75 | + }); | |
| 76 | + const [registerForm, { getFieldsValue, setFieldsValue, validate, clearValidate }] = useForm({ | |
| 77 | + labelWidth: 80, | |
| 78 | + schemas, | |
| 79 | + showResetButton: false, | |
| 80 | + showSubmitButton: false, | |
| 81 | + wrapperCol: { | |
| 82 | + span: 12, | |
| 83 | + }, | |
| 84 | + }); | |
| 85 | + | |
| 86 | + const [registerCustomForm, { getFieldsValue: getNameTown, setFieldsValue: setNameTown }] = | |
| 87 | + useForm({ | |
| 88 | + labelWidth: 80, | |
| 89 | + schemas: provSchemas, | |
| 90 | + showResetButton: false, | |
| 91 | + showSubmitButton: false, | |
| 92 | + compact: true, | |
| 93 | + actionColOptions: { | |
| 94 | + span: 0, | |
| 95 | + }, | |
| 96 | + }); | |
| 97 | + | |
| 98 | + const { createMessage } = useMessage(); | |
| 99 | + | |
| 100 | + const qrcodePic = ref(); | |
| 101 | + const handleSetCodeImgUrl = (d) => { | |
| 102 | + qrcodePic.value = d; | |
| 103 | + }; | |
| 104 | + // 更新 | |
| 105 | + const handleUpdateInfo = async () => { | |
| 106 | + try { | |
| 107 | + const fieldsValue = getFieldsValue(); | |
| 108 | + const { nameTown } = getNameTown(); | |
| 109 | + const newFieldValue: any = { | |
| 110 | + ...fieldsValue, | |
| 111 | + codeTown: nameTown, | |
| 112 | + qrCode: qrcodePic.value, | |
| 113 | + }; | |
| 114 | + delete newFieldValue.nameProv; | |
| 115 | + delete newFieldValue.nameCity; | |
| 116 | + delete newFieldValue.nameCoun; | |
| 117 | + delete newFieldValue.nameTown; | |
| 118 | + // 表单校验 | |
| 119 | + let validateArray = [ | |
| 120 | + 'name', | |
| 121 | + 'abbreviation', | |
| 122 | + 'officialWebsite', | |
| 123 | + 'email', | |
| 124 | + 'synopsis', | |
| 125 | + 'nameCountry', | |
| 126 | + 'address', | |
| 127 | + 'contacts', | |
| 128 | + 'tel', | |
| 129 | + 'id', | |
| 130 | + ]; | |
| 131 | + if (newFieldValue.qrCode == undefined || newFieldValue.qrCode == '') { | |
| 132 | + validateArray.push('qrcode'); | |
| 133 | + } else { | |
| 134 | + const findExistIndex = validateArray.findIndex((o) => o == 'qrcode'); | |
| 135 | + if (findExistIndex !== -1) { | |
| 136 | + validateArray.splice(findExistIndex, 1); | |
| 137 | + } | |
| 138 | + } | |
| 139 | + if (newFieldValue.codeTown == undefined) { | |
| 140 | + validateArray.push('prov'); | |
| 141 | + console.log(validateArray); | |
| 142 | + } else { | |
| 143 | + const findExistIndex1 = validateArray.findIndex((o) => o == 'prov'); | |
| 144 | + if (findExistIndex1 !== -1) { | |
| 145 | + validateArray.splice(findExistIndex1, 1); | |
| 146 | + } | |
| 147 | + clearValidate('prov'); | |
| 148 | + } | |
| 149 | + const values = await validate(validateArray); | |
| 150 | + if (!values) return; | |
| 151 | + compState.value.loading = true; | |
| 152 | + await updateEnterPriseDetail(newFieldValue); | |
| 153 | + createMessage.success('更新信息成功'); | |
| 154 | + setEnterPriseInfo(newFieldValue); | |
| 155 | + } finally { | |
| 156 | + compState.value.loading = false; | |
| 157 | + } | |
| 158 | + }; | |
| 159 | + | |
| 160 | + const userStore = useUserStore(); | |
| 161 | + const storage = createLocalStorage(); | |
| 162 | + | |
| 163 | + // 设置企业信息 | |
| 164 | + function setEnterPriseInfo(newFieldValue) { | |
| 165 | + // 保存store | |
| 166 | + userStore.setEnterPriseInfo(newFieldValue); | |
| 167 | + // 保存本地缓存 | |
| 168 | + storage.set('enterpriseInfo', newFieldValue); | |
| 169 | + } | |
| 170 | + | |
| 171 | + onMounted(async () => { | |
| 172 | + const res = await getEnterPriseDetail(); | |
| 173 | + if (res.sysTown) { | |
| 174 | + const { codeCountry, codeProv, codeCity, codeCoun, codeTown } = res.sysTown; | |
| 175 | + setNameTown({ | |
| 176 | + nameProv: codeProv, | |
| 177 | + nameCity: codeCity, | |
| 178 | + nameCoun: codeCoun, | |
| 179 | + nameTown: codeTown, | |
| 180 | + }); | |
| 181 | + setFieldsValue({ nameCountry: codeCountry }); | |
| 182 | + } | |
| 183 | + setFieldsValue(res); | |
| 184 | + qrcodePic.value = res.qrCode; | |
| 185 | + }); | |
| 186 | + | |
| 187 | + return { | |
| 188 | + registerForm, | |
| 189 | + compState, | |
| 190 | + qrcodePic, | |
| 191 | + handleUpdateInfo, | |
| 192 | + registerCustomForm, | |
| 193 | + loading, | |
| 194 | + isWhereAdmin, | |
| 195 | + handleSetCodeImgUrl, | |
| 196 | + }; | |
| 197 | + }, | |
| 198 | + }); | |
| 199 | +</script> | |
| 200 | + | |
| 201 | +<style lang="less" scoped> | |
| 202 | + .box-outline { | |
| 203 | + border: 1px dashed #d9d9d9; | |
| 204 | + } | |
| 205 | + | |
| 206 | + .fill-img { | |
| 207 | + width: 100%; | |
| 208 | + height: 100%; | |
| 209 | + } | |
| 210 | +</style> | ... | ... |