<template name="skeleton">
  <view class="sk-container">
    <view class="ctr ctr data-v-cda3a350 data-v-cda3a350">
      <view class="fixed-top fixed-top data-v-cda3a350 data-v-cda3a350">
        <view is="components/me-top/me-top" class="data-v-cda3a350 data-v-cda3a350">
          <view class="me-top top--me-top data-v-e4d1a339 top--data-v-e4d1a339">
            <view class="status-bar top--status-bar data-v-e4d1a339 top--data-v-e4d1a339" style="height:47px"></view>
            <view class="capsule top--capsule flex-c top--flex-c data-v-e4d1a339 top--data-v-e4d1a339" style="height:40px">
              <view class="icon-ctr top--icon-ctr flex-c top--flex-c data-v-e4d1a339 top--data-v-e4d1a339">
                <image class="icon top--icon data-v-e4d1a339 top--data-v-e4d1a339 sk-image" mode="aspectFill"></image>
              </view>
              <text class="title top--title data-v-e4d1a339 top--data-v-e4d1a339 sk-transparent sk-text-14-2857-32 sk-text">工作台</text>
            </view>
          </view>
        </view>
        <view class="filter flex-sb line-after data-v-cda3a350 sk-pseudo sk-pseudo-circle">
          <view class="filter-item filter-item flex-c flex-c data-v-cda3a350 data-v-cda3a350">
            <view class="data-v-cda3a350 title flex-c sk-transparent sk-text-0-0000-179 sk-text">进行中(1)</view>
          </view>
          <view class="filter-item filter-item flex-c flex-c data-v-cda3a350 data-v-cda3a350">
            <view class="data-v-cda3a350 title flex-c sk-transparent sk-text-0-0000-567 sk-text">今日(0)</view>
          </view>
          <view class="filter-item filter-item flex-c flex-c data-v-cda3a350 data-v-cda3a350">
            <view class="data-v-cda3a350 title flex-c sk-transparent sk-text-0-0000-602 sk-text">明日(0)</view>
          </view>
          <view class="filter-item filter-item flex-c flex-c data-v-cda3a350 data-v-cda3a350">
            <view class="data-v-cda3a350 title flex-c sk-transparent sk-text-0-0000-602 sk-text">全部(0)</view>
          </view>
        </view>
      </view>
      <view is="components/me-empty-space/me-empty-space" class="data-v-cda3a350 data-v-cda3a350">
        <view class="me-empty-space space--me-empty-space" style="height:137px"></view>
      </view>
      <view class="list list data-v-cda3a350 data-v-cda3a350">
        <view class="order-item order-item data-v-cda3a350 data-v-cda3a350">
          <view class="top top flex-sb flex-sb data-v-cda3a350 data-v-cda3a350">
            <view class="type flex-l data-v-cda3a350 sk-transparent sk-text-14-2857-977 sk-text">乳胶漆</view>
            <view class="price flex-r important-color data-v-cda3a350 sk-transparent sk-text-14-2857-990 sk-text"></view>
          </view>
          <view class="content content flex-sb flex-sb data-v-cda3a350 data-v-cda3a350">
            <view class="left left data-v-cda3a350 data-v-cda3a350">
              <view class="address-name flex-l data-v-cda3a350 sk-transparent sk-text-15-9091-41 sk-text">222</view>
              <view class="address data-v-cda3a350 sk-transparent sk-text-18-1818-14 sk-text">四川省成都市双流区</view>
              <view class="time-ctr time-ctr flex-l flex-l data-v-cda3a350 data-v-cda3a350">
                <view is="components/me-icon/me-icon" class="data-v-cda3a350 data-v-cda3a350">
                  <view class="flex-c icon--flex-c data-v-f0c409e8 icon--data-v-f0c409e8">
                    <text class="me-icon icon--me-icon data-v-f0c409e8 icon--data-v-f0c409e8 icon-time icon--icon-time sk-pseudo sk-pseudo-circle" style="color: var(--themeColor); font-size: 20px; line-height: 20px;"></text>
                  </view>
                </view>
                <text class="time data-v-cda3a350 sk-transparent sk-text-18-1818-755 sk-text">周一 25年3月31日 11:33</text>
              </view>
            </view>
            <view class="right right data-v-cda3a350 data-v-cda3a350">
              <view class="icon-ctr icon-ctr flex-c flex-c data-v-cda3a350 data-v-cda3a350">
                <view is="components/me-icon/me-icon" class="data-v-cda3a350 data-v-cda3a350">
                  <view class="flex-c icon--flex-c data-v-f0c409e8 icon--data-v-f0c409e8">
                    <text class="me-icon icon--me-icon data-v-f0c409e8 icon--data-v-f0c409e8 icon-navigation icon--icon-navigation sk-pseudo sk-pseudo-circle" style="color: var(--descriptionColor); font-size: 30px; line-height: 30px;"></text>
                  </view>
                </view>
              </view>
              <view class="distance flex-c data-v-cda3a350 sk-transparent sk-text-18-1818-111 sk-text">未知距离</view>
            </view>
          </view>
          <view class="user user flex-sb flex-sb data-v-cda3a350 data-v-cda3a350">
            <view class="left left data-v-cda3a350 data-v-cda3a350">
              <view class="user-name user-name flex-l flex-l data-v-cda3a350 data-v-cda3a350">
                <view is="components/me-icon/me-icon" class="data-v-cda3a350 data-v-cda3a350">
                  <view class="flex-c icon--flex-c data-v-f0c409e8 icon--data-v-f0c409e8">
                    <text class="me-icon icon--me-icon data-v-f0c409e8 icon--data-v-f0c409e8 icon-user icon--icon-user sk-pseudo sk-pseudo-circle" style="color: var(--descriptionColor); font-size: 18px; line-height: 18px;"></text>
                  </view>
                </view>
                <view class="name data-v-cda3a350 sk-transparent sk-text-0-0000-613 sk-text">wwww</view>
              </view>
              <view class="phone flex-l data-v-cda3a350 sk-transparent sk-text-0-0000-533 sk-text">11111</view>
            </view>
            <view class="right right flex-c flex-c data-v-cda3a350 data-v-cda3a350">
              <view class="icon-ctr icon-ctr flex-c flex-c data-v-cda3a350 data-v-cda3a350" hover-class="auto-mask-layer-radius8" hover-stay-time="100">
                <view is="components/me-icon/me-icon" class="data-v-cda3a350 data-v-cda3a350">
                  <view class="flex-c icon--flex-c data-v-f0c409e8 icon--data-v-f0c409e8">
                    <text class="me-icon icon--me-icon data-v-f0c409e8 icon--data-v-f0c409e8 icon-call icon--icon-call sk-pseudo sk-pseudo-circle" style="color: var(--themeColor); font-size: 40px; line-height: 40px;"></text>
                  </view>
                </view>
              </view>
            </view>
          </view>
          <view class="operate-ctr operate-ctr flex-sb flex-sb data-v-cda3a350 data-v-cda3a350">
            <view class="status-ctr status-ctr flex-l flex-l data-v-cda3a350 data-v-cda3a350">
              <view is="components/me-icon/me-icon" class="data-v-cda3a350 data-v-cda3a350">
                <view class="flex-c icon--flex-c data-v-f0c409e8 icon--data-v-f0c409e8">
                  <text class="me-icon icon--me-icon data-v-f0c409e8 icon--data-v-f0c409e8 icon-progress-2-line icon--icon-progress-2-line sk-pseudo sk-pseudo-circle" style="color: #E18F00; font-size: 20px; line-height: 20px;"></text>
                </view>
              </view>
              <text class="text data-v-cda3a350 sk-transparent sk-text-14-2857-371 sk-text">待联系客户</text>
            </view>
            <view class="operate operate flex-r flex-r data-v-cda3a350 data-v-cda3a350">
              <view class="btn btn flex-c flex-c data-v-cda3a350 data-v-cda3a350" hover-class="auto-mask-layer-radius8" hover-start-time="0" hover-stay-time="50">
                <view is="components/me-icon/me-icon" class="data-v-cda3a350 data-v-cda3a350">
                  <view class="flex-c icon--flex-c data-v-f0c409e8 icon--data-v-f0c409e8">
                    <text class="me-icon icon--me-icon data-v-f0c409e8 icon--data-v-f0c409e8 icon-arrow-up-line icon--icon-arrow-up-line sk-pseudo sk-pseudo-circle" style="color: #FFFFFF; font-size: 20px; line-height: 20px;"></text>
                  </view>
                </view>
                <text class="data-v-cda3a350 sk-transparent sk-text-14-2857-25 sk-text">上报异常</text>
              </view>
            </view>
          </view>
        </view>
        <view class="order-item order-item data-v-cda3a350 data-v-cda3a350">
          <view class="top top flex-sb flex-sb data-v-cda3a350 data-v-cda3a350">
            <view class="type flex-l data-v-cda3a350 sk-transparent sk-text-14-2857-977 sk-text">乳胶漆</view>
            <view class="price flex-r important-color data-v-cda3a350 sk-transparent sk-text-14-2857-990 sk-text"></view>
          </view>
          <view class="content content flex-sb flex-sb data-v-cda3a350 data-v-cda3a350">
            <view class="left left data-v-cda3a350 data-v-cda3a350">
              <view class="address-name flex-l data-v-cda3a350 sk-transparent sk-text-15-9091-41 sk-text">222</view>
              <view class="address data-v-cda3a350 sk-transparent sk-text-18-1818-14 sk-text">四川省成都市双流区</view>
              <view class="time-ctr time-ctr flex-l flex-l data-v-cda3a350 data-v-cda3a350">
                <view is="components/me-icon/me-icon" class="data-v-cda3a350 data-v-cda3a350">
                  <view class="flex-c icon--flex-c data-v-f0c409e8 icon--data-v-f0c409e8">
                    <text class="me-icon icon--me-icon data-v-f0c409e8 icon--data-v-f0c409e8 icon-time icon--icon-time sk-pseudo sk-pseudo-circle" style="color: var(--themeColor); font-size: 20px; line-height: 20px;"></text>
                  </view>
                </view>
                <text class="time data-v-cda3a350 sk-transparent sk-text-18-1818-755 sk-text">周一 25年3月31日 11:33</text>
              </view>
            </view>
            <view class="right right data-v-cda3a350 data-v-cda3a350">
              <view class="icon-ctr icon-ctr flex-c flex-c data-v-cda3a350 data-v-cda3a350">
                <view is="components/me-icon/me-icon" class="data-v-cda3a350 data-v-cda3a350">
                  <view class="flex-c icon--flex-c data-v-f0c409e8 icon--data-v-f0c409e8">
                    <text class="me-icon icon--me-icon data-v-f0c409e8 icon--data-v-f0c409e8 icon-navigation icon--icon-navigation sk-pseudo sk-pseudo-circle" style="color: var(--descriptionColor); font-size: 30px; line-height: 30px;"></text>
                  </view>
                </view>
              </view>
              <view class="distance flex-c data-v-cda3a350 sk-transparent sk-text-18-1818-111 sk-text">未知距离</view>
            </view>
          </view>
          <view class="user user flex-sb flex-sb data-v-cda3a350 data-v-cda3a350">
            <view class="left left data-v-cda3a350 data-v-cda3a350">
              <view class="user-name user-name flex-l flex-l data-v-cda3a350 data-v-cda3a350">
                <view is="components/me-icon/me-icon" class="data-v-cda3a350 data-v-cda3a350">
                  <view class="flex-c icon--flex-c data-v-f0c409e8 icon--data-v-f0c409e8">
                    <text class="me-icon icon--me-icon data-v-f0c409e8 icon--data-v-f0c409e8 icon-user icon--icon-user sk-pseudo sk-pseudo-circle" style="color: var(--descriptionColor); font-size: 18px; line-height: 18px;"></text>
                  </view>
                </view>
                <view class="name data-v-cda3a350 sk-transparent sk-text-0-0000-613 sk-text">wwww</view>
              </view>
              <view class="phone flex-l data-v-cda3a350 sk-transparent sk-text-0-0000-533 sk-text">11111</view>
            </view>
            <view class="right right flex-c flex-c data-v-cda3a350 data-v-cda3a350">
              <view class="icon-ctr icon-ctr flex-c flex-c data-v-cda3a350 data-v-cda3a350" hover-class="auto-mask-layer-radius8" hover-stay-time="100">
                <view is="components/me-icon/me-icon" class="data-v-cda3a350 data-v-cda3a350">
                  <view class="flex-c icon--flex-c data-v-f0c409e8 icon--data-v-f0c409e8">
                    <text class="me-icon icon--me-icon data-v-f0c409e8 icon--data-v-f0c409e8 icon-call icon--icon-call sk-pseudo sk-pseudo-circle" style="color: var(--themeColor); font-size: 40px; line-height: 40px;"></text>
                  </view>
                </view>
              </view>
            </view>
          </view>
          <view class="operate-ctr operate-ctr flex-sb flex-sb data-v-cda3a350 data-v-cda3a350">
            <view class="status-ctr status-ctr flex-l flex-l data-v-cda3a350 data-v-cda3a350">
              <view is="components/me-icon/me-icon" class="data-v-cda3a350 data-v-cda3a350">
                <view class="flex-c icon--flex-c data-v-f0c409e8 icon--data-v-f0c409e8">
                  <text class="me-icon icon--me-icon data-v-f0c409e8 icon--data-v-f0c409e8 icon-progress-2-line icon--icon-progress-2-line sk-pseudo sk-pseudo-circle" style="color: #E18F00; font-size: 20px; line-height: 20px;"></text>
                </view>
              </view>
              <text class="text data-v-cda3a350 sk-transparent sk-text-14-2857-371 sk-text">待联系客户</text>
            </view>
            <view class="operate operate flex-r flex-r data-v-cda3a350 data-v-cda3a350">
              <view class="btn btn flex-c flex-c data-v-cda3a350 data-v-cda3a350" hover-class="auto-mask-layer-radius8" hover-start-time="0" hover-stay-time="50">
                <view is="components/me-icon/me-icon" class="data-v-cda3a350 data-v-cda3a350">
                  <view class="flex-c icon--flex-c data-v-f0c409e8 icon--data-v-f0c409e8">
                    <text class="me-icon icon--me-icon data-v-f0c409e8 icon--data-v-f0c409e8 icon-arrow-up-line icon--icon-arrow-up-line sk-pseudo sk-pseudo-circle" style="color: #FFFFFF; font-size: 20px; line-height: 20px;"></text>
                  </view>
                </view>
                <text class="data-v-cda3a350 sk-transparent sk-text-14-2857-25 sk-text">上报异常</text>
              </view>
            </view>
          </view>
        </view>
        <view class="order-item order-item data-v-cda3a350 data-v-cda3a350"></view>
      </view>
    </view>
  </view>
