diff --git a/src/mods/AppMyPlan/progressDetail.vue b/src/mods/AppMyPlan/progressDetail.vue index 223a0a3..a451e90 100644 --- a/src/mods/AppMyPlan/progressDetail.vue +++ b/src/mods/AppMyPlan/progressDetail.vue @@ -78,60 +78,72 @@
-
- - {{ item.userName.substr(item.userName.length - 2) }} - - - {{ item.candidates[0].name.substr(item.candidates[0].name - 2) }} - - -
-
-
-

{{ item.title }}

- {{ item.approvalTime }} + +
+
+ + {{ item.userName.substr(item.userName.length - 2) }} + + + {{ item.candidates[0].name.substr(item.candidates[0].name - 2) }} + +
-
- {{ item.userName || '-' }} - ({{ stepTypeList[item.stepType] }}) -
-
- {{ item.title2 }} - {{ item.title2Desc }} -
-
- + +
+
+

{{ item.title }}

+ {{ item.approvalTime }} +
+
+ {{ item.userName || '-' }} + ({{ stepTypeList[item.stepType] }}) +
+
{{ item.title2 }} - - - {{ item.title2Desc }} -
-
- 审批意见: - {{ item.opinion || '-' }} -
-
- {{ candidateField.fieldName }} - {{ candidateField.dictionaryCode ? $dict.getLabel(candidateField.dictionaryCode, candidateField.fieldValue) || '-' : candidateField.fieldValue || '-' }} -
-
- -
-
-
-

{{ file.name }}

- {{ (file.size / 1024).toFixed(2) }}KB + {{ item.title2Desc }}
-
-
-
- - {{ user.name.substr(user.name.length - 2) }} -

{{ user.name }}

+
+ + {{ item.title2 }} + + + {{ item.title2Desc }} +
+ +
+ 审批意见: + {{ item.opinion }} +
+ +
+ {{ item.opinion }} +
+ +
+ {{ candidateField.fieldName }} + {{ candidateField.dictionaryCode ? $dict.getLabel(candidateField.dictionaryCode, candidateField.fieldValue) || '-' : candidateField.fieldValue || '-' }} +
+
+ +
+
+
+

{{ file.name }}

+ {{ (file.size / 1024).toFixed(2) }}KB +
+
+
+
+ + {{ user.name.substr(user.name.length - 2) }} +

{{ user.name }}

