Kaynağa Gözat

双碳平台静态页面提交

nahida 1 yıl önce
ebeveyn
işleme
2bb9629f53

+ 47 - 43
src/views/b/aa/NewPage.vue

@@ -49,23 +49,20 @@
       <el-card style="flex: 1;">
         <template #header>
           <div>
-            <span></span>
+            <span>政策驱动参数</span>
             <img src="/src/assets/svg/u540.svg"/>
           </div>
         </template>
         <template #default>
           <el-form>
-            <el-form-item label="厡煤">
-              <el-input v-model="form2.a"/>
+            <el-form-item label="2030年非化石能源占比目标">
+              <el-input v-model="form2.a" placeholder="例如:30%"/>
             </el-form-item>
-            <el-form-item label="洗精煤">
-              <el-input v-model="form2.b"/>
+            <el-form-item label="2060年非化石能源占比目标">
+              <el-input v-model="form2.b" placeholder="例如:80%"/>
             </el-form-item>
-            <el-form-item label="洗中煤,煤泥">
-              <el-input v-model="form2.c"/>
-            </el-form-item>
-            <el-form-item label="焦炭">
-              <el-input v-model="form2.dd"/>
+            <el-form-item label="2030年煤炭消费占比目标">
+              <el-input v-model="form2.c" placeholder="例如:40%"/>
             </el-form-item>
           </el-form>
         </template>
@@ -73,44 +70,57 @@
       <el-card style="flex: 1;">
         <template #header>
           <div>
-            <span></span>
+            <span>技术发展参数</span>
             <img src="/src/assets/svg/u561.svg"/>
           </div>
         </template>
         <template #default>
           <el-form>
-            <el-form-item label="厡油">
-              <el-input v-model="form2.sda"/>
-            </el-form-item>
-            <el-form-item label="重油">
-              <el-input v-model="form2.zxc"/>
+            <el-form-item label="光伏发电能源转化效率提升率">
+              <el-input v-model="form2.sda" placeholder="例如:2%/年" />
             </el-form-item>
-            <el-form-item label="煤油">
-              <el-input v-model="form2.asdf"/>
+            <el-form-item label="风力发电能源转化效率提升率">
+              <el-input v-model="form2.zxc" placeholder="例如:2%/年"/>
             </el-form-item>
-            <el-form-item label="汽油">
-              <el-input v-model="form2.fg"/>
+            <el-form-item label="太阳能发电能源转化效率提升率">
+              <el-input v-model="form2.asdf" placeholder="例如:2%/年"/>
             </el-form-item>
-            <el-form-item label="柴油">
-              <el-input v-model="form2.fg"/>
+            <el-form-item label="储能效率提升率">
+              <el-input v-model="form2.fg" placeholder="例如:2%/年"/>
             </el-form-item>
+
           </el-form>
         </template>
       </el-card>
       <el-card style="flex: 1;">
         <template #header>
           <div>
-            <span></span>
+            <span>政策驱动参数</span>
             <img src="/src/assets/svg/u598.svg"/>
           </div>
         </template>
         <template #default>
           <el-form>
-            <el-form-item label="油田天然气">
-              <el-input v-model="form2.jh"/>
+            <el-form-item label="2060年煤炭消费占比目标">
+              <el-input v-model="form2.dd" placeholder="例如:10%"/>
+            </el-form-item>
+            <el-form-item label="2030年天然气替代煤炭比例">
+              <el-input v-model="form2.dasa" placeholder="例如:20%"/>
+            </el-form-item>
+            <el-form-item label="2060年天然气替代煤炭比例">
+              <el-input v-model="form2.zxczxcxz" placeholder="例如:50%"/>
             </el-form-item>
-            <el-form-item label="气田天然气">
-              <el-input v-model="form2.we"/>
+            <el-form-item label="碳中和目标达成年份">
+              <el-input v-model="form2.ddsdasda" placeholder="例如:2026年"/>
+            </el-form-item>
+            <el-form-item label="碳排放强度10年累计下降目标">
+              <el-input v-model="form2.ddzcxzc" placeholder="例如:50%"/>
+            </el-form-item>
+            <el-form-item label="平均碳交易价格">
+              <el-input v-model="form2.ddqweqwewq" placeholder="例如:50元/吨"/>
+            </el-form-item>
+            <el-form-item label="风光消纳比例">
+              <el-input v-model="form2.ddghfhfg" placeholder="例如:95%"/>
             </el-form-item>
           </el-form>
         </template>
@@ -118,29 +128,23 @@
       <el-card style="flex: 1;">
         <template #header>
           <div>
-            <span></span>
+            <span>技术发展参数</span>
             <img src="/src/assets/svg/u540.svg"/>
           </div>
         </template>
         <template #default>
           <el-form>
-            <el-form-item label="无烟煤(吨)">
-              <el-input v-model="form3.a"/>
-            </el-form-item>
-            <el-form-item label="烟煤(吨)">
-              <el-input v-model="form3.b"/>
+            <el-form-item label="光伏发电成本降低率">
+              <el-input v-model="form2.fg1232" placeholder="例如:2%/年"/>
             </el-form-item>
-            <el-form-item label="原煤(吨)">
-              <el-input v-model="form3.c"/>
+            <el-form-item label="风力发电成本降低率">
+              <el-input v-model="form2.fgqwe" placeholder="例如:2%/年"/>
             </el-form-item>
-            <div class="custom-hr">
-              <span>清洁能源</span>
-            </div>
-            <el-form-item label="光伏">
-              <el-input v-model="form3.d"/>
+            <el-form-item label="太阳能发电成本降低率">
+              <el-input v-model="form2.fg1321" placeholder="例如:2%/年"/>
             </el-form-item>
-            <el-form-item label="风电">
-              <el-input v-model="form3.e"/>
+            <el-form-item label="储能成本降低率">
+              <el-input v-model="form2.fgwqeqw" placeholder="例如:2%/年"/>
             </el-form-item>
           </el-form>
         </template>
@@ -148,7 +152,7 @@
       <el-card style="flex: 1;">
         <template #header>
           <div>
-            <span></span>
+            <span>政策驱动参数</span>
             <img src="/src/assets/svg/u540.svg"/>
           </div>
         </template>

+ 327 - 221
src/views/b/aa/NewPage2.vue

@@ -1,13 +1,18 @@
 <script setup>
 
 import {Search} from "@element-plus/icons-vue";
+const form = reactive({
+  // a: '8亿吨',
+  // ab:'3亿吨',
+  // abcdeqwer:"5000亿元"
+});
 </script>
 
 <template>
   <el-row :gutter="5">
     <el-col :span="24" style="height: 50px;line-height: 50px">
       <div style="display: flex;justify-content: space-between">
-        <div>环境及用料配置</div>
+        <div>规划边界类配置</div>
         <div style="display: flex;gap: 20px;">
           <el-button type="primary">保存</el-button>
           <el-button type="info">重置</el-button>