</template>

<style lang="scss" scoped>
.ctr {
  padding: 0 32rpx;
  box-sizing: border-box;
  .fixed-top {
    position: fixed;
    top: 0;
    background-color: var(--pageBgColor);
    width: 686rpx;
    .filter {
      width: 686rpx;
      height: 100rpx;
      .filter-item {
        width: 170rpx;
        height: 100%;
        position: relative;
        .title {
          width: 120rpx;
          font-size: 28rpx;
          color: var(--summaryColor);
          line-height: 40rpx;
        }
        .title-active {
          color: var(--themeColor) !important;
        }
        .select-style {
          position: absolute;
          bottom: 0;
          width: 122rpx;
          height: 4rpx;
          background: var(--themeColor);
          border-radius: 2rpx;
        }
      }
    }
  }
  .order-item .operate-ctr .operate .btn {
    background-color: #EEEEEE;
  }
}
</style>

<style>
.sk-transparent {
  color: transparent !important;
}
.sk-text-14-2857-32 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 44.8000rpx;
  position: relative !important;
}
.sk-text {
  background-origin: content-box !important;
  background-clip: content-box !important;
  background-color: transparent !important;
  color: transparent !important;
  background-repeat: repeat-y !important;
}
.sk-text-0-0000-179 {
  background-image: linear-gradient(transparent 0.0000%, #EEEEEE 0%, #EEEEEE 100.0000%, transparent 0%) !important;
  background-size: 100% 28.0000rpx;
  position: relative !important;
}
.sk-text-0-0000-567 {
  background-image: linear-gradient(transparent 0.0000%, #EEEEEE 0%, #EEEEEE 100.0000%, transparent 0%) !important;
  background-size: 100% 28.0000rpx;
  position: relative !important;
}
.sk-text-0-0000-602 {
  background-image: linear-gradient(transparent 0.0000%, #EEEEEE 0%, #EEEEEE 100.0000%, transparent 0%) !important;
  background-size: 100% 28.0000rpx;
  position: relative !important;
}
.sk-text-14-2857-977 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  position: relative !important;
}
.sk-text-14-2857-990 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  position: relative !important;
}
.sk-text-15-9091-41 {
  background-image: linear-gradient(transparent 15.9091%, #EEEEEE 0%, #EEEEEE 84.0909%, transparent 0%) !important;
  position: relative !important;
}
.sk-text-18-1818-14 {
  background-image: linear-gradient(transparent 18.1818%, #EEEEEE 0%, #EEEEEE 81.8182%, transparent 0%) !important;
  position: relative !important;
}
.sk-text-18-1818-755 {
  background-image: linear-gradient(transparent 18.1818%, #EEEEEE 0%, #EEEEEE 81.8182%, transparent 0%) !important;
  position: relative !important;
}
.sk-text-18-1818-111 {
  background-image: linear-gradient(transparent 18.1818%, #EEEEEE 0%, #EEEEEE 81.8182%, transparent 0%) !important;
  position: relative !important;
}
.sk-text-0-0000-613 {
  background-image: linear-gradient(transparent 0.0000%, #EEEEEE 0%, #EEEEEE 100.0000%, transparent 0%) !important;
  background-size: 100% 28.0000rpx;
  position: relative !important;
}
.sk-text-0-0000-533 {
  background-image: linear-gradient(transparent 0.0000%, #EEEEEE 0%, #EEEEEE 100.0000%, transparent 0%) !important;
  background-size: 100% 28.0000rpx;
  position: relative !important;
}
.sk-text-14-2857-371 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  position: relative !important;
}
.sk-text-14-2857-25 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 39.2000rpx;
  position: relative !important;
}
.sk-image {
  background: #EFEFEF !important;
}
.sk-pseudo::before, .sk-pseudo::after {
  background: #EFEFEF none !important;
  color: transparent !important;
  border-color: transparent !important;
}
.sk-pseudo-circle::before, .sk-pseudo-circle::after {
  border-radius: 50% !important;
}
.sk-container {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: transparent;
}
</style>
<script setup lang="ts">
</script>