+
+ +
@@ -332,190 +344,210 @@ view { } .step-item { - display: flex; - position: relative; padding-bottom: 88px; + position: relative; + .step-items { + display: flex; - &:last-child { - padding-bottom: 0; + &:last-child { + padding-bottom: 0; - .line { - display: none; + .line { + display: none; + } } - } - .detail-right__doc { - padding-top: 8px; + .detail-right__doc { + padding-top: 8px; - .doc-item { - display: flex; - align-items: center; - justify-content: space-between; - margin-bottom: 16px; - padding: 16px; - background: #f7f7f7; - border-radius: 4px; - border: 1px solid #dddddd; - - &:last-child { + .doc-item { + display: flex; + align-items: center; + justify-content: space-between; margin-bottom: 16px; - } + padding: 16px; + background: #f7f7f7; + border-radius: 4px; + border: 1px solid #dddddd; - span { - color: #999999; - font-size: 24px; - } + &:last-child { + margin-bottom: 16px; + } - h2 { - max-width: 444px; - line-height: 32px; - color: #333333; - font-size: 24px; - word-break: break-all; - } - } - } - - .detail-right { - flex: 1; - - .detail-right__title { - display: flex; - justify-content: space-between; - margin-bottom: 6px; - - span { - color: #999999; - font-size: 28px; - } - - & > h2 { - color: #333333; - font-size: 32px; - font-weight: 600; - } - } - - .detail-right__userlist { - margin-top: 16px; - font-size: 0; - - .detail-right__userinfo { - display: inline-block; - margin-right: 32px; - margin-bottom: 32px; - text-align: center; - - image, span { - display: inline-block; - width: 64px; - height: 64px; - line-height: 64px; - border-radius: 50%; - margin-bottom: 8px; - text-align: center; - color: #ffffff; - font-size: 26px; - border-radius: 50%; - background: #2266ff; + color: #999999; + font-size: 24px; } h2 { - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - color: #666666; + max-width: 444px; + line-height: 32px; + color: #333333; font-size: 24px; + word-break: break-all; } } } - .detail-right__subtitle { - display: flex; - margin-bottom: 6px span { - margin-right: 10px; - color: #666666; - font-size: 28px; + .detail-right { + flex: 1; + + .detail-right__title { + display: flex; + justify-content: space-between; + margin-bottom: 6px; + + span { + color: #999999; + font-size: 28px; + } + + & > h2 { + color: #333333; + font-size: 32px; + font-weight: 600; + } } - i { - flex: 1; - text-align: justify; - word-break: break-all; - color: #2ea222; - font-size: 28px; + .detail-right__userlist { + margin-top: 16px; + font-size: 0; + + .detail-right__userinfo { + display: inline-block; + margin-right: 32px; + margin-bottom: 32px; + text-align: center; + + image, + span { + display: inline-block; + width: 64px; + height: 64px; + line-height: 64px; + border-radius: 50%; + margin-bottom: 8px; + text-align: center; + color: #ffffff; + font-size: 26px; + border-radius: 50%; + background: #2266ff; + } + + h2 { + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + color: #666666; + font-size: 24px; + } + } + } + + .detail-right__subtitle { + display: flex; + margin-bottom: 6px span { + margin-right: 10px; + color: #666666; + font-size: 28px; + } + + i { + flex: 1; + text-align: justify; + word-break: break-all; + color: #2ea222; + font-size: 28px; + } + } + + .detail-right__text { + // color: #343D65; + // font-size: 28px; + // margin: 6px 0; + } + + .detail-right__imgs { + font-size: 0; + + image { + display: inline-block; + width: 136px; + height: 136px; + margin-right: 8px; + margin-bottom: 8px; + margin-top: 8px; + border-radius: 4px; + } } } - .detail-right__text { - // color: #343D65; - // font-size: 28px; - // margin: 6px 0; - } - - .detail-right__imgs { - font-size: 0; - - image { - display: inline-block; - width: 136px; - height: 136px; - margin-right: 8px; - margin-bottom: 8px; - margin-top: 8px; - border-radius: 4px; - } - } - } - - .line { - position: absolute; - left: 38px; - top: 80px; - width: 4px; - height: 100%; - background: #eeeeee; - } - - .detail-left { - display: flex; - align-items: center; - justify-content: center; - position: relative; - width: 80px; - height: 80px; - margin-right: 40px; - flex-shrink: 1; - border-radius: 50%; - background: #2266ff; - - .detail-left__statusicon { - width: 48px; - height: 48px; - } - - .detail-left__icon { + .line { position: absolute; - top: 48px; - right: -4px; - width: 36px; - height: 36px; + left: 38px; + top: 80px; + width: 4px; + height: 100%; + background: #eeeeee; } - span, - .avatar { - display: block; + .detail-left { + display: flex; + align-items: center; + justify-content: center; + position: relative; width: 80px; height: 80px; - line-height: 80px; - color: #fff; - font-size: 28px; - text-align: center; + margin-right: 40px; + flex-shrink: 1; border-radius: 50%; background: #2266ff; + + .detail-left__statusicon { + width: 48px; + height: 48px; + } + + .detail-left__icon { + position: absolute; + top: 48px; + right: -4px; + width: 36px; + height: 36px; + } + + span, + .avatar { + display: block; + width: 80px; + height: 80px; + line-height: 80px; + color: #fff; + font-size: 28px; + text-align: center; + border-radius: 50%; + background: #2266ff; + z-index: 999; + } } } + .line { + position: absolute; + height: 100%; + width: 1px; + left: 40px; + background: #eee; + } + .opinions { + padding-top: 10px; + margin-left: 120px; + line-height: 46px; + } +} +.step-item:last-child { + .line { + background: none; + } } .status {