@@ -15,119 +20,149 @@ import {Search} from "@element-plus/icons-vue";
       </div>
     </el-col>
     <el-col :span="24" style="display: grid;grid-template-columns: 22% 20% 20% 20% 15%; gap: 10px">
-      <el-card style="height: 600px">
+      <el-card style="height: 660px">
         <template #header>
           <div style="display: flex;justify-content: space-between;">
-            <div>不同种类化石燃料燃烧CO2排放</div>
+            <div>环境影响边界参数</div>
             <img src="/src/assets/svg/u540.svg" style="width: 6%;object-fit: contain" />
           </div>
         </template>
         <template #default>
-          <el-input placeholder="请输入燃料品种名称">
+          <div class="qqq">温室气体排放约束</div>
+          <el-input v-model="form.a" placeholder="温室气体排放约束例如:8亿吨">
             <template #prepend>
               <el-button :icon="Search" />
             </template>
           </el-input>
-          <div style="margin-top: 30px;display: grid;grid-template-columns: 30% 30% 30%;row-gap: 1%;column-gap: 10%">
-            <el-checkbox>
-              <template #default>
-                无烟煤
-              </template>
-            </el-checkbox>
-            <el-checkbox>
-              <template #default>
-                烟煤
-              </template>
-            </el-checkbox>
-            <el-checkbox>
-              <template #default>
-                褐煤
-              </template>
-            </el-checkbox>
-            <el-checkbox>
-              <template #default>
-                洗精煤
-              </template>
-            </el-checkbox>
-            <el-checkbox>
-              <template #default>
-                型煤
-              </template>
-            </el-checkbox>
-            <el-checkbox>
-              <template #default>
-                焦炭
-              </template>
-            </el-checkbox>
-            <el-checkbox>
-              <template #default>
-                无烟煤
-              </template>
-            </el-checkbox>
-            <el-checkbox>
-              <template #default>
-                无烟煤
-              </template>
-            </el-checkbox>
-            <el-checkbox>
-              <template #default>
-                无烟煤
-              </template>
-            </el-checkbox>
-            <el-checkbox>
-              <template #default>
-                无烟煤
-              </template>
-            </el-checkbox>
-            <el-checkbox>
-              <template #default>
-                无烟煤
-              </template>
-            </el-checkbox>
-            <el-checkbox>
-              <template #default>
-                无烟煤
-              </template>
-            </el-checkbox>
-          </div>
-          <div style="color: #1111bb;text-align: center;margin-top: 300px">
-            查看更多化石燃料...
-          </div>
+          <br>
+          <br>
+          <div class="qqq">空气污染物排放限制</div>
+          <el-input v-model="form.ab" placeholder="空气污染物排放限制例如:3亿吨">
+            <template #prepend>
+              <el-button :icon="Search" />
+            </template>
+          </el-input>
+<!--          <div style="margin-top: 30px;display: grid;grid-template-columns: 30% 30% 30%;row-gap: 1%;column-gap: 10%">-->
+<!--            <el-checkbox>-->
+<!--              <template #default>-->
+<!--                无烟煤-->
+<!--              </template>-->
+<!--            </el-checkbox>-->
+<!--            <el-checkbox>-->
+<!--              <template #default>-->
+<!--                烟煤-->
+<!--              </template>-->
+<!--            </el-checkbox>-->
+<!--            <el-checkbox>-->
+<!--              <template #default>-->
+<!--                褐煤-->
+<!--              </template>-->
+<!--            </el-checkbox>-->
+<!--            <el-checkbox>-->
+<!--              <template #default>-->
+<!--                洗精煤-->
+<!--              </template>-->
+<!--            </el-checkbox>-->
+<!--            <el-checkbox>-->
+<!--              <template #default>-->
+<!--                型煤-->
+<!--              </template>-->
+<!--            </el-checkbox>-->
+<!--            <el-checkbox>-->
+<!--              <template #default>-->
+<!--                焦炭-->
+<!--              </template>-->
+<!--            </el-checkbox>-->
+<!--            <el-checkbox>-->
+<!--              <template #default>-->
+<!--                无烟煤-->
+<!--              </template>-->
+<!--            </el-checkbox>-->
+<!--            <el-checkbox>-->
+<!--              <template #default>-->
+<!--                无烟煤-->
+<!--              </template>-->
+<!--            </el-checkbox>-->
+<!--            <el-checkbox>-->
+<!--              <template #default>-->
+<!--                无烟煤-->
+<!--              </template>-->
+<!--            </el-checkbox>-->
+<!--            <el-checkbox>-->
+<!--              <template #default>-->
+<!--                无烟煤-->
+<!--              </template>-->
+<!--            </el-checkbox>-->
+<!--            <el-checkbox>-->
+<!--              <template #default>-->
+<!--                无烟煤-->
+<!--              </template>-->
+<!--            </el-checkbox>-->
+<!--            <el-checkbox>-->
+<!--              <template #default>-->
+<!--                无烟煤-->
+<!--              </template>-->
+<!--            </el-checkbox>-->
+<!--          </div>-->
+<!--          <div style="color: #1111bb;text-align: center;margin-top: 300px">-->
+<!--            查看更多化石燃料...-->
+<!--          </div>-->
         </template>
       </el-card>
       <div>
         <el-card style="height: 300px">
           <template #header>
             <div style="display: flex;justify-content: space-between;">
-              <div>净购入的电力消费产生的排放</div>
+              <div>技术发展约束参数</div>
               <img src="/src/assets/svg/u540.svg" style="width: 6%;object-fit: contain" />
             </div>
           </template>
           <template #default>
-            <div style="display: grid;grid-template-columns: 30% 30% 30%;row-gap: 1%;column-gap: 10%">
-              <el-checkbox>
-                <template #default>
-                  电力
-                </template>
-              </el-checkbox>
-            </div>
+            <div class="qqq">新能源技术发展预期</div>
+            <el-input v-model="form.abc" placeholder="新能源技术发展预期例如:500万吨">
+              <template #prepend>
+                <el-button :icon="Search" />
+              </template>
+            </el-input>
+            <br>
+            <br>
+            <div class="qqq">储能装机规模约束</div>
+            <el-input v-model="form.abcd" placeholder="储能装机规模约束例如:3%">
+              <template #prepend>
+                <el-button :icon="Search" />
+              </template>
+            </el-input>
+<!--            <div style="display: grid;grid-template-columns: 30% 30% 30%;row-gap: 1%;column-gap: 10%">-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  电力-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--            </div>-->
           </template>
         </el-card>
-        <el-card style="height: 280px;margin-top: 20px;">
+        <el-card style="height: 340px;margin-top: 20px;">
           <template #header>
             <div style="display: flex;justify-content: space-between;">
