上传文件至 'src/pages/meetingRoom/components'

src/pages/meetingRoom/components/meetingItem.vue

@@ -0,0 +1,246 @@
+<template>
+  <div class="item-content" @click.stop="onClickData">
+    <div class="item-title">
+      <span class="text-color-title item-address">流水号:{{ item.lsh }}</span>
+      <span class="text-color-description" :style="{ color: generateColor() }">{{ generateState() }}</span>
+    </div>
+    <!-- <div class="text-color-title item-description">
+      {{ item.constructionContent }}
+    </div>-->
+    <div class="text-color-description">预订人：{{ item.ydr }}</div>
+    <div class="text-color-description">预定时间：{{ item.ydsj }}</div>
+    <div class="text-color-description">增值服务：{{ item.zzfw }}</div>
+    <div class="text-color-description">跟进事项：{{ item.gjsx }}</div>
+    <div class="btn-group">
+      <van-button
+        type="primary"
+        plain
+        :color="data.color"
+        v-for="(data, index) in item.operate"
+        :key="index"
+        @click.stop="onClickItem(data)"
+      >{{ data.name }}</van-button>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "meetingItem",
+  props: {
+    item: {
+      type: Object
+    }
+  },
+  data() {
+    return {
+      color: "#ff4433"
+    };
+  },
+  created() {
+    this.processData();
+  },
+  methods: {
+    processData() {
+      if (this.item.operate) {
+        this.item.operate.findIndex((res, index) => {
+          if (this.item.decorationState != 3 && res.name === "复验") {
+            this.item.operate.splice(index);
+          }
+        });
+      }
+    },
+    generateState() {
+      //"decorationState": "0",//0-未开始，1-装修中，2-待整改，3-已初验，4-已复验5-没审核
+      switch (this.item.examineState + "") {
+        case "0":
+          return "待审核";
+          break;
+        case "1":
+          switch (this.item.decorationState + "") {
+            case "0":
+              return "未开始";
+              break;
+            case "1":
+              return "装修中";
+              break;
+            case "2":
+              return "待整改";
+              break;
+            case "3":
+              return "已初验";
+              break;
+            case "4":
+              return "已复验";
+              break;
+          }
+          break;
+        case "2":
+          return "驳回";
+          break;
+      }
+    },
+    generateColor() {
+      //"decorationState": "0",//0-未开始，1-装修中，2-待整改，3-已初验，4-已复验5-没审核
+      switch (this.item.examineState + "") {
+        case "0":
+          return "#999";
+          break;
+        case "1":
+          switch (this.item.decorationState + "") {
+            case "0":
+              return "#999";
+              break;
+            case "1":
+              return "#57a2fe";
+              break;
+            case "2":
+              return "#fba908";
+              break;
+            case "3":
+              return "#57a2fe";
+              break;
+            case "4":
+              return "#57a2fe";
+              break;
+          }
+          break;
+        case "2":
+          return "#fc4e50";
+          break;
+      }
+    },
+
+    onClickData() {
+      this.$router.push({
+        path: "breakRulesInfoDetail",
+        query: {
+          decorationId: this.item.decorationId,
+          operate: this.item.operate
+        }
+      });
+    },
+
+    onClickItem(data) {
+      switch (data.name) {
+        case "驳回":
+          this.$router.push({
+            path: "decorateOperate",
+            query: {
+              type: 0,
+              decorationId: this.item.decorationId
+            }
+          });
+          break;
+        case "通过":
+          this.$router.push({
+            path: "decorateOperate",
+            query: {
+              type: 1,
+              decorationId: this.item.decorationId
+            }
+          });
+          break;
+        // case "新增违规":
+        //   this.$router.push({
+        //     path: "decorateOperate",
+        //     query: {
+        //       type: 2,
+        //       decorationId: this.item.decorationId
+        //     }
+        //   });
+        //   break;
+        case "违规列表":
+          this.$router.push({
+            path: "breakRulesList",
+            query: {
+              decorationId: this.item.decorationId
+            }
+          });
+          break;
+        case "整改复查":
+          this.$router.push({
+            path: "breakRulesListCheck",
+            query: {
+              decorationId: this.item.decorationId
+            }
+          });
+          break;
+        case "初验":
+          this.$router.push({
+            path: "decorateOperate",
+
+            query: {
+              type: 3,
+              decorationId: this.item.decorationId
+            }
+          });
+          break;
+        case "复验":
+          this.$router.push({
+            path: "decorateOperate",
+            query: {
+              type: 4,
+              decorationId: this.item.decorationId
+            }
+          });
+          break;
+      }
+    }
+  }
+};
+</script>
+
+<style scoped lang="less">
+.item-content {
+  display: flex;
+  flex-direction: column;
+  background-color: white;
+  font-size: 13px;
+  border-radius: 5px;
+  margin-bottom: 10px;
+  padding: 15px 20px 10px 20px;
+}
+
+.item-title {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  padding-bottom: 9px;
+}
+
+.item-address {
+  font-size: 15px !important;
+  font-weight: bold;
+}
+
+.item-description {
+  margin-bottom: 5px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.text-color-title {
+  color: #333;
+}
+
+.text-color-description {
+  color: #999;
+}
+
+.btn-group {
+  display: flex;
+  justify-content: flex-end;
+  margin-top: 8px;
+}
+
+.btn-group button {
+  border-radius: 3px;
+  min-width: 65px;
+  height: 28px;
+  line-height: 28px;
+  font-size: 12px !important;
+  margin-left: 5px;
+}
+</style>