sis_zhfx/src/views/WindSite/components/generalappearance/ak.vue

<template>
	<div>
		<el-row :gutter="10">
			<el-col :span="24">
				<previewPicture v-if="datas.length">
					<template v-slot:svg>
						<svg class="svg" style="transform:scale(2) translateY(200px) translateX(50px);" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="图层_1" x="0px" y="0px" width="1111.711px" height="550.14px" viewBox="0 0 1111.711 550.14" enable-background="new 0 0 1111.711 550.14" xml:space="preserve">
						<g id="other">
							<g>
								<polygon fill="#B21F63" points="496.003,29.538 502.73400,4.413 509.465,29.538   "/>
								<rect x="502.734" y="29.538" fill="#B21F63" width="1.537" height="52.888"/>
								<!-- <rect x="500.114" y="80.427" fill="#B21F63" width="595.531" height="1.537"/> -->
								<!-- <text transform="matrix(1 0 0 1 1032.9893 52.8999)" fill="#FFFFFF" font-family="'MicrosoftYaHei'" font-size="14.048">811</text> -->
							</g>
							<g>
								<!-- <rect x="71.679" y="130.277" fill="#B6065C" width="862.731" height="1.537"/> -->
								<text transform="matrix(1 0 0 1 455.7104 111.1514)" fill="#FFFFFF" font-family="'MicrosoftYaHei'" font-size="14.048"> 811 </text>
								<g>
									<rect x="527.506" y="97.923" fill="none" stroke="#4F4B7F" stroke-miterlimit="10" width="58.69" height="23.273"/>
									<rect x="527.506" y="97.923" opacity="0.7" fill="#212967" enable-background="new    " width="58.69" height="23.273"/>
									<text transform="matrix(1 0 0 1 534.2002 113.7886)" fill="#FFFFFF" font-family="'MicrosoftYaHei'" font-size="14.0484"> #1进线 </text>
								</g>
								<rect x="502.734" y="81.964" fill="#B6065C" width="1.537" height="49.883"/>
								<rect x="502.733" y="131.412" fill="#B6065C" width="1.537" height="14.906"/>
							</g>
							<g>
								<g>
									
										<rect x="439.427" y="147.952" fill="none" stroke="#941C54" stroke-width="1.5" stroke-miterlimit="10" width="126.614" height="122.736"/>
									<text transform="matrix(0.9357 0 0 1 443.7225 159.6318)" fill="#FFFFFF" font-family="'MicrosoftYaHei'" font-size="3.4688">01逆变器</text>
									<rect x="443.566" y="164.421" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.917" height="4.275"/>
									<rect x="443.566" y="169.04" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.917" height="4.278"/>
									<rect x="443.566" y="173.659" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.917" height="4.277"/>
									<g>
										<text transform="matrix(0.9357 0 0 1 447.3143 167.583)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">功率:</text>
										<text transform="matrix(0.9357 0 0 1 447.3143 172.1348)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">电压:</text>
										<text transform="matrix(0.9357 0 0 1 447.3143 176.6836)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">电流:</text>
									</g>
									<g>
										<text transform="matrix(0.9357 0 0 1 464.0218 167.3525)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">kw</text>
										<text transform="matrix(0.9357 0 0 1 464.0218 171.9033)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">V</text>
										<text transform="matrix(0.9357 0 0 1 464.0218 176.4531)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">A</text>
									</g>
									
										<image overflow="visible" enable-background="new    " width="347" height="605" xlink:href="./zm_mw.png" transform="matrix(0.0171 0 0 0.0183 460.5452 151.7188)">
									</image>
									<text transform="matrix(0.9357 0 0 1 475.3538 159.6318)" fill="#FFFFFF" font-family="'MicrosoftYaHei'" font-size="3.4688">02逆变器</text>
									<rect x="475.196" y="164.421" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.918" height="4.275"/>
									<rect x="475.196" y="169.04" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.918" height="4.278"/>
									<rect x="475.196" y="173.659" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.918" height="4.277"/>
									<g>
										<text transform="matrix(0.9357 0 0 1 478.9456 167.583)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">功率:</text>
										<text transform="matrix(0.9357 0 0 1 478.9456 172.1348)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">电压:</text>
										<text transform="matrix(0.9357 0 0 1 478.9456 176.6836)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">电流:</text>
									</g>
									<g>
										<text transform="matrix(0.9357 0 0 1 495.6522 167.3525)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">kw</text>
										<text transform="matrix(0.9357 0 0 1 495.6522 171.9033)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">V</text>
										<text transform="matrix(0.9357 0 0 1 495.6522 176.4531)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">A</text>
									</g>
									
										<image overflow="visible" enable-background="new    " width="347" height="605" xlink:href="./zm_mw.png" transform="matrix(0.0171 0 0 0.0183 492.1756 151.7188)">
									</image>
									<text transform="matrix(0.9357 0 0 1 506.3104 159.6318)" fill="#FFFFFF" font-family="'MicrosoftYaHei'" font-size="3.4688">03逆变器</text>
									<rect x="506.153" y="164.421" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.918" height="4.275"/>
									<rect x="506.153" y="169.04" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.918" height="4.278"/>
									<rect x="506.153" y="173.659" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.918" height="4.277"/>
									<g>
										<text transform="matrix(0.9357 0 0 1 509.9022 167.583)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">功率:</text>
										<text transform="matrix(0.9357 0 0 1 509.9022 172.1348)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">电压:</text>
										<text transform="matrix(0.9357 0 0 1 509.9022 176.6836)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">电流:</text>
									</g>
									<g>
										<text transform="matrix(0.9357 0 0 1 526.6097 167.3525)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">kw</text>
										<text transform="matrix(0.9357 0 0 1 526.6097 171.9033)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">V</text>
										<text transform="matrix(0.9357 0 0 1 526.6097 176.4531)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">A</text>
									</g>
									
										<image overflow="visible" enable-background="new    " width="347" height="605" xlink:href="./zm_mw.png" transform="matrix(0.0171 0 0 0.0183 523.1321 151.7188)">
									</image>
									<text transform="matrix(0.9357 0 0 1 537.2108 159.6318)" fill="#FFFFFF" font-family="'MicrosoftYaHei'" font-size="3.4688">04逆变器</text>
									<rect x="537.053" y="164.421" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.918" height="4.275"/>
									<rect x="537.053" y="169.04" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.918" height="4.278"/>
									<rect x="537.053" y="173.659" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.918" height="4.277"/>
									<g>
										<text transform="matrix(0.9357 0 0 1 540.8021 167.583)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">功率:</text>
										<text transform="matrix(0.9357 0 0 1 540.8021 172.1348)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">电压:</text>
										<text transform="matrix(0.9357 0 0 1 540.8021 176.6836)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">电流:</text>
									</g>
									<g>
										<text transform="matrix(0.9357 0 0 1 557.5081 167.3525)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">kw</text>
										<text transform="matrix(0.9357 0 0 1 557.5081 171.9033)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">V</text>
										<text transform="matrix(0.9357 0 0 1 557.5081 176.4531)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">A</text>
									</g>
									
										<image overflow="visible" enable-background="new    " width="347" height="605" xlink:href="./zm_mw.png" transform="matrix(0.0171 0 0 0.0183 554.0325 151.7188)">
									</image>
									<text transform="matrix(0.9357 0 0 1 443.6888 189.5859)" fill="#FFFFFF" font-family="'MicrosoftYaHei'" font-size="3.4688">05逆变器</text>
									<rect x="443.531" y="194.375" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.917" height="4.278"/>
									<rect x="443.531" y="198.994" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.917" height="4.277"/>
									<rect x="443.531" y="203.613" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.917" height="4.277"/>
									<g>
										<text transform="matrix(0.9357 0 0 1 447.2796 197.5381)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">功率:</text>
										<text transform="matrix(0.9357 0 0 1 447.2796 202.0889)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">电压:</text>
										<text transform="matrix(0.9357 0 0 1 447.2796 206.6387)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">电流:</text>
									</g>
									<g>
										<text transform="matrix(0.9357 0 0 1 463.9871 197.3076)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">kw</text>
										<text transform="matrix(0.9357 0 0 1 463.9871 201.8574)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">V</text>
										<text transform="matrix(0.9357 0 0 1 463.9871 206.4072)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">A</text>
									</g>
									
										<image overflow="visible" enable-background="new    " width="347" height="605" xlink:href="./zm_mw.png" transform="matrix(0.0171 0 0 0.0183 460.5096 181.6729)">
									</image>
									<text transform="matrix(0.9357 0 0 1 475.3192 189.5859)" fill="#FFFFFF" font-family="'MicrosoftYaHei'" font-size="3.4688">06逆变器</text>
									<rect x="475.161" y="194.375" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.917" height="4.278"/>
									<rect x="475.161" y="198.994" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.917" height="4.277"/>
									<rect x="475.161" y="203.613" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.917" height="4.277"/>
									<g>
										<text transform="matrix(0.9357 0 0 1 478.9095 197.5381)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">功率:</text>
										<text transform="matrix(0.9357 0 0 1 478.9095 202.0889)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">电压:</text>
										<text transform="matrix(0.9357 0 0 1 478.9095 206.6387)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">电流:</text>
									</g>
									<g>
										<text transform="matrix(0.9357 0 0 1 495.617 197.3076)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">kw</text>
										<text transform="matrix(0.9357 0 0 1 495.617 201.8574)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">V</text>
										<text transform="matrix(0.9357 0 0 1 495.617 206.4072)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">A</text>
									</g>
									
										<image overflow="visible" enable-background="new    " width="347" height="605" xlink:href="./zm_mw.png" transform="matrix(0.0171 0 0 0.0183 492.1404 181.6729)">
									</image>
									<text transform="matrix(0.9357 0 0 1 506.2752 189.5859)" fill="#FFFFFF" font-family="'MicrosoftYaHei'" font-size="3.4688">07逆变器</text>
									<rect x="506.118" y="194.375" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.917" height="4.278"/>
									<rect x="506.118" y="198.994" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.917" height="4.277"/>
									<rect x="506.118" y="203.613" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.917" height="4.277"/>
									<g>
										<text transform="matrix(0.9357 0 0 1 509.867 197.5381)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">功率:</text>
										<text transform="matrix(0.9357 0 0 1 509.867 202.0889)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">电压:</text>
										<text transform="matrix(0.9357 0 0 1 509.867 206.6387)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">电流:</text>
									</g>
									<g>
										<text transform="matrix(0.9357 0 0 1 526.5736 197.3076)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">kw</text>
										<text transform="matrix(0.9357 0 0 1 526.5736 201.8574)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">V</text>
										<text transform="matrix(0.9357 0 0 1 526.5736 206.4072)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">A</text>
									</g>
									
										<image overflow="visible" enable-background="new    " width="347" height="605" xlink:href="./zm_mw.png" transform="matrix(0.0171 0 0 0.0183 523.097 181.6729)">
									</image>
									<text transform="matrix(0.9357 0 0 1 537.1751 189.5859)" fill="#FFFFFF" font-family="'MicrosoftYaHei'" font-size="3.4688">08逆变器</text>
									<rect x="537.018" y="194.375" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.918" height="4.278"/>
									<rect x="537.018" y="198.994" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.918" height="4.277"/>
									<rect x="537.018" y="203.613" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.918" height="4.277"/>
									<g>
										<text transform="matrix(0.9357 0 0 1 540.7669 197.5381)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">功率:</text>
										<text transform="matrix(0.9357 0 0 1 540.7669 202.0889)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">电压:</text>
										<text transform="matrix(0.9357 0 0 1 540.7669 206.6387)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">电流:</text>
									</g>
									<g>
										<text transform="matrix(0.9357 0 0 1 557.4744 197.3076)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">kw</text>
										<text transform="matrix(0.9357 0 0 1 557.4744 201.8574)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">V</text>
										<text transform="matrix(0.9357 0 0 1 557.4744 206.4072)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">A</text>
									</g>
									
										<image overflow="visible" enable-background="new    " width="347" height="605" xlink:href="./zm_mw.png" transform="matrix(0.0171 0 0 0.0183 553.9979 181.6729)">
									</image>
									<text transform="matrix(0.9357 0 0 1 443.6888 219.124)" fill="#FFFFFF" font-family="'MicrosoftYaHei'" font-size="3.4688">09逆变器</text>
									<rect x="443.531" y="223.913" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.917" height="4.278"/>
									<rect x="443.531" y="228.532" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.917" height="4.278"/>
									<rect x="443.531" y="233.15" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.917" height="4.279"/>
									<g>
										<text transform="matrix(0.9357 0 0 1 447.2796 227.0752)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">功率:</text>
										<text transform="matrix(0.9357 0 0 1 447.2796 231.626)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">电压:</text>
										<text transform="matrix(0.9357 0 0 1 447.2796 236.1758)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">电流:</text>
									</g>
									<g>
										<text transform="matrix(0.9357 0 0 1 463.9871 226.8438)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">kw</text>
										<text transform="matrix(0.9357 0 0 1 463.9871 231.3945)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">V</text>
										<text transform="matrix(0.9357 0 0 1 463.9871 235.9443)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">A</text>
									</g>
									
										<image overflow="visible" enable-background="new    " width="347" height="605" xlink:href="./zm_mw.png" transform="matrix(0.0171 0 0 0.0183 460.5106 211.2104)">
									</image>
									<text transform="matrix(0.9357 0 0 1 475.3192 219.124)" fill="#FFFFFF" font-family="'MicrosoftYaHei'" font-size="3.4688">10逆变器</text>
									<rect x="475.161" y="223.913" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.918" height="4.278"/>
									<rect x="475.161" y="228.532" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.918" height="4.278"/>
									<rect x="475.161" y="233.15" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.918" height="4.279"/>
									<g>
										<text transform="matrix(0.9357 0 0 1 478.9095 227.0752)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">功率:</text>
										<text transform="matrix(0.9357 0 0 1 478.9095 231.626)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">电压:</text>
										<text transform="matrix(0.9357 0 0 1 478.9095 236.1758)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">电流:</text>
									</g>
									<g>
										<text transform="matrix(0.9357 0 0 1 495.617 226.8438)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">kw</text>
										<text transform="matrix(0.9357 0 0 1 495.617 231.3945)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">V</text>
										<text transform="matrix(0.9357 0 0 1 495.617 235.9443)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">A</text>
									</g>
									
										<image overflow="visible" enable-background="new    " width="347" height="605" xlink:href="./zm_mw.png" transform="matrix(0.0171 0 0 0.0183 492.1404 211.2104)">
									</image>
									<text transform="matrix(0.9357 0 0 1 506.2752 219.124)" fill="#FFFFFF" font-family="'MicrosoftYaHei'" font-size="3.4688">11逆变器</text>
									<rect x="506.118" y="223.913" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.917" height="4.278"/>
									<rect x="506.118" y="228.532" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.917" height="4.278"/>
									<rect x="506.118" y="233.15" opacity="0.9" fill="#1B2522" enable-background="new    " width="24.917" height="4.279"/>
									<g>
										<text transform="matrix(0.9357 0 0 1 509.867 227.0752)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">功率:</text>
										<text transform="matrix(0.9357 0 0 1 509.867 231.626)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">电压:</text>
										<text transform="matrix(0.9357 0 0 1 509.867 236.1758)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">电流:</text>
									</g>
									<g>
										<text transform="matrix(0.9357 0 0 1 526.5736 226.8438)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">kw</text>
										<text transform="matrix(0.9357 0 0 1 526.5736 231.3945)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">V</text>
										<text transform="matrix(0.9357 0 0 1 526.5736 235.9443)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">A</text>
									</g>
									
										<image overflow="visible" enable-background="new    " width="347" height="605" xlink:href="./zm_mw.png" transform="matrix(0.0171 0 0 0.0183 523.097 211.2104)">
									</image>
								</g>
							</g>
						</g>
						<g id="sc">
							<rect x="498.734" y="35.898" fill="#ED2024" width="9.836" height="18.318"/>
							<rect x="495.033" y="89.119" fill="#02A434" width="16.937" height="30.677"/>
							<!-- <rect x="494.721" y="323.04" fill="#02A434" width="16.937" height="30.677"/> -->
						</g>
						<g id="data">

							<!-- <text transform="matrix(0.9357 0 0 1 464.0218 167.3525)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">kw</text>
							<text transform="matrix(0.9357 0 0 1 464.0218 171.9033)" fill="#929CA0" font-family="'MicrosoftYaHei'" font-size="2.3134">V</text>
							<text transform="matrix(0.9357 0 0 1 464.0218 176.4531) -->
							<g id="_x23_1">
								<g>
									<text transform="matrix(1 0 0 1 454.0218 167.3525)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[0].gl}}</text>
								</g>
								<g>
									<text transform="matrix(1 0 0 1 454.0218 171.9033)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[0].dy}}</text>
								</g>
								<g>
									<text transform="matrix(1 0 0 1 454.0218 176.4531)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[0].dl}}</text>
								</g>
							</g>
							<g id="_x23_2">
								<g>
									<text transform="matrix(1 0 0 1 485.6522 167.3525)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[1].gl}}</text>
								</g>
								<g>
									<text transform="matrix(1 0 0 1 485.6522 171.9033)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[1].dy}}</text>
								</g>
								<g>
									<text transform="matrix(1 0 0 1 485.6522 176.4531)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[1].dl}}</text>
								</g>
							</g>
							<g id="_x23_3">
								<g>
									<text transform="matrix(1 0 0 1 516.6097 167.3525)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[2].gl}}</text>
								</g>
								<g>
									<text transform="matrix(1 0 0 1 516.6097 171.9033)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[2].dy}}</text>
								</g>
								<g>
									<text transform="matrix(1 0 0 1 516.6097 176.4531)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[2].dl}}</text>
								</g>
							</g>
							<g id="_x23_4">
								<g>
									<text transform="matrix(1 0 0 1 547.5081 167.3525)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[3].gl}}</text>
								</g>
								<g>
									<text transform="matrix(1 0 0 1 547.5081 171.9033)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[3].dy}}</text>
								</g>
								<g>
									<text transform="matrix(1 0 0 1 547.5081 176.4531)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[3].dl}}</text>
								</g>
							</g>
							<g id="_x23_5">
								<g>
									<text transform="matrix(1 0 0 1 453.9871 197.3076)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[4].gl}}</text>
								</g>
								<g>
									<text transform="matrix(1 0 0 1 453.9871 201.8574)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[4].dy}}</text>
								</g>
								<g>
									<text transform="matrix(1 0 0 1 453.9871 206.4072)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[4].dl}}</text>
								</g>
							</g>
							<g id="_x23_6">
								<g>
									<text transform="matrix(1 0 0 1 485.6175 197.3076)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[5].gl}}</text>
								</g>
								<g>
									<text transform="matrix(1 0 0 1 485.6175 201.8574)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[5].dy}}</text>
								</g>
								<g>
									<text transform="matrix(1 0 0 1 485.6175 206.4072)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[5].dl}}</text>
								</g>
							</g>
							<g id="_x23_7">
								<g>
									<text transform="matrix(1 0 0 1 517.2479 197.3076)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[6].gl}}</text>
								</g>
								<g>
									<text transform="matrix(1 0 0 1 517.2479 201.8574)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[6].dy}}</text>
								</g>
								<g>
									<text transform="matrix(1 0 0 1 517.2479 206.4072)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[6].dl}}</text>
								</g>
							</g>
							<g id="_x23_8">
								<g>
									<text transform="matrix(1 0 0 1 548.8783 197.3076)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[7].gl}}</text>
								</g>
								<g>
									<text transform="matrix(1 0 0 1 548.8783 201.8574)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[7].dy}}</text>
								</g>
								<g>
									<text transform="matrix(1 0 0 1 548.8783 206.4072)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[7].dl}}</text>
								</g>
							</g>
							<g id="_x23_9">
								<g>
									<text transform="matrix(1 0 0 1 453.9871 226.8438)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[8].gl}}</text>
								</g>
								<g>
									<text transform="matrix(1 0 0 1 453.9871 231.3945)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[8].dy}}</text>
								</g>
								<g>
									<text transform="matrix(1 0 0 1 453.9871 235.9443)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[8].dl}}</text>
								</g>
							</g>
							<g id="_x23_10">
								<g>
									<text transform="matrix(1 0 0 1 485.617 226.8438)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[9].gl}}</text>
								</g>
								<g>
									<text transform="matrix(1 0 0 1 485.617 231.3945)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[9].dy}}</text>
								</g>
								<g>
									<text transform="matrix(1 0 0 1 485.617 235.9443)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[9].dl}}</text>
								</g>
							</g>
							<g id="_x23_11">
								<g>
									<text transform="matrix(1 0 0 1 516.5736 226.8438)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[10].gl}}</text>
								</g>
								<g>
									<text transform="matrix(1 0 0 1 516.5736 231.3945)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[10].dy}}</text>
								</g>
								<g>
									<text transform="matrix(1 0 0 1 516.5736 235.9443)" fill="#3B8646" font-family="'MicrosoftYaHei'" font-size="2.3134">{{datas[10].dl}}</text>
								</g>
							</g>
						</g>
						</svg>
					</template>
				</previewPicture>
			</el-col>
		</el-row>
	</div>