-              <div>净购入的热力消费产生的排放</div>
+              <div>政策要求边界参数</div>
               <img src="/src/assets/svg/u540.svg" style="width: 6%;object-fit: contain" />
             </div>
           </template>
           <template #default>
-            <div style="display: grid;grid-template-columns: 30% 30% 30%;row-gap: 1%;column-gap: 10%">
-              <el-checkbox>
-                <template #default>
-                  热力
-                </template>
-              </el-checkbox>
-            </div>
+            <div class="qqq">碳定价机制</div>
+            <el-input v-model="form.abcde" placeholder="碳定价机制例如:500GW">
+              <template #prepend>
+                <el-button :icon="Search" />
+              </template>
+            </el-input>
+            <br>
+            <br>
+            <div class="qqq">政府补贴政策</div>
+            <el-input v-model="form.abcdeq" placeholder="政府补贴政策例如:30%">
+              <template #prepend>
+                <el-button :icon="Search" />
+              </template>
+            </el-input>
           </template>
         </el-card>
       </div>
@@ -135,88 +170,116 @@ import {Search} from "@element-plus/icons-vue";
         <el-card style="height: 300px">
           <template #header>
             <div style="display: flex;justify-content: space-between;">
-              <div>过程排放 - 碳酸盐分解CO2排放</div>
+              <div>市场需求与经济约束参数</div>
               <img src="/src/assets/svg/u540.svg" style="width: 6%;object-fit: contain" />
             </div>
           </template>
           <template #default>
-            <div style="display: grid;grid-template-columns: 50% 49% ;row-gap: 1%;column-gap: 10%">
-              <el-checkbox>
-                <template #default>
-                  含CaCO3
-                </template>
-              </el-checkbox>
-              <el-checkbox>
-                <template #default>
-                  含MgCO3
-                </template>
-              </el-checkbox>
-              <el-checkbox>
-                <template #default>
-                  含Na2CO3
-                </template>
-              </el-checkbox>
-              <el-checkbox>
-                <template #default>
-                  含BaCO3
-                </template>
-              </el-checkbox>
-              <el-checkbox>
-                <template #default>
-                  含Li2CO3
-                </template>
-              </el-checkbox>
-              <el-checkbox>
-                <template #default>
-                  含K2CO3
-                </template>
-              </el-checkbox>
-            </div>
-            <div style="color: #1111bb;text-align: center;margin-top: 100px">
-              查看更多碳酸盐...
-            </div>
+            <div class="qqq">能源需求增长率</div>
+            <el-input v-model="form.abcdeqw" placeholder="能源需求增长率例如:3%">
+              <template #prepend>
+                <el-button :icon="Search" />
+              </template>
+            </el-input>
+            <br>
+            <br>
+            <div class="qqq">电力市场价格波动范围</div>
+            <el-input v-model="form.abcdeqwe" placeholder="电力市场价格波动范围例如:10%">
+              <template #prepend>
+                <el-button :icon="Search" />
+              </template>
+            </el-input>
+            <br>
+            <br>
+            <div class="qqq">资本投资预算限制</div>
+            <el-input v-model="form.abcdeqwer" placeholder="资本投资预算限制例如:5000亿元">
+              <template #prepend>
+                <el-button :icon="Search" />
+              </template>
+            </el-input>
+<!--            <div style="display: grid;grid-template-columns: 50% 49% ;row-gap: 1%;column-gap: 10%">-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  含CaCO3-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  含MgCO3-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  含Na2CO3-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  含BaCO3-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  含Li2CO3-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  含K2CO3-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--            </div>-->
+<!--            <div style="color: #1111bb;text-align: center;margin-top: 100px">-->
+<!--              查看更多碳酸盐...-->
+<!--            </div>-->
           </template>
         </el-card>
-        <el-card style="height: 280px;margin-top: 20px;">
+        <el-card style="height: 340px;margin-top: 20px;">
           <template #header>
             <div style="display: flex;justify-content: space-between;">
-              <div>过程排放 - 碳酸盐分解CO2排放</div>
+              <div>资源可获得性与区域性限制</div>
               <img src="/src/assets/svg/u540.svg" style="width: 6%;object-fit: contain" />
             </div>
           </template>
           <template #default>
-            <div style="display: grid;grid-template-columns: 30% 30% 30%;row-gap: 1%;column-gap: 10%">
-              <el-checkbox>
-                <template #default>
-                  高压法
-                </template>
-              </el-checkbox>
-              <el-checkbox>
-                <template #default>
-                  中压法
-                </template>
-              </el-checkbox>
-              <el-checkbox>
-                <template #default>
-                  常压法
-                </template>
-              </el-checkbox>
-              <el-checkbox>
-                <template #default>
-                  综合法
-                </template>
-              </el-checkbox>
-              <el-checkbox>
-                <template #default>
-                  低压法
-                </template>
-              </el-checkbox>
-              <el-checkbox>
-                <template #default>
-                  氧化法
-                </template>
-              </el-checkbox>
-            </div>
+            <div class="qqq">可开发能源资源总量</div>
+            <el-input v-model="form.abcdeqwera" placeholder="可开发能源资源总量例如:150GW">
+              <template #prepend>
+                <el-button :icon="Search" />
+              </template>
+            </el-input>
+<!--            <div style="display: grid;grid-template-columns: 30% 30% 30%;row-gap: 1%;column-gap: 10%">-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  高压法-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  中压法-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  常压法-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  综合法-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  低压法-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  氧化法-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--            </div>-->
           </template>
         </el-card>
       </div>
@@ -224,84 +287,120 @@ import {Search} from "@element-plus/icons-vue";
         <el-card style="height: 300px">
           <template #header>
             <div style="display: flex;justify-content: space-between;">
-              <div>过程排放 - 原材料消耗产生排放</div>
+              <div>能源供应链约束参数</div>
               <img src="/src/assets/svg/u540.svg" style="width: 6%;object-fit: contain" />
             </div>
           </template>
           <template #default>
-            <div style="display: grid;grid-template-columns: 30% 30% 30%;row-gap: 1%;column-gap: 10%">
-              <el-checkbox>
-                <template #default>
-                  无烟煤
-                </template>
-              </el-checkbox>
-              <el-checkbox>
-                <template #default>
-                  无烟煤
-                </template>
-              </el-checkbox>
-              <el-checkbox>
-                <template #default>
-                  无烟煤
-                </template>
-              </el-checkbox>
-              <el-checkbox>
-                <template #default>
-                  煤制品
-                </template>
-              </el-checkbox>
-              <el-checkbox>
-                <template #default>
-                  燃料油
-                </template>
-              </el-checkbox>
-              <el-checkbox>
-                <template #default>
-                  石油焦
-                </template>
-              </el-checkbox>
-              <el-checkbox>
-                <template #default>
-                  冰醋酸
-                </template>
-              </el-checkbox>
-              <el-checkbox>
-                <template #default>
-                  二甲苯
-                </template>
-              </el-checkbox>
-              <el-checkbox>
-                <template #default>
-                  天然气
-                </template>
-              </el-checkbox>
-            </div>
+            <div class="qqq">能源进口依赖度限制</div>
+            <el-input v-model="form.abcdeqweraz" placeholder="能源进口依赖度限制例如:40%">
+              <template #prepend>
+                <el-button :icon="Search" />
+              </template>
+            </el-input>
+            <br>
+            <br>
+            <div class="qqq">能源储备水平要求</div>
+            <el-input v-model="form.abcdeqwerazd" placeholder="能源储备水平要求例如:30天">
+              <template #prepend>
+                <el-button :icon="Search" />
+              </template>
+            </el-input>
+<!--            <div style="display: grid;grid-template-columns: 30% 30% 30%;row-gap: 1%;column-gap: 10%">-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  无烟煤-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  无烟煤-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  无烟煤-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  煤制品-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  燃料油-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  石油焦-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  冰醋酸-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  二甲苯-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  天然气-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--            </div>-->
           </template>
         </el-card>
-        <el-card style="height: 280px;margin-top: 20px;">
+        <el-card style="height: 340px;margin-top: 20px;">
           <template #header>
             <div style="display: flex;justify-content: space-between;">
-              <div>过程排放 - 己二酸生产过程的N2O排放</div>
+              <div>社会经济发展与人口相关参数</div>
               <img src="/src/assets/svg/u540.svg" style="width: 6%;object-fit: contain" />
             </div>
           </template>
           <template #default>
-            <div style="display: grid;grid-template-columns: 30% 30% 30%;row-gap: 1%;column-gap: 10%">
-              <el-checkbox>
-                <template #default>
-                  硝酸氧化
-                </template>
-              </el-checkbox>
-              <el-checkbox>
-                <template #default>
-                  其他
-                </template>
-              </el-checkbox>
-            </div>
+            <div class="qqq">人口增长率</div>
+            <el-input v-model="form.abcdeqwerazdxc" placeholder="人口增长率例如:1%">
+              <template #prepend>
+                <el-button :icon="Search" />
+              </template>
+            </el-input>
+            <br>
+            <br>
+            <div class="qqq">城乡居民能源消费差异</div>
+            <el-input v-model="form.abcdeqwerazdxcc" placeholder="城乡居民能源消费差异例如:1.5倍">
+              <template #prepend>
+                <el-button :icon="Search" />
+              </template>
+            </el-input>
+            <br>
+            <br>
+            <div class="qqq">就业与经济结构变化</div>
+            <el-input v-model="form.abcdeqwerazdxccz" placeholder="就业与经济结构变化例如:30%">
+              <template #prepend>
+                <el-button :icon="Search" />
+              </template>
+            </el-input>
+<!--            <div style="display: grid;grid-template-columns: 30% 30% 30%;row-gap: 1%;column-gap: 10%">-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  硝酸氧化-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--              <el-checkbox>-->
+<!--                <template #default>-->
+<!--                  其他-->
+<!--                </template>-->
+<!--              </el-checkbox>-->
+<!--            </div>-->
           </template>
         </el-card>
       </div>
-      <el-card style="height: 600px">
+      <el-card style="height: 660px">
         <template #header>
           <div style="display: flex;justify-content: space-between;">
             <div>回收利用 - 不考虑自用</div>
@@ -309,7 +408,7 @@ import {Search} from "@element-plus/icons-vue";
           </div>
         </template>
         <template #default>
-          <el-input placeholder="请输入回收利用的气体">
+          <el-input v-model="form.abcdeqwerazdxcczx" placeholder="回收利用的气体">
             <template #prepend>
               <el-button :icon="Search" />
             </template>
@@ -353,5 +452,12 @@ import {Search} from "@element-plus/icons-vue";
 </template>
 
 <style scoped lang="scss">
-
+.qqq{
+  font-weight: 700;
+  height: 32px;
+  line-height: 32px;
+  align-items: flex-start;
+  box-sizing: border-box;
+  color: #606266;
+}
 </style>

+ 15 - 15
src/views/b/aa/index.vue

@@ -6,20 +6,20 @@
           <el-aside style="width: 600px; margin-right: 20px;">
             <div class="config-container">
               <el-form ref="formRef" :model="form" :rules="rules" label-width="150px" @submit.native.prevent="saveConfig">
-                <el-form-item label="基准率参数" prop="baseParams">
-                  <el-input v-model="form.baseParams" placeholder="请输入基准率参数"></el-input>
+                <el-form-item label="平均低位热值" prop="baseParams">
+                  <el-input v-model="form.baseParams" placeholder="请输入平均低位热值"></el-input>
                 </el-form-item>
-                <el-form-item label="年度能源消费总量" prop="scenarioParams">
-                  <el-input v-model="form.scenarioParams" placeholder="请输入年度能源消费总量"></el-input>
+                <el-form-item label="能源转换效率" prop="scenarioParams">
+                  <el-input v-model="form.scenarioParams" placeholder="请输入能源转换效率"></el-input>
                 </el-form-item>
-                <el-form-item label="工业能耗比例" prop="boundaryParams">
-                  <el-input v-model="form.boundaryParams" placeholder="工业能耗比例"></el-input>
+                <el-form-item label="基准能耗参数" prop="boundaryParams">
+                  <el-input v-model="form.boundaryParams" placeholder="请输入基准能耗参数"></el-input>
                 </el-form-item>
-                <el-form-item label="建筑能耗比例" prop="otherParams">
-                  <el-input v-model="form.otherParams" placeholder="请输入建筑能耗比例"></el-input>
+                <el-form-item label="基础碳排放因子" prop="otherParams">
+                  <el-input v-model="form.otherParams" placeholder="请输入基础碳排放因子"></el-input>
                 </el-form-item>
-                <el-form-item label="交通能耗比例" prop="remarks">
-                  <el-input v-model="form.remarks" type="textarea" placeholder="请输入交通能耗比例"></el-input>
+                <el-form-item label="基础社会经济参数" prop="remarks">
+                  <el-input v-model="form.remarks" type="textarea" placeholder="请输入基础社会经济参数"></el-input>
                 </el-form-item>
                 <el-form-item label="日期" prop="date">
                   <el-date-picker
