nazw/nnzwminiapp/pages/dataCenter/dataCenter.wxml

<!--pages/dataCenter/dataCenter.wxml-->
<view class="content">
  <!-- 国民经济统计数据 -->
  <view style="background-color: #FFFFFF;">
    <view style="border-bottom: 1px solid #C5C5C5;">
      <view class="title">
        <image src="{{imgUrl}}statistics.png"></image>
        <view class="title-text">国民经济统计数据</view>
      </view>
    </view>
    <!-- 内容 -->
    <view>
      <scroll-view class="scroll-wrapper" scroll-x scroll-with-animation="true" scroll-into-view="item{{currentTab < 2 ? 0 : currentTab - 1}}">
        <view class="navigate-item" id="item{{index}}" wx:for="{{statistics}}" wx:key="index" data-index="{{index}}" bindtap="tabNav">
          <view class="names {{currentTab === index ? 'active' : ''}}">{{item.title}}</view>
          <view class="currtline {{currentTab === index ? 'active' : ''}}" wx:if="{{currentTab === index}}"></view>
        </view>
      </scroll-view>
      <swiper current="{{currentTab}}" style="padding: 0 10px;margin-top: 15rpx;height: 500rpx;width: 100%;" duration="1" bindchange="handleSwiper">
        <swiper-item catchtouchmove="catchTouchMove" wx:for="{{statistics}}" wx:key="index">
          <ec-canvas id="{{item.name}}" canvas-id="{{item.name}}" ec="{{ streetlinechartec }}" />
        </swiper-item>
      </swiper>
      <view class="statistics-btn">
        <!-- <button>详细数据</button> -->
      </view>
    </view>
  </view>
  <!-- 政务服务数据统计分析 -->
  <view style="background-color: #FFFFFF;margin-top: 30rpx;" bindtap="gotoZWTJ">
    <view style="border-bottom: 1px solid #C5C5C5;">
      <view class="title">
        <image src="{{imgUrl}}riseData.png"></image>
        <view class="title-text">政务服务数据统计分析</view>
      </view>
    </view>
    <!-- 内容 -->
    <view>
      <view>
        <view class="type-title">
          <view class="dots" />
          <view class="type-text">
            本年办件数
          </view>
        </view>
        <!-- 办件数内容 -->
        <view style="display:flex;justify-content: space-between;align-items:center;padding: 0 40rpx;">
          <view style="width: 210rpx;height: 120rpx;background-image: url({{imgUrl}}index-work-number.png);background-size: 100% 100%;">
            <!-- 受理数 -->
            <view style="display:flex;align-items:left;color:#FFFFFF;flex-direction:column;justify-content:center;height: 100%;padding-left:85rpx">
              <view style="font-size:19rpx">受理数</view>
              <view style="display:flex;flex-direction:row;align-items:center">
                <scroll-view scroll-x style="width: 84rpx">
                  <view style="font-size:28rpx;font-weight: bold;">{{officeNumber[0]}}</view>
                </scroll-view>
                <view style="font-size: 19rpx;padding-left:5rpx">件</view>
              </view>
            </view>
          </view>
          <view style="width: 210rpx;height: 120rpx;background-image: url({{imgUrl}}index-finish-number.png);background-size: 100% 100%;">
            <!-- 受理数 -->
            <view style="display:flex;align-items:left;color:#FFFFFF;flex-direction:column;justify-content:center;height: 100%;padding-left:85rpx">
              <view style="font-size:19rpx">办结数</view>
              <view style="display:flex;flex-direction:row;align-items:center">
                <scroll-view scroll-x style="width: 84rpx">
                  <view style="font-size:28rpx;font-weight: bold;">{{officeNumber[1]}}</view>
                </scroll-view>
                <view style="font-size: 19rpx;padding-left:5rpx">件</view>
              </view>
            </view>
          </view>
          <view style="width: 210rpx;height: 120rpx;background-image: url({{imgUrl}}index-request-number.png);background-size: 100% 100%;">
            <!-- 受理数 -->
            <view style="display:flex;align-items:left;color:#FFFFFF;flex-direction:column;justify-content:center;height: 100%;padding-left:85rpx">
              <view style="font-size:19rpx">网络提交</view>
              <view style="display:flex;flex-direction:row;align-items:center">
                <scroll-view scroll-x style="width: 84rpx;">
                  <view style="font-size:28rpx;font-weight: bold;">{{officeNumber[2]}}</view>
                </scroll-view>
                <view style="font-size: 19rpx;padding-left:5rpx">件</view>
              </view>
            </view>
          </view>
        </view>
      </view>
      <view>
        <view class="type-title">
          <view class="dots" />
          <view class="type-text">
            好差评
          </view>
        </view>
        <view style="display: flex;flex-wrap: wrap;justify-content: space-between;padding: 0 40rpx">
          <view class="evaluate">评价我的办件</view>
          <view class="evaluate">评价窗口人员</view>
          <view class="evaluate">评价办事指南</view>
          <view class="evaluate" style="width: 316rpx;">评价服务应用</view>
          <view class="evaluate" style="width: 316rpx;">评价电子证照</view>
        </view>
        <!-- 评价量 -->
        <view style="display: flex;justify-content: space-between;padding: 0 40rpx;">
          <!-- 评价总量 -->
          <view style="height: 100rpx;width:310rpx;display: flex;background-color: #E5F4FE;border-radius: 10px;">
            <!-- 图标 -->
            <view style="width: 100rpx;height: 100%;display: flex;align-items:center;justify-content:center;">
              <image src="{{imgUrl}}index-evalution.png" style="height:64rpx;width:64rpx;"></image>
            </view>
            <!-- 数据 -->
            <view style="width: 210rpx;height: 100%;display:flex;flex-direction: column;justify-content:center">
              <view style="font-size: 19rpx;color: #999999;padding-bottom:8rpx">本年评价总量</view>
              <view style="display:flex;justify-content:left;align-items:center;color: #333333;">
                <view style="font-size: 26rpx;font-weight: bold;">{{evalutionNum}}</view>
                <view style="font-size:20rpx;padding-left:5rpx">条</view>
              </view>
            </view>
          </view>
          <!-- 满意度 -->
          <view style="height: 100rpx;width:310rpx;display: flex;background-color: #E5F4FE;border-radius: 10px;">
            <!-- 图标 -->
            <view style="width: 100rpx;height: 100%;display: flex;align-items:center;justify-content:center">
              <image src="{{imgUrl}}index-good-blud.png" style="height:64rpx;width:70rpx;"></image>
            </view>
            <!-- 数据 -->
            <view style="width: 210rpx;height: 100%;display:flex;flex-direction: column;justify-content:center">
              <view style="font-size: 19rpx;color: #999999;padding-bottom:8rpx">满意度</view>
              <view style="display:flex;justify-content:left;align-items:center;color: #333333;">
                <view style="font-size: 26rpx;font-weight: bold;">{{evalutionRate}}</view>
                <view style="font-size:20rpx;padding-left:5rpx">%</view>
              </view>
            </view>
          </view>
        </view>
        <view style="margin-top: 30rpx;width: 100%;height: 300rpx;">
          <ec-canvas id="goodOrBad" canvas-id="goodOrBad" ec="{{ streetlinechartec }}" />
        </view>
      </view>
      <view>
        <view class="type-title">
          <view class="dots" />
          <view class="type-text">
            南岸区政务服务事项总数
          </view>
        </view>
        <view style="display: flex;justify-content: space-between;padding: 0 30rpx;">
          <view class="matters {{mattersZero > index ? 'default' : '' }}" wx:for="{{matters}}" wx:key="index">{{item}}</view>
          <view style="width: 27rpx;height: 26rpx;font-size: 28rpx;font-weight: 500;color: #999999;margin-top: 80rpx;">项</view>
        </view>
      </view>
      <view>
        <view class="type-title">
          <view class="dots" />
          <view class="type-text">
            一件事一次办
          </view>
        </view>
        <view style="display: flex;justify-content: space-between;padding: 0 40rpx 40rpx 20rpx">
          <view style="position: relative;">
            <image src="{{imgUrl}}textBox4.png" style="width: 290rpx;height: 278rpx;" />
            <view class="oneThing-left-top">套餐总数</view>
            <view class="oneThing-left-bottom">
              <view>258</view>
              <view style="font-size: 25rpx;margin: 23rpx 0 0 10rpx;">件</view>
            </view>
          </view>
          <view>
            <view style="background-image: url('{{imgUrl}}textBox1.png');background-repeat: round;width: 314rpx;height: 93rpx;display: flex;justify-content: space-between;padding: 0 20rpx;">
              <view class="triangles"></view>
              <view style="width: 50rpx;height: 25rpx;"></view>
              <view class="oneThing">减环节</view>
              <view class="oneThing" style="display: flex;">
                <view style="font-size: 34rpx;font-weight: 500;margin-right: 10rpx;">1622</view>
                <view>件</view>
              </view>
            </view>
            <view style="background-image: url('{{imgUrl}}textBox2.png');background-repeat: round;width: 314rpx;height: 93rpx;display: flex;justify-content: space-between;padding: 0 20rpx;">
              <view class="triangles" style="border-left: 18rpx solid #156FA6;"></view>
              <view style="width: 50rpx;height: 25rpx;"></view>
              <view class="oneThing" style="color: #156FA6;">减跑动</view>
              <view class="oneThing" style="display: flex;color: #156FA6;">
                <view style="font-size: 34rpx;font-weight: 500;margin-right: 10rpx;">799</view>
                <view>件</view>
              </view>
            </view>
            <view style="background-image: url('{{imgUrl}}textBox3.png');background-repeat: round;width: 314rpx;height: 93rpx;display: flex;justify-content: space-between;padding: 0 20rpx;">
              <view class="triangles" style="border-left: 18rpx solid #DF6866;"></view>
              <view style="width: 50rpx;height: 25rpx;"></view>
              <view class="oneThing" style="color: #DF6866;">减材料</view>
              <view class="oneThing" style="display: flex;color: #DF6866;">
                <view style="font-size: 34rpx;font-weight: 500;margin-right: 10rpx;">465</view>
                <view>件</view>
              </view>
            </view>
          </view>
        </view>
      </view>
    </view>
  </view>
  <!-- 本年度公开信箱办理情况 -->
  <view style="background-color: #FFFFFF;margin-top: 30rpx;">
    <view style="border-bottom: 1px solid #C5C5C5;">
      <view class="title" bindtap="gotoXXTJ">
        <image src="{{imgUrl}}processing.png"></image>
        <view class="title-text">本年度公开信箱办理情况</view>
      </view>
    </view>
    <!-- 内容 -->
    <view>
      <view style="display: flex;justify-content: space-between;padding: 30rpx 30rpx 20rpx 30rpx;" bindtap="gotoXXTJ">
        <view class="processing">
          <image src="{{imgUrl}}chat.png" style="width: 68rpx;height:68rpx;line-height: 110rpx;position: absolute;top: 50%;transform: translateY(-50%);left: 11rpx;"></image>
          <view style="position: absolute;top: 50%;transform: translateY(-50%);left: 94rpx;">
            <view style="font-size: 20rpx;font-weight: 400;color: #333333;">
              近30天来信
            </view>
            <view style="display: flex;color: #333333;">
              <view style="font-size: 32rpx;font-weight: bold;">{{leaveAMessage.handle}}</view>
              <view style="margin: 10rpx 0 0 10rpx;font-size: 24rpx;">件</view>
            </view>
          </view>
        </view>
        <view class="processing" style="background: #E8F4FF;">
          <image src="{{imgUrl}}message.png" style="width: 68rpx;height:68rpx;line-height: 110rpx;position: absolute;top: 50%;transform: translateY(-50%);left: 11rpx;"></image>
          <view style="position: absolute;top: 50%;transform: translateY(-50%);left: 94rpx;">
            <view style="font-size: 20rpx;font-weight: 400;color: #333333;">
              近30天受理
            </view>
            <view style="display: flex;color: #333333;">
              <view style="font-size: 32rpx;font-weight: bold;">{{leaveAMessage.accepting}}</view>
              <view style="margin: 10rpx 0 0 10rpx;font-size: 24rpx;">件</view>
            </view>
          </view>
        </view>
        <view class="processing" style="background: #E2FFFD;">
          <image src="{{imgUrl}}write.png" style="width: 68rpx;height:68rpx;line-height: 110rpx;position: absolute;top: 50%;transform: translateY(-50%);left: 11rpx;"></image>
          <view style="position: absolute;top: 50%;transform: translateY(-50%);left: 94rpx;">
            <view style="font-size: 20rpx;font-weight: 400;color: #333333;">
              近30天办理
            </view>
            <view style="display: flex;color: #333333;">
              <view style="font-size: 32rpx;font-weight: bold;">{{leaveAMessage.finished}}</view>
              <view style="margin: 10rpx 0 0 10rpx;font-size: 24rpx;">件</view>
            </view>
          </view>
        </view>
      </view>
      <view>
        <view class="type-title">
          <view class="dots" />
          <view class="type-text">
            近90天办理类别统计
          </view>
        </view>
        <view style="height: 500rpx;">
          <ec-canvas id="processingCategory" canvas-id="processingCategory" ec="{{ streetlinechartec }}" />
        </view>
      </view>
      <view>
        <view class="type-title">
          <view class="dots" />
          <view class="type-text">
            近90天公开信箱领域统计
          </view>
        </view>
        <view style="height: 500rpx;">
          <ec-canvas id="publicMailbox" canvas-id="publicMailbox" ec="{{ streetlinechartec }}" />
        </view>
      </view>
    </view>
  </view>
</view>