zxl
2025-03-25 6ae0fcef149ddbe614746023a58a3885b3ac4bde
src/views/index.vue
@@ -72,105 +72,105 @@
        :countExceptionProjectData="countExceptionProjectData"
      />
    </div>
    <el-card>
      <div style="display: flex;min-height: 300px">
        <div style="flex: 2;display: flex;flex-direction: column; justify-content: center;align-items: flex-start">
          <div class="flex justify-between mb-[15px]" style="align-items: center;margin-bottom: 5px">
            <div class="block mb-3 font-semibold fonts">流程推进情况总览</div>
          </div>
          <el-table
            :data="projectProcessData"
            :header-cell-style="{
                background: '#F5F7FC',
                color: '#454B5E',
                fontSize: '12px'
            }"
            min-height="280"
            max-height="280"
          >
            <el-table-column
              label="项目名称"
              prop="name"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              label="当前/总计"
              width="100px"
              prop="num"
            >
            </el-table-column>
          </el-table>
        </div>
        <div style="flex: 1.5;display: flex;justify-content: center;align-items: center">
          <div ref="pie" style="width: 85%; height: 100%;"></div>
        </div>
        <div style="flex: 2;display: flex;flex-direction: column; justify-content: center;align-items: flex-start">
          <div style="display: flex;align-items: center;margin-bottom: 5px;width: 100%">
            <div class="block  font-semibold fonts" style="width: 100%">
              <div style="display: flex; font-size: 12px; justify-content: flex-end;width: 100%">
                <div
                  :class="{ active: true }"
                  class="tab"
                >
                  准时率
                </div>
                <div
                  :class="{ active: false }"
                  class="tab"
                >
                  异常率
                </div>
                <div
                  :class="{ active: false }"
                  class="tab"
                >
                  办结率
                </div>
              </div>
            </div>
          </div>
          <el-table
            :data="projectProcessData1"
            :header-cell-style="{
                background: '#F5F7FC',
                color: '#454B5E',
                fontSize: '12px'
            }"
            min-height="280"
            max-height="280"
          >
            <el-table-column
              label="发布单位"
              width="150"
              prop="name"
            >
            </el-table-column>
            <el-table-column
              label="内容"
              prop="content"
              width="250"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              label="时间"
              prop="time"
            >
            </el-table-column>
            <el-table-column
              fixed="right"
              align="center"
              label="操作"
              >
              <template slot-scope="scope">
                <el-button type="text" size="small">查看</el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </div>
    </el-card>
<!--    <el-card>-->
<!--      <div style="display: flex;min-height: 300px">-->
<!--        <div style="flex: 2;display: flex;flex-direction: column; justify-content: center;align-items: flex-start">-->
<!--          <div class="flex justify-between mb-[15px]" style="align-items: center;margin-bottom: 5px">-->
<!--            <div class="block mb-3 font-semibold fonts">流程推进情况总览</div>-->
<!--          </div>-->
<!--          <el-table-->
<!--            :data="projectProcessData"-->
<!--            :header-cell-style="{-->
<!--                background: '#F5F7FC',-->
<!--                color: '#454B5E',-->
<!--                fontSize: '12px'-->
<!--            }"-->
<!--            min-height="280"-->
<!--            max-height="280"-->
<!--          >-->
<!--            <el-table-column-->
<!--              label="项目名称"-->
<!--              prop="name"-->
<!--              :show-overflow-tooltip="true"-->
<!--            >-->
<!--            </el-table-column>-->
<!--            <el-table-column-->
<!--              label="当前/总计"-->
<!--              width="100px"-->
<!--              prop="num"-->
<!--            >-->
<!--            </el-table-column>-->
<!--          </el-table>-->
<!--        </div>-->
<!--        <div style="flex: 1.5;display: flex;justify-content: center;align-items: center">-->
<!--          <div ref="pie" style="width: 85%; height: 100%;"></div>-->
<!--        </div>-->
<!--        <div style="flex: 2;display: flex;flex-direction: column; justify-content: center;align-items: flex-start">-->
<!--          <div style="display: flex;align-items: center;margin-bottom: 5px;width: 100%">-->
<!--            <div class="block  font-semibold fonts" style="width: 100%">-->
<!--              <div style="display: flex; font-size: 12px; justify-content: flex-end;width: 100%">-->
<!--                <div-->
<!--                  :class="{ active: true }"-->
<!--                  class="tab"-->
<!--                >-->
<!--                  准时率-->
<!--                </div>-->
<!--                <div-->
<!--                  :class="{ active: false }"-->
<!--                  class="tab"-->
<!--                >-->
<!--                  异常率-->
<!--                </div>-->
<!--                <div-->
<!--                  :class="{ active: false }"-->
<!--                  class="tab"-->
<!--                >-->
<!--                  办结率-->
<!--                </div>-->
<!--              </div>-->
<!--            </div>-->
<!--          </div>-->
<!--          <el-table-->
<!--            :data="projectProcessData1"-->
<!--            :header-cell-style="{-->
<!--                background: '#F5F7FC',-->
<!--                color: '#454B5E',-->
<!--                fontSize: '12px'-->
<!--            }"-->
<!--            min-height="280"-->
<!--            max-height="280"-->
<!--          >-->
<!--            <el-table-column-->
<!--              label="发布单位"-->
<!--              width="150"-->
<!--              prop="name"-->
<!--            >-->
<!--            </el-table-column>-->
<!--            <el-table-column-->
<!--              label="内容"-->
<!--              prop="content"-->
<!--              width="250"-->
<!--              :show-overflow-tooltip="true"-->
<!--            >-->
<!--            </el-table-column>-->
<!--            <el-table-column-->
<!--              label="时间"-->
<!--              prop="time"-->
<!--            >-->
<!--            </el-table-column>-->
<!--            <el-table-column-->
<!--              fixed="right"-->
<!--              align="center"-->
<!--              label="操作"-->
<!--              >-->
<!--              <template slot-scope="scope">-->
<!--                <el-button type="text" size="small">查看</el-button>-->
<!--              </template>-->
<!--            </el-table-column>-->
<!--          </el-table>-->
<!--        </div>-->
<!--      </div>-->
<!--    </el-card>-->
    <!-- 待办事项 -->
    <div class="flex">