</template>
<script>  //431.055
	import previewPicture from "../previewPicture.vue";
	import $ from "jquery";
	export default {
		components: {
			previewPicture,
		},

		props: {
			data: Array,
			zmmap: Object,
		},

		data() {
			return {
				//   graph: null,
				green: "#02A434",
				red: "#FF0000",
				datas: [],
				dgIds: [],
			};
		},
		methods: {
			// 渲染每个机箱的表格参数
			renderData(data) {
				// 取出开关的 DOM
				// const switchDom = $("#sc").find("rect");
				// 遍历数据，首先取出开关单独写逻辑渲染颜色，除了开关以外的就是每个机箱的数据
				for (let key in data) {
					const item = data[key]
					if(this.datas[Number(key.substring(2,4))-1]===undefined){
						this.datas[Number(key.substring(2,4))-1] = {
							gl: 0,
							dy: 0,
							dl: 0
						}
					}
					this.datas[Number(key.substring(2,4))-1][key.substring(4)] = data[key]

					// 渲染开关
					// const item = data[key];
					// if (key === "hzj105") {
					// 	switchDom.eq(0).attr("fill", item ? this.green : this.red);
					// } else if (key === "hzj361") {
					// 	switchDom.eq(1).attr("fill", item ? this.green : this.red);
					// } else if (key === "hzj362") {
					// 	switchDom.eq(2).attr("fill", item ? this.green : this.red);
					// } else {
					// 	const dgDom = $('#alldata').find('#data'+key.slice(3,5)).find('g').eq(parseInt(key.slice(5,7)) - 1).find('text');
					// 	if (dgDom && key.indexOf("dl") !== -1) {
					// 		dgDom.eq(0).html(item);
					// 	} else if (dgDom && key.indexOf("dy") !== -1) {
					// 		dgDom.eq(1).html(item);
					// 	} else if (dgDom && key.indexOf("gl") !== -1) {
					// 		dgDom.eq(2).html(item);
					// 	}
					// }
				}

				// 给电柜上个色呗
				// this.dgIds.forEach((dgId) => {
				// 	const dgDom = $("#diangui_" + dgId + "_").find("polygon");

				// 	for (let i = 0; i < dgDom.length; i++) {
				// 		dgDom.eq(i).attr("fill", this.getColor());
				// 	}
				// });
			},

			randomNum(minNum, maxNum) {
				switch (arguments.length) {
					case 1:
						return parseInt(Math.random() * minNum + 1, 10);
					case 2:
						return parseInt(Math.random() * (maxNum - minNum + 1) + minNum, 10);
					default:
						return 0;
				}
			},


			// 根据机箱状态返回颜色，后续如果需要区分颜色可以在这里新增逻辑返回对应的颜色值
			getColor() {
				return "#fff";
			}
		},

		watch: {
			// 风机数据
			data(value) {
				// this.datas = value;
			},

			// 总貌数据
			zmmap(value) {
				this.renderData(value);
			},
		},
	};
</script>

<style scoped>
	.center-bar {
		position: relative;
		box-sizing: border-box;
		height: 90vh;
		background-color: #000000;
		padding-top: 10px;
		padding-left: 5px;
		padding-right: 5px;
		padding-bottom: 5px;
		margin-top: 0;
		margin-right: 0;
		margin-bottom: 3px;
		margin-left: 0;
		display: flex;
		flex-direction: column;
	}

	.svg {
		margin-left: 5%;
		width: 90%;
		height: 90%;
	}
	.light #other text[font-size="14.048"],
	.light #other text[font-size="3.4688"]{
		fill:#000000;
	}
	.light #alldata text{
		fill:#FFFFFF;
	}
</style>