@@ -124,19 +124,19 @@ const formRef = ref(null);
 
 const rules = {
   baseParams: [
-    { required: true, message: '请输入基础类参数', trigger: 'blur' }
+    { required: true, message: '请输入平均低位热值', trigger: 'blur' }
   ],
   scenarioParams: [
-    { required: true, message: '请输入情景依托类参数', trigger: 'blur' }
+    { required: true, message: '请输入能源转换效率', trigger: 'blur' }
   ],
   boundaryParams: [
-    { required: true, message: '请输入规划边界类参数', trigger: 'blur' }
+    { required: true, message: '请输入基准能耗参数', trigger: 'blur' }
   ],
   otherParams: [
-    { required: true, message: '请输入其他参数', trigger: 'blur' }
+    { required: true, message: '请输入基础碳排放因子', trigger: 'blur' }
   ],
   remarks: [
-    { required: true, message: '请输入备注', trigger: 'blur' }
+    { required: true, message: '请输入基础社会经济参数', trigger: 'blur' }
   ],
   date: [
     { required: true, message: '请选择日期', trigger: 'change' }

+ 2 - 2
src/views/b/ab/index.vue

@@ -359,7 +359,7 @@ const updateChart = () => {
 const updateNationalPowerGenerationChart = () => {
   const option = {
     title: {
-      text: '年度全国发电量',
+      text: '年度发电量',
       left: 'center'
     },
     tooltip: {
@@ -473,7 +473,7 @@ const updateNationalPowerGenerationChart = () => {
 const updateNationalInstalledCapacityChart = () => {
   const option = {
     title: {
-      text: '全国装机容量',
+      text: '装机容量',
       left: 'center'
     },
     tooltip: {

+ 8 - 4
src/views/c/aa/index.vue

@@ -54,6 +54,7 @@ const carbonChartType = ref('bar');
 const productChartType = ref('bar');
 
 const tableData = ref([
+  { name: '', energy:0 , carbon: 0, product: 0 },
   { name: '奇趣科技有限公司', energy: 120, carbon: 100, product: 0.5 },
   { name: '神秘生物研究所', energy: 132, carbon: 110, product: 0.6 },
   { name: '幽灵电子厂', energy: 101, carbon: 90, product: 0.4 },
@@ -139,7 +140,8 @@ const updateEnergyChart = () => {
         name: '能耗总量',
         type: energyChartType.value,
         data: tableData.value.map(item => item.energy),
-        areaStyle: {}
+        areaStyle: {},
+        barWidth: '30%' // 调整柱状图宽度
       }
     ]
   };
@@ -174,7 +176,7 @@ const updateCarbonChart = () => {
     tooltip: {
       trigger: 'axis',
       axisPointer: {
-        type: 'cross',
+        type: 'shadow',
         label: {
           backgroundColor: '#6a7985'
         }
@@ -223,7 +225,8 @@ const updateCarbonChart = () => {
         name: '碳排总量',
         type: carbonChartType.value,
         data: tableData.value.map(item => item.carbon),
-        areaStyle: {}
+        areaStyle: {},
+        barWidth: '30%' // 调整柱状图宽度
       }
     ]
   };
@@ -307,7 +310,8 @@ const updateProductChart = () => {
         name: '产品单耗',
         type: productChartType.value,
         data: tableData.value.map(item => item.product),
-        areaStyle: {}
+        areaStyle: {},
+        barWidth: '30%' // 调整柱状图宽度
       }
     ]
   };

+ 238 - 0
src/views/d/aa/NewPage.vue

@@ -0,0 +1,238 @@
+<template>
+  <div class="product-process-diagram">
+    <h3>产品工序图</h3>
+    <el-select v-model="selectedIndustry" placeholder="请选择行业" style="width: 300px; margin-bottom: 20px;">
+      <el-option
+          v-for="industry in industries"
+          :key="industry.value"
+          :label="industry.label"
+          :value="industry.value"
+      />
+    </el-select>
+<!--    <div ref="processChart" style="width: 100%; height: 400px;"></div>-->
+    <div v-if="selectedIndustry == 'steel'">
+      <img src="./asset/steel-carbon-emission-process.svg" />
+    </div>
+    <div v-if="selectedIndustry == 'construction'">
+      <img src="./asset/cement-carbon-emission-process.svg" />
+    </div>
+    <div v-if="selectedIndustry == 'battery'">
+      <img src="./asset/battery-carbon-emission-process.svg" />
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, onMounted, watch, computed } from 'vue'
+import * as echarts from 'echarts'
+import {
+  ElSelect,
+  ElOption
+} from 'element-plus'
+
+const selectedIndustry = ref('')
+const processChart = ref(null)
+
+const industries = [
+  { label: '钢铁', value: 'steel' },
+  { label: '水泥', value: 'construction' },
+  { label: '动力电池', value: 'battery' }
+]
+
+const industryData = {
+  steel: [
+    {
+      name: '炼钢',
+      children: [
+        {
+          name: '炼铁',
+          children: [
+            { name: '铁矿石', carbonFootprint: 0.1 },
+            { name: '球团', carbonFootprint: 0.2 },
+            { name: 'DRI', carbonFootprint: 0.1 },
+            { name: 'HBI', carbonFootprint: 0.1 }
+          ]
+        }
+      ]
+    }
+  ],
+  construction: [
+    {
+      name: '水泥生产',
+      children: [
+        {
+          name: '原料准备',
+          children: [
+            { name: '石灰石破碎', carbonFootprint: 0.1 },
+            { name: '粘土混合', carbonFootprint: 0.1 }
+          ]
+        },
+        {
+          name: '熟料烧成',
+          children: [
+            { name: '窑炉烧成', carbonFootprint: 1.2 },
+            { name: '冷却机', carbonFootprint: 0.1 }
+          ]
+        },
+        {
+          name: '水泥粉磨',
+          children: [
+            { name: '球磨机', carbonFootprint: 0.3 },
+            { name: '立磨', carbonFootprint: 0.2 }
+          ]
+        },
+        {
+          name: '包装与储存',
+          children: [
+            { name: '袋装', carbonFootprint: 0.1 },
+            { name: '散装', carbonFootprint: 0.1 }
+          ]
+        }
+      ]
+    }
+  ],
+  battery: [
+    {
+      name: '动力电池制造',
+      children: [
+        {
+          name: '正极材料',
+          children: [
+            {name: '锂盐合成', carbonFootprint: 0.5},
+            {name: '前驱体制备', carbonFootprint: 0.3}
+          ]
+        },
+        {
+          name: '负极材料',
+          children: [
+            {name: '石墨化', carbonFootprint: 0.4},
+            {name: '碳化', carbonFootprint: 0.2}
+          ]
+        },
+        {
+          name: '电解液',
+          children: [
+            {name: '溶剂配制', carbonFootprint: 0.2},
+            {name: '锂盐溶解', carbonFootprint: 0.1}
+          ]
+        },
+        {
+          name: '电池组装',
+          children: [
+            {name: '电芯装配', carbonFootprint: 0.1},
+            {name: '电池封装', carbonFootprint: 0.1}
+          ]
+        },
+        {
+          name: '电池测试',
+          children: [
+            {name: '性能测试', carbonFootprint: 0.1},
+            {name: '安全测试', carbonFootprint: 0.1}
+          ]
+        }
+      ]
+    }
+  ]
+}
+
+const initProcessChart = () => {
+  if (!processChart.value) {
+    console.error('processChart is not available');
+    return;
+  }
+
+  const chart = echarts.init(processChart.value);
+  const selectedIndustryData = industryData[selectedIndustry.value] || [];
+  const treeData = {
+    name: industries.find(item => item.value === selectedIndustry.value).label,
+    children: selectedIndustryData.map(product => ({
+      name: product.name,
+      value: product.carbonFootprint,
+      children: product.children ? product.children.map(child => ({
+        name: child.name,
+        value: child.carbonFootprint,
+        children: child.children
+      })) : []
+    })).filter(item => item.children)
+  };
+
+  const isSteel = selectedIndustry.value === 'steel';
+  const orientation = isSteel ? 'RL' : 'LR';
+
+  const option = {
+    backgroundColor: '#fff',
+    title: {
+      subtext: '产品工序图',
+      left: 'center'
+    },
+    series: [
+      {
+        type: 'tree',
+        id: 0,
+        name: 'tree',
+        data: [treeData],
+        top: '18%',
+        bottom: '14%',
+        layout: 'orthogonal', // 保持正交布局
+        symbol: 'emptyCircle',
+        symbolSize: 7,
+        initialTreeDepth: 3,
+        animationDurationUpdate: 750,
+        label: {
+          position: isSteel ? 'right' : 'left', // 根据方向调整标签位置
+          verticalAlign: 'middle',
+          align: isSteel ? 'left' : 'right', // 根据方向调整文本对齐方式
+          fontSize: 16
+        },
+        leaves: {
+          label: {
+            position: isSteel ? 'left' : 'right', // 根据方向调整叶子节点的标签位置
+            verticalAlign: 'middle',
+            align: isSteel ? 'right' : 'left' // 根据方向调整文本对齐方式
+          }
+        },
+        expandAndCollapse: true,
+        roam: true,
+        itemStyle: {
+          color: '#1f77b4',
+          borderColor: '#1f77b4'
+        },
+        orient: orientation // 动态设置方向
+      }
+    ],
+    tooltip: {
+      trigger: 'item'
+    }
+  };
+  chart.setOption(option);
+};
+
+watch(selectedIndustry, (newVal) => {
+  if (newVal) {
+    initProcessChart();
+  }
+});
+
+onMounted(() => {
+  if (selectedIndustry.value) {
+    initProcessChart();
+  }
+});
+</script>
+
+<style scoped>
+.product-process-diagram {
+  display: flex;
+  flex-direction: column;
+  height: 90vh;
+}
+
+h3 {
+  margin-bottom: 20px;
+}
+
+.chart-container {
+  width: 100%;
+  height: 400px;
+}
+</style>

+ 91 - 0
src/views/d/aa/asset/battery-carbon-emission-process.svg

@@ -0,0 +1,91 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 500">
+  <!-- 白色背景 -->
+  <rect width="100%" height="100%" fill="white"/>
+
+  <!-- 阶段标题 -->
+  <g font-family="Arial" font-size="20" fill="#333">
+    <text x="150" y="60" text-anchor="middle" font-weight="bold">原材料</text>
+    <text x="450" y="60" text-anchor="middle" font-weight="bold">材料处理</text>
+    <text x="750" y="60" text-anchor="middle" font-weight="bold">电芯制造</text>
+    <text x="1050" y="60" text-anchor="middle" font-weight="bold">电池组装</text>
+  </g>
+
+  <!-- 碳排放说明 -->
+  <g font-family="Arial" font-size="12" fill="#D32F2F">
+    <text x="450" y="85" text-anchor="middle">⚠️ 重点碳排放阶段</text>
+    <text x="450" y="100" text-anchor="middle">(能源消耗+工艺排放,约占总排放70%)</text>
+  </g>
+
+  <!-- 原材料阶段 -->
+  <g transform="translate(50,130)">
+    <rect width="200" height="60" rx="5" fill="#E3F2FD" stroke="#1565C0"/>
+    <text x="100" y="30" text-anchor="middle">正极材料</text>
+    <text x="100" y="45" text-anchor="middle" font-size="12" fill="#666">(碳酸锂/氧化钴等)</text>
+  </g>
+  <g transform="translate(50,200)">
+    <rect width="200" height="60" rx="5" fill="#E3F2FD" stroke="#1565C0"/>
+    <text x="100" y="30" text-anchor="middle">负极材料</text>
+    <text x="100" y="45" text-anchor="middle" font-size="12" fill="#666">(石墨/硅碳等)</text>
+  </g>
+  <g transform="translate(50,270)">
+    <rect width="200" height="50" rx="5" fill="#E3F2FD" stroke="#1565C0"/>
+    <text x="100" y="30" text-anchor="middle">其他材料</text>
+  </g>
+
+  <!-- 材料处理阶段 -->
+  <g transform="translate(350,130)">
+    <rect width="200" height="70" rx="5" fill="#FF8A80" stroke="#D32F2F" stroke-width="3"/>
+    <text x="100" y="30" text-anchor="middle" fill="#D32F2F" font-weight="bold">正极材料制备</text>
+    <text x="100" y="45" text-anchor="middle" font-size="12" fill="#D32F2F">高温烧结工艺</text>
+    <text x="100" y="60" text-anchor="middle" font-size="12" fill="#D32F2F">能源排放:约占总排放40%</text>
+  </g>
+  <g transform="translate(350,210)">
+    <rect width="200" height="70" rx="5" fill="#FF8A80" stroke="#D32F2F" stroke-width="3"/>
+    <text x="100" y="30" text-anchor="middle" fill="#D32F2F" font-weight="bold">负极材料制备</text>
+    <text x="100" y="45" text-anchor="middle" font-size="12" fill="#D32F2F">石墨化工艺</text>
+    <text x="100" y="60" text-anchor="middle" font-size="12" fill="#D32F2F">能源排放:约占总排放30%</text>
+  </g>
+
+  <!-- 电芯制造阶段 -->
+  <g transform="translate(650,130)">
+    <rect width="200" height="70" rx="5" fill="#E8F5E9" stroke="#2E7D32"/>
+    <text x="100" y="30" text-anchor="middle">极片制作</text>
+    <text x="100" y="45" text-anchor="middle" font-size="12" fill="#666">涂布/辊压/分切</text>
+    <text x="100" y="60" text-anchor="middle" font-size="12" fill="#666">电力消耗:约占15%</text>
+  </g>
+  <g transform="translate(650,210)">
+    <rect width="200" height="70" rx="5" fill="#E8F5E9" stroke="#2E7D32"/>
+    <text x="100" y="30" text-anchor="middle">电芯组装</text>
+    <text x="100" y="45" text-anchor="middle" font-size="12" fill="#666">卷绕/注液/化成</text>
+    <text x="100" y="60" text-anchor="middle" font-size="12" fill="#666">电力消耗:约占10%</text>
+  </g>
+
+  <!-- 电池组装阶段 -->
+  <g transform="translate(950,170)">
+    <rect width="200" height="70" rx="5" fill="#FCE4EC" stroke="#C2185B"/>
+    <text x="100" y="30" text-anchor="middle">电池组装</text>
+    <text x="100" y="45" text-anchor="middle" font-size="12" fill="#666">PACK组装/测试</text>
+    <text x="100" y="60" text-anchor="middle" font-size="12" fill="#666">电力消耗:约占5%</text>
+  </g>
+
+  <!-- 连接线 -->
+  <g stroke="#666" stroke-width="2" fill="none" marker-end="url(#arrowhead)">
+    <path d="M 250 160 H 350"/>
+    <path d="M 250 230 H 350"/>
+    <path d="M 250 295 H 300 V 245 H 350"/>
+    
+    <path d="M 550 165 H 650"/>
+    <path d="M 550 245 H 650"/>
+    
+    <path d="M 850 165 H 900 V 205 H 950"/>
+    <path d="M 850 245 H 900 V 205 H 950"/>
+  </g>
+
+  <!-- 箭头定义 -->
+  <defs>
+    <marker id="arrowhead" markerWidth="10" markerHeight="7" 
+    refX="9" refY="3.5" orient="auto">
+      <polygon points="0 0, 10 3.5, 0 7" fill="#666"/>
+    </marker>
+  </defs>
+</svg>

+ 86 - 0
src/views/d/aa/asset/cement-carbon-emission-process.svg

@@ -0,0 +1,86 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 500">
+  <!-- 白色背景 -->
+  <rect width="100%" height="100%" fill="white"/>
+
+  <!-- 阶段标题 -->
+  <g font-family="Arial" font-size="20" fill="#333">
+    <text x="150" y="60" text-anchor="middle" font-weight="bold">原材料</text>
+    <text x="450" y="60" text-anchor="middle" font-weight="bold">原料预处理</text>
+    <text x="750" y="60" text-anchor="middle" font-weight="bold">熟料制造</text>
+    <text x="1050" y="60" text-anchor="middle" font-weight="bold">水泥制成</text>
+  </g>
+
+  <!-- 碳排放说明 -->
+  <g font-family="Arial" font-size="12" fill="#D32F2F">
+    <text x="750" y="85" text-anchor="middle">⚠️ 重点碳排放阶段</text>
+    <text x="750" y="100" text-anchor="middle">(原料分解+燃料燃烧,约占总排放85%)</text>
+  </g>
+
+  <!-- 原材料阶段 -->
+  <g transform="translate(50,130)">
+    <rect width="200" height="60" rx="5" fill="#E3F2FD" stroke="#1565C0"/>
+    <text x="100" y="30" text-anchor="middle">石灰石</text>
+    <text x="100" y="45" text-anchor="middle" font-size="12" fill="#666">(CaCO₃)</text>
+  </g>
+  <g transform="translate(50,200)">
+    <rect width="200" height="50" rx="5" fill="#E3F2FD" stroke="#1565C0"/>
+    <text x="100" y="30" text-anchor="middle">煤炭/燃料</text>
+  </g>
+  <g transform="translate(50,270)">
+    <rect width="200" height="50" rx="5" fill="#E3F2FD" stroke="#1565C0"/>
+    <text x="100" y="30" text-anchor="middle">其他原料</text>
+  </g>
+
+  <!-- 原料预处理阶段 -->
+  <g transform="translate(350,140)">
+    <rect width="200" height="50" rx="5" fill="#E8F5E9" stroke="#2E7D32"/>
+    <text x="100" y="30" text-anchor="middle">破碎筛分</text>
+  </g>
+  <g transform="translate(350,220)">
+    <rect width="200" height="50" rx="5" fill="#E8F5E9" stroke="#2E7D32"/>
+    <text x="100" y="30" text-anchor="middle">原料粉磨</text>
+    <text x="100" y="70" text-anchor="middle" font-size="12" fill="#666">电力消耗:约占总耗电25%</text>
+  </g>
+
+  <!-- 熟料制造阶段 -->
+  <g transform="translate(650,130)">
+    <rect width="200" height="70" rx="5" fill="#FF8A80" stroke="#D32F2F" stroke-width="3"/>
+    <text x="100" y="30" text-anchor="middle" fill="#D32F2F" font-weight="bold">预热分解</text>
+    <text x="100" y="45" text-anchor="middle" font-size="12" fill="#D32F2F">CaCO₃ → CaO + CO₂↑</text>
+    <text x="100" y="60" text-anchor="middle" font-size="12" fill="#D32F2F">工艺排放:约占总排放50%</text>
+  </g>
+  <g transform="translate(650,220)">
+    <rect width="200" height="70" rx="5" fill="#FF8A80" stroke="#D32F2F" stroke-width="3"/>
+    <text x="100" y="30" text-anchor="middle" fill="#D32F2F" font-weight="bold">窑内煅烧</text>
+    <text x="100" y="45" text-anchor="middle" font-size="12" fill="#D32F2F">煤炭燃烧CO₂排放</text>
+    <text x="100" y="60" text-anchor="middle" font-size="12" fill="#D32F2F">能源排放:约占总排放35%</text>
+  </g>
+
+  <!-- 水泥制成阶段 -->
+  <g transform="translate(950,180)">
+    <rect width="200" height="50" rx="5" fill="#FCE4EC" stroke="#C2185B"/>
+    <text x="100" y="30" text-anchor="middle">水泥粉磨</text>
+    <text x="100" y="70" text-anchor="middle" font-size="12" fill="#666">电力消耗:约占总耗电40%</text>
+  </g>
+
+  <!-- 连接线 -->
+  <g stroke="#666" stroke-width="2" fill="none" marker-end="url(#arrowhead)">
+    <path d="M 250 160 H 350"/>
+    <path d="M 250 225 H 300 V 245 H 350"/>
+    <path d="M 250 295 H 300 V 245 H 350"/>
+    
+    <path d="M 550 165 H 650"/>
+    <path d="M 550 245 H 600 V 165 H 650"/>
+    
+    <path d="M 850 165 H 900 V 205 H 950"/>
+    <path d="M 850 255 H 900 V 205 H 950"/>
+  </g>
+
+  <!-- 箭头定义 -->
+  <defs>
+    <marker id="arrowhead" markerWidth="10" markerHeight="7" 
+    refX="9" refY="3.5" orient="auto">
+      <polygon points="0 0, 10 3.5, 0 7" fill="#666"/>
+    </marker>
+  </defs>
+</svg>

+ 85 - 0
src/views/d/aa/asset/steel-carbon-emission-process.svg

@@ -0,0 +1,85 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 500">
+  <!-- 白色背景 -->
+  <rect width="100%" height="100%" fill="white"/>
+
+  <!-- 阶段标题 -->
+  <g font-family="Arial" font-size="20" fill="#333">
+    <text x="150" y="60" text-anchor="middle" font-weight="bold">原材料</text>
+    <text x="450" y="60" text-anchor="middle" font-weight="bold">烧结/球团</text>
+    <text x="750" y="60" text-anchor="middle" font-weight="bold">炼铁</text>
+    <text x="1050" y="60" text-anchor="middle" font-weight="bold">炼钢</text>
+  </g>
+
+  <!-- 碳排放说明 -->
+  <g font-family="Arial" font-size="12" fill="#D32F2F">
+    <text x="750" y="85" text-anchor="middle">⚠️ 重点碳排放阶段</text>
+    <text x="750" y="100" text-anchor="middle">(焦炭燃烧+还原反应,约占总排放80%)</text>
+  </g>
+
+  <!-- 原材料阶段 -->
+  <g transform="translate(50,130)">
+    <rect width="200" height="60" rx="5" fill="#E3F2FD" stroke="#1565C0"/>
+    <text x="100" y="30" text-anchor="middle">铁矿石</text>
+    <text x="100" y="45" text-anchor="middle" font-size="12" fill="#666">(Fe2O3/Fe3O4)</text>
+  </g>
+  <g transform="translate(50,200)">
+    <rect width="200" height="60" rx="5" fill="#E3F2FD" stroke="#1565C0"/>
+    <text x="100" y="30" text-anchor="middle">焦炭</text>
+    <text x="100" y="45" text-anchor="middle" font-size="12" fill="#666">(还原剂+燃料)</text>
+  </g>
+  <g transform="translate(50,270)">
+    <rect width="200" height="50" rx="5" fill="#E3F2FD" stroke="#1565C0"/>
+    <text x="100" y="30" text-anchor="middle">辅料</text>
+  </g>
+
+  <!-- 烧结/球团阶段 -->
+  <g transform="translate(350,130)">
+    <rect width="200" height="70" rx="5" fill="#FF8A80" stroke="#D32F2F" stroke-width="3"/>
+    <text x="100" y="30" text-anchor="middle" fill="#D32F2F" font-weight="bold">烧结</text>
+    <text x="100" y="45" text-anchor="middle" font-size="12" fill="#D32F2F">高温烧结工艺</text>
+    <text x="100" y="60" text-anchor="middle" font-size="12" fill="#D32F2F">能源排放:约占总排放15%</text>
+  </g>
+  <g transform="translate(350,210)">
+    <rect width="200" height="70" rx="5" fill="#FF8A80" stroke="#D32F2F" stroke-width="3"/>
+    <text x="100" y="30" text-anchor="middle" fill="#D32F2F" font-weight="bold">球团</text>
+    <text x="100" y="45" text-anchor="middle" font-size="12" fill="#D32F2F">造球焙烧</text>
+    <text x="100" y="60" text-anchor="middle" font-size="12" fill="#D32F2F">能源排放:约占总排放10%</text>
+  </g>
+
+  <!-- 炼铁阶段 -->
+  <g transform="translate(650,130)">
+    <rect width="200" height="100" rx="5" fill="#FF8A80" stroke="#D32F2F" stroke-width="3"/>
+    <text x="100" y="30" text-anchor="middle" fill="#D32F2F" font-weight="bold">高炉炼铁</text>
+    <text x="100" y="45" text-anchor="middle" font-size="12" fill="#D32F2F">Fe2O3 + 3CO → 2Fe + 3CO2↑</text>
+    <text x="100" y="60" text-anchor="middle" font-size="12" fill="#D32F2F">工艺排放:约占总排放45%</text>
+    <text x="100" y="75" text-anchor="middle" font-size="12" fill="#D32F2F">能源排放:约占总排放10%</text>
+  </g>
+
+  <!-- 炼钢阶段 -->
+  <g transform="translate(950,130)">
+    <rect width="200" height="70" rx="5" fill="#E8F5E9" stroke="#2E7D32"/>
+    <text x="100" y="30" text-anchor="middle">转炉炼钢</text>
+    <text x="100" y="45" text-anchor="middle" font-size="12" fill="#666">脱碳工艺</text>
+    <text x="100" y="60" text-anchor="middle" font-size="12" fill="#666">能源排放:约占总排放20%</text>
+  </g>
+
+  <!-- 连接线 -->
+  <g stroke="#666" stroke-width="2" fill="none" marker-end="url(#arrowhead)">
+    <path d="M 250 160 H 350"/>
+    <path d="M 250 230 H 350"/>
+    <path d="M 250 295 H 300 V 245 H 350"/>
+    
+    <path d="M 550 165 H 650"/>
+    <path d="M 550 245 H 600 V 180 H 650"/>
+    
+    <path d="M 850 180 H 950"/>
+  </g>
+
+  <!-- 箭头定义 -->
+  <defs>
+    <marker id="arrowhead" markerWidth="10" markerHeight="7" 
+    refX="9" refY="3.5" orient="auto">
+      <polygon points="0 0, 10 3.5, 0 7" fill="#666"/>
+    </marker>
+  </defs>
+</svg>

+ 4 - 12
src/views/d/aa/index.vue

@@ -66,18 +66,9 @@
             <div ref="processChart" style="width: 100%; height: 400px;"></div>
           </el-dialog>
         </el-tab-pane>
-<!--        <el-tab-pane label="工序积木图" name="processDiagram">-->
-<!--          <h3>工序积木图</h3>-->
-<!--          <el-select v-model="selectedIndustry" placeholder="请选择行业" style="margin-bottom: 20px;">-->
-<!--            <el-option-->
-<!--                v-for="industry in industries"-->
-<!--                :key="industry.value"-->
-<!--                :label="industry.label"-->
-<!--                :value="industry.value"-->
-<!--            />-->
-<!--          </el-select>-->
-<!--          -->
-<!--        </el-tab-pane>-->
+        <el-tab-pane label="产品工序图" name="processDiagram">
+          <NewPage></NewPage>
+        </el-tab-pane>
       </el-tabs>
     </el-main>
   </div>
@@ -99,6 +90,7 @@ import {
   ElDialog,
   ElMessage
 } from 'element-plus'
+import NewPage from "@/views/d/aa/NewPage.vue";
 
 const activeTab = ref('productLibrary')
 const selectedIndustry = ref('')

+ 6 - 0
src/views/e/aa/index.vue

@@ -34,6 +34,12 @@
           </el-select>
         </el-form-item>
       </el-form>
+      <div style="height: 40px">
+        当前热搜关键词:
+        <el-tag v-for="keyword in uniqueKeywords.slice(0, 5)" :key="keyword" type="success" style="margin-right: 5px;">
+          {{ keyword }}
+        </el-tag>
+      </div>
       <div>
         <el-button type="primary" @click="exportData">导出数据</el-button>
         <el-button type="success" @click="showImportDialog = true">导入新闻</el-button>