From 27f8409e125c92eb94c8a6ede721d8f52bea98c4 Mon Sep 17 00:00:00 2001
From: jiangyy <jiang478938504@126.com>
Date: Thu, 28 Jul 2022 13:32:51 +0800
Subject: [PATCH] 111

---
 .../scss/modules/shequzhili/event-info.scss   |  38 +-
 .../scss/modules/shequzhili/project-info.scss |  54 +-
 .../communityService/measure/info copy.vue    | 923 ++++++++++++++++++
 .../modules/communityService/measure/info.vue | 697 +++++++------
 .../shequzhili/event/cpts/event-info.vue      |   2 +-
 .../event/cpts/process-form-demand.vue        |  24 +-
 .../event/cpts/process-form-project.vue       |  25 +-
 .../event/cpts/process-form-replay.vue        |  19 +-
 .../shequzhili/event/cpts/process-form.vue    |  16 +-
 .../shequzhili/xiangmu/cpts/project-info.vue  |  79 +-
 .../communityGovern/fivelayers/eventInfo.vue  |   2 +-
 11 files changed, 1432 insertions(+), 447 deletions(-)
 create mode 100644 src/views/modules/communityService/measure/info copy.vue

diff --git a/src/assets/scss/modules/shequzhili/event-info.scss b/src/assets/scss/modules/shequzhili/event-info.scss
index ab7d291d3..afcd0fa34 100644
--- a/src/assets/scss/modules/shequzhili/event-info.scss
+++ b/src/assets/scss/modules/shequzhili/event-info.scss
@@ -91,21 +91,21 @@
     }
     .g-left {
         box-sizing: border-box;
-        width: 65%;
+        width: 55%;
         padding: 5px 10px;
     }
     .g-right {
         box-sizing: border-box;
-        width: 35%;
+        width: 45%;
         padding: 5px 10px;
     }
 }
 
-.g-process-info{
-  .cell-width-area{
-    width: 450px
-  }
+
+.cell-width-area{
+  width: 450px
 }
+
 .div_map {
   position: relative;
 }
@@ -156,6 +156,20 @@
 
 .process-form{
   margin-top:20px;
+
+  .process-title {
+    margin-bottom: 25px;
+    margin-left: -5px;
+    font-size: 16px;
+    font-family: PingFang SC;
+    font-weight: bold;
+    color: #333;
+    line-height: 18px;
+  }
+
+  .process-title-vis{
+    color: #fff;
+  } 
 }
 
 .m-card {
@@ -302,7 +316,7 @@
 .m-process {
     margin-top: 30px;
     margin-left: 15px;
-    // min-width: 400px;
+    width: 400px;
 
     .process-title {
         margin-bottom: 25px;
@@ -488,15 +502,15 @@
   
 }
 
+.form-item::v-deep .el-form-item__label {
+  color: #fff;
+}
 .form-item {
-  .el-form-item__label{
-    color: #fff;
-  }
-  .el-radio{
+  .el-radio {
     color: #fff;
   }
 
-  .el-checkbox{
+  .el-checkbox {
     color: #fff;
   }
 }
diff --git a/src/assets/scss/modules/shequzhili/project-info.scss b/src/assets/scss/modules/shequzhili/project-info.scss
index f92a2d429..fab73c410 100644
--- a/src/assets/scss/modules/shequzhili/project-info.scss
+++ b/src/assets/scss/modules/shequzhili/project-info.scss
@@ -5,12 +5,12 @@
     display: flex;
     .g-left {
         box-sizing: border-box;
-        width: 65%;
+        width: 55%;
         padding: 5px 10px;
     }
     .g-right {
         box-sizing: border-box;
-        width: 35%;
+        width: 45%;
         padding: 5px 10px;
     }
 }
@@ -64,10 +64,41 @@
 }
 
 .m-btns {
-    display: flex;
-    justify-content: center;
+  margin-top:50px;
+  display: flex;
+  justify-content: center;
+
+  .item_btn {
+    font-size: 14px;
+    padding: 8px 16px;
+    cursor: pointer;
+    color:#fff;
+
+    border: 1px dashed #0c81fe;
+    border-radius: 6px;
+    background-color: #0c81fe;
+  }
+
+  .mgl {
+    margin-left: 20px;
+  }
+}
+
+.one-btn {
+  width:58px;
+  height:30px;
+  color: #fff;
+  font-size: 12px;
+  text-align: center;
+  line-height: 30px;
+  cursor: pointer;
+
+  border: 1px dashed #0c81fe;
+  border-radius: 6px;
+  background-color: #0c81fe;
 }
 
+
 .m-info {
     padding-left: 10px;
     font-size: 14px;
@@ -133,6 +164,10 @@
             margin-right: 10px;
         }
     }
+
+    .info-prop-vis{
+      color:#fff;
+    }
 }
 
 .m-case {
@@ -223,7 +258,7 @@
 .m-process {
     margin-top: 30px;
     margin-left: 15px;
-    // min-width: 400px;
+    width: 400px;
 
     .process-title {
         margin-bottom: 25px;
@@ -374,3 +409,12 @@
 .m-chart {
     min-height: 200px;
 }
+
+.box-card{
+  padding: 0px;
+  border: 0px solid #EBEEF5;
+  background-color:transparent;
+  -webkit-box-shadow:none;
+  box-shadow:none
+  
+}
diff --git a/src/views/modules/communityService/measure/info copy.vue b/src/views/modules/communityService/measure/info copy.vue
new file mode 100644
index 000000000..5d84e0cde
--- /dev/null
+++ b/src/views/modules/communityService/measure/info copy.vue	
@@ -0,0 +1,923 @@
+<template>
+  <el-dialog title="需求信息"
+             width="50%"
+             top="5vh"
+             append-to-body
+             class="dialog-h"
+             :visible="true"
+             :close-on-click-modal="false"
+             :before-close="handlerClose">
+    <el-form label-width="120px"
+             :model="form"
+             :rules="rules"
+             ref="ruleForm"
+             class="form-wr dialog-h-content scroll-h">
+      <el-form-item label="操作方式"
+                    prop="addType">
+        <el-radio-group v-model="addType">
+          <el-radio label="look">查看</el-radio>
+          <template v-if="form.reportType != 'self_help'">
+            <el-radio label="edit"
+                      v-if="form.status === 'pending'">修改</el-radio>
+            <el-radio label="cancel"
+                      v-if="form.status !== 'finished' && form.status !== 'canceled'">取消</el-radio>
+          </template>
+          <el-radio label="appoint"
+                    v-if="form.status === 'pending' || form.status === 'assigned'">指派</el-radio>
+          <!-- <el-radio label="finish"
+                    v-if="
+              (form.reportType == 'self_help' &&
+                form.serviceShowFlag &&
+                form.serviceType !== 'volunteer' &&
+                form.status !== 'finished') ||
+              form.status === 'assigned' ||
+              form.status === 'have_order' ||
+              (form.status == 'finished' && !form.evaluateFlag)
+            ">完成</el-radio> -->
+          <el-radio label="finish"
+                    v-if="
+              (form.reportType == 'self_help' &&
+                form.serviceShowFlag &&
+                form.serviceType !== 'volunteer' &&
+                form.status !== 'finished') ||
+              form.status === 'assigned' ||
+              form.status === 'have_order' 
+            ">完成</el-radio>
+        </el-radio-group>
+      </el-form-item>
+
+      <el-form-item label="所属网格"
+                    prop="gridId">
+        <el-input v-if="disabled"
+                  v-model="form.gridName"
+                  :disabled="disabled"
+                  class="input-width"></el-input>
+        <!-- <span >{{ form.gridName }}</span> -->
+        <el-select v-else
+                   v-model="form.gridId"
+                   filterable
+                   placeholder="请选择"
+                   class="input-width"
+                   clearable
+                   :disabled="disabled"
+                   @change="handleGridChange">
+          <el-option v-for="item in disabled ? optionsG : optionsEditG"
+                     :key="item.value"
+                     :label="item.label"
+                     :value="item.value">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="需求类型"
+                    prop="categoryCode">
+        <el-input v-if="disabled"
+                  v-model="form.categoryName"
+                  :disabled="disabled"
+                  class="input-width"
+                  clearable></el-input>
+        <el-cascader v-else
+                     v-model="form.categoryCodeArr"
+                     :options="demandOptions"
+                     :disabled="disabled"
+                     clearable
+                     class="input-width"
+                     @change="handleCateSlect"></el-cascader>
+      </el-form-item>
+      <el-form-item label="上报类型"
+                    prop="reportType">
+        <el-input v-if="disabled"
+                  v-model="form.reportTypeName"
+                  :disabled="disabled"
+                  class="input-width"></el-input>
+        <el-select v-else
+                   v-model="form.reportType"
+                   filterable
+                   class="input-width"
+                   placeholder="请选择"
+                   clearable
+                   :disabled="disabled">
+          <el-option v-for="item in reportOptions"
+                     :key="item.value"
+                     :label="item.label"
+                     :value="item.value">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="上报人"
+                    prop="reportUserName">
+        <el-input v-model="form.reportUserName"
+                  :disabled="disabled"
+                  placeholder="请输入"
+                  class="input-width"
+                  clearable></el-input>
+      </el-form-item>
+      <el-form-item label="上报人手机号"
+                    prop="reportUserMobile">
+        <el-input v-model="form.reportUserMobile"
+                  :disabled="disabled"
+                  placeholder="请输入"
+                  class="input-width"
+                  maxlength="11"
+                  clearable></el-input>
+      </el-form-item>
+      <el-form-item label="上报时间"
+                    prop="reportTime">
+        <el-date-picker v-model="form.reportTime"
+                        type="datetime"
+                        class="input-width"
+                        clearable
+                        :disabled="disabled"
+                        value-format="yyyy-MM-dd HH:mm:ss"
+                        placeholder="选择日期时间">
+        </el-date-picker>
+      </el-form-item>
+      <el-form-item label="需求人"
+                    prop="demandUserId">
+        <el-input v-if="disabled"
+                  v-model="form.demandUserName"
+                  :disabled="disabled"
+                  class="input-width"></el-input>
+        <el-select v-else
+                   v-model="selectDemandUser"
+                   class="input-width"
+                   filterable
+                   :disabled="disabled"
+                   placeholder="请选择"
+                   clearable
+                   @change="handleDemandChange">
+          <el-option v-for="item in demandUserList"
+                     :key="item.demandUserId"
+                     :label="item.label"
+                     :value="item">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="服务时间"
+                    prop="wantServiceTime">
+        <el-date-picker v-model="form.wantServiceTime"
+                        type="datetime"
+                        class="input-width"
+                        clearable
+                        :disabled="disabled"
+                        value-format="yyyy-MM-dd HH:mm:ss"
+                        placeholder="选择日期时间">
+        </el-date-picker>
+      </el-form-item>
+      <el-form-item label="需求内容"
+                    prop="content">
+        <el-input v-model="form.content"
+                  :autosize="{ minRows: 2, maxRows: 10 }"
+                  :disabled="disabled"
+                  type="textarea"
+                  clearable
+                  class="input-width-textarea"
+                  placeholder="请输入内容"></el-input>
+      </el-form-item>
+      <el-form-item v-if="
+          addType === 'appoint' ||
+          addType == 'finish' ||
+          (addType == 'look' && form.serviceShowFlag)
+        "
+                    label="服务方"
+                    prop="serviceType">
+        <template v-if="disabled && addType !== 'appoint'">
+          <el-input v-model="form.serviceShowName"
+                    :disabled="disabled"
+                    class="input-width"></el-input>
+        </template>
+        <template v-else>
+          <el-select v-model="form.serviceType"
+                     class="input-width-small"
+                     placeholder="请选择"
+                     clearable
+                     :disabled="disabled && addType !== 'appoint'"
+                     @change="handleServiceChange('add', $event)">
+            <el-option v-for="item in serviceOptions"
+                       :key="item.value"
+                       :label="item.label"
+                       :value="item.value">
+            </el-option>
+          </el-select>
+          -
+          <el-select v-model="form.serverId"
+                     class="input-width-middle"
+                     filterable
+                     placeholder="请选择"
+                     clearable
+                     :disabled="disabled && addType !== 'appoint'">
+            <el-option v-for="item in serviceOptiondList"
+                       :key="item.value"
+                       :label="item.label"
+                       :value="item.value">
+            </el-option>
+          </el-select>
+        </template>
+      </el-form-item>
+      <el-form-item v-if="addType == 'look' && form.status == 'canceled'"
+                    label="取消时间"
+                    prop="cancelTime">
+        <span>{{ form.cancelTime }}</span>
+      </el-form-item>
+      <template v-if="
+          (addType == 'finish' && form.reportType != 'self_help') ||
+          (addType == 'look' && form.status == 'finished')
+        ">
+        <el-form-item label="实际服务时间"
+                      prop="serviceStartTime">
+          <el-date-picker v-model="finishServiceTime"
+                          class="input-width-min"
+                          clearable
+                          :disabled="disabled && addType != 'finish'"
+                          type="datetimerange"
+                          range-separator="至"
+                          start-placeholder="开始日期"
+                          end-placeholder="结束日期"
+                          value-format="yyyy-MM-dd HH:mm:ss"
+                          @change="handelBlurServiceTime">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="完成情况"
+                      prop="finishResult">
+          <el-radio v-model="form.finishResult"
+                    label="resolved"
+                    :disabled="disabled && addType != 'finish'">已解决</el-radio>
+          <el-radio v-model="form.finishResult"
+                    label="unresolved"
+                    :disabled="disabled && addType != 'finish'">未解决</el-radio>
+        </el-form-item>
+        <el-form-item label="评价"
+                      prop="score"
+                      class="form-score">
+          <el-rate v-model="form.score"
+                   :allow-half="true"
+                   :disabled="disabled && addType != 'finish'"></el-rate>
+        </el-form-item>
+        <el-form-item label="备注"
+                      prop="finishDesc">
+          <el-input v-model="form.finishDesc"
+                    :autosize="{ minRows: 2, maxRows: 10 }"
+                    :disabled="disabled && addType != 'finish'"
+                    type="textarea"
+                    clearable
+                    class="input-width-textarea"
+                    placeholder="请输入内容"></el-input>
+        </el-form-item>
+      </template>
+      <template v-if="addType == 'finish' && form.reportType == 'self_help'">
+        <el-form-item label="实际服务时间"
+                      prop="serviceStartTime">
+          <el-date-picker v-model="finishServiceTime"
+                          class="input-width-min"
+                          clearable
+                          :disabled="disabled && addType != 'finish'"
+                          type="datetimerange"
+                          range-separator="至"
+                          start-placeholder="开始日期"
+                          end-placeholder="结束日期"
+                          value-format="yyyy-MM-dd HH:mm:ss"
+                          @change="handelBlurServiceTime">
+          </el-date-picker>
+        </el-form-item>
+      </template>
+    </el-form>
+    <div class="resi-btns">
+      <el-button size="small"
+                 @click="handlerClose">关闭</el-button>
+      <el-button v-if="addType != 'look'"
+                 type="primary"
+                 size="small"
+                 :loading="btnLoading"
+                 @click="handleSubmit">提交</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { mapGetters } from "vuex";
+
+export default {
+  props: {
+    demandRecId: {
+      type: String,
+      default: "",
+    },
+    // addType: {
+    //   type: String,
+    //   default: "look",
+    // },
+  },
+
+  data () {
+    return {
+      btnLoading: false,
+      pageLoading: false,
+      addType: 'look',
+      form: {
+        gridId: "",
+        categoryCodeArr: [],
+        categoryCode: "",
+        parentCode: "",
+        content: "",
+        reportType: "",
+        reportUserName: "",
+        reportUserMobile: "",
+        reportTime: "",
+        wantServiceTime: "",
+        demandUserId: "",
+        demandUserName: "",
+        demandUserMobile: "",
+      },
+
+      serviceOptions: [
+        {
+          label: "志愿者",
+          value: "volunteer",
+        },
+        //  {
+        //   label: '社会组织',
+        //   value: 'social_org'
+        // },
+        {
+          label: "社区自组织",
+          value: "community_org",
+        },
+        {
+          label: "区域党建单位",
+          value: "party_unit",
+        },
+      ],
+      serviceOptiondList: [],
+      demandUserList: [],
+      optionsEditG: [],
+      reportOptions: [],
+      demandOptions: [],
+      selectDemandUser: "",
+      finishServiceTime: "",
+
+      options: [
+        {
+          label: "是",
+          value: 1,
+        },
+        {
+          label: "否",
+          value: 2,
+        },
+      ],
+
+      rules: {
+        serviceStartTime: [
+          { required: true, message: "实际服务时间不能为空", trigger: "blur" },
+        ],
+        score: [{ required: true, message: "评分不能为空", trigger: "blur" }],
+        finishResult: [
+          { required: true, message: "完成情况不能为空", trigger: "blur" },
+        ],
+      },
+    };
+  },
+
+  computed: {
+    ...mapGetters(["clientHeight", "iframeHeight"]),
+    disabled () {
+      return this.addType != "edit";
+    },
+  },
+
+  watch: {
+    addType (val) {
+      this.formatRowForm(val);
+    },
+  },
+
+  async created () {
+    this.customerId = localStorage.getItem("customerId");
+
+    this.getInfo();
+
+    this.pageLoading = true;
+  },
+
+  methods: {
+    filterEdit (id) {
+      const { user } = this.$store.state;
+      return id === user.agencyId;
+    },
+    handleCateSlect (val) {
+      console.log("val", val);
+      if (val.length === 1) {
+        this.demandOptions.forEach((item) => {
+          if (item.value == val[0]) this.form.parentCode = item.pvalue;
+        });
+        this.form.categoryCode = val[0];
+      } else {
+        this.form.parentCode = val[0];
+        this.form.categoryCode = val[1];
+      }
+    },
+    handleDemandChange (val) {
+      console.log("val", val, this.selectDemandUser);
+      this.selectDemandUser = val.label;
+      this.form.demandUserName = val.demandUserName;
+      this.form.demandUserMobile = val.demandUserMobile;
+      this.form.demandUserId = val.demandUserId;
+    },
+    handelBlurServiceTime (val) {
+      console.log("val", val);
+      if (val.length > 0) {
+        this.form.serviceStartTime = val[0];
+        this.form.serviceEndTime = val[1];
+      }
+    },
+    handleServiceChange (type, val) {
+      if (val === "social_org") {
+        if (type === "add") this.getServiceuserList(val, "add_demand");
+        else this.getServiceuserList(val, "query_demand");
+      } else this.getServiceuserList(val, "");
+    },
+    handleGridChange (val) {
+      this.getDemandUserList();
+    },
+
+    handelBlurServiceTime (val) {
+      console.log("val", val);
+      if (val.length > 0) {
+        this.form.serviceStartTime = val[0];
+        this.form.serviceEndTime = val[1];
+      }
+    },
+
+    handleServiceChange (type, val) {
+      if (val === "social_org") {
+        if (type === "add") this.getServiceuserList(val, "add_demand");
+        else this.getServiceuserList(val, "query_demand");
+      } else this.getServiceuserList(val, "");
+    },
+
+    handleAdd (addType) {
+      this.addType = addType;
+      this.dialogVisible = true;
+    },
+
+    handlerClose () {
+      this.$emit("close");
+    },
+
+    async formatRowForm (addType) {
+      this.addType = addType;
+      const { form: row } = this;
+
+      if (addType == "look") {
+        this.finishServiceTime =
+          (row.serviceStartTime && [
+            row.serviceStartTime,
+            row.serviceEndTime,
+          ]) ||
+          "";
+      }
+      if (addType == "finish") {
+        if (row.serviceStartTime && row.serviceEndTime) {
+          this.finishServiceTime = [row.serviceStartTime, row.serviceEndTime];
+
+        } else {
+          this.finishServiceTime = []
+        }
+
+
+        this.form.finishResult = "resolved";
+        this.form.score = 5;
+      }
+      if (addType == "appoint" && row.serviceType) {
+        const type = row.serviceType == "social_org" ? "add_demand" : "";
+        await this.getServiceuserList(row.serviceType, type);
+      }
+      if (addType == "edit") {
+        await this.getDemandUserList();
+        this.demandOptions.forEach((item) => {
+          if (item.value === row.categoryCode)
+            this.form.categoryCode = [row.categoryCode];
+        });
+        this.demandUserList.forEach((item) => {
+          if (item.demandUserId == row.demandUserId)
+            this.selectDemandUser = item.label;
+        });
+      }
+
+      this.dialogVisible = true;
+    },
+
+    async appointAjax () {
+      const _form = {
+        demandRecId: this.form.demandRecId,
+        serviceType: this.form.serviceType,
+        serverId: this.form.serverId,
+      };
+      await this.$http
+        .post("/heart/userdemand/assign", _form)
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            return this.$message.error(res.msg);
+          } else {
+            this.handlerClose();
+            this.getInfo();
+            this.$emit("success");
+            return this.$message.success("指派成功");
+          }
+        })
+        .catch(() => {
+          return this.$message.error("网络错误");
+        });
+      this.btnLoading = false;
+    },
+
+    async finishAjax () {
+      const { reportType, serviceShowFlag, serviceType } = this.form;
+      const _form = {
+        demandRecId: this.form.demandRecId,
+        serviceStartTime: this.form.serviceStartTime,
+        serviceEndTime: this.form.serviceEndTime,
+        finishResult: reportType == "self_help" ? "" : this.form.finishResult,
+        finishDesc: reportType == "self_help" ? "" : this.form.finishDesc,
+        serviceId: this.form.serviceId,
+        score: reportType == "self_help" ? 0 : this.form.score,
+      };
+      await this.$http
+        .post("/heart/userdemand/finish", _form)
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            return this.$message.error(res.msg);
+          } else {
+            this.handlerClose();
+            this.getInfo();
+            this.$emit("success");
+            return this.$message.success("操作成功");
+          }
+        })
+        .catch(() => {
+          return this.$message.error("网络错误");
+        });
+      this.btnLoading = false;
+    },
+
+    async editCate () {
+      const categoryCode = this.form.categoryCode;
+      if (Array.isArray(categoryCode)) {
+        if (categoryCode.length === 1) {
+          this.demandOptions.forEach((item) => {
+            if (item.value == categoryCode[0])
+              this.form.parentCode = item.pvalue;
+          });
+          this.form.categoryCode = categoryCode[0];
+        } else {
+          this.form.parentCode = categoryCode[0];
+          this.form.categoryCode = categoryCode[1];
+        }
+      }
+
+      const _form = {
+        ...this.form,
+      };
+      await this.$http
+        .post("/heart/userdemand/update", _form)
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            return this.$message.error(res.msg);
+          } else {
+            this.handlerClose();
+            this.getInfo();
+            this.$emit("success");
+            return this.$message.success("修改成功");
+          }
+        })
+        .catch(() => {
+          return this.$message.error("网络错误");
+        });
+      this.btnLoading = false;
+    },
+
+    handleSubmit () {
+      this.$refs.ruleForm.validate(async (valid) => {
+        if (valid) {
+          this.btnLoading = true;
+          if (this.addType == "add") this.addNew();
+          else if (this.addType == "edit") this.editCate();
+          else if (this.addType == "appoint") this.appointAjax();
+          else if (this.addType == "finish") this.finishAjax();
+          else if (this.addType == "cancel") this.handleDel();
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+
+    handleDel () {
+      let params = {
+        demandRecId: this.demandRecId,
+      };
+      this.$http
+        .post("/heart/userdemand/cancel", params)
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            return this.$message.error(res.msg);
+          } else {
+            this.$message.success("取消成功");
+            this.getInfo();
+            this.handlerClose();
+            this.$emit("success");
+          }
+        })
+        .catch((err) => {
+          return this.$message.error("网络错误");
+        });
+    },
+
+    getTreeData (data) {
+      if (!Array.isArray(data)) return [];
+      let arr = data.map((item) => {
+        let _item = {};
+        if (item.children) {
+          if (item.children.length === 0)
+            _item = { ...item, children: undefined };
+          else _item = { ...item, children: this.getTreeData(item.children) };
+        } else {
+          _item = { ...item };
+        }
+        return _item;
+      });
+      return arr;
+    },
+
+    getFlagData (data, flag) {
+      if (!Array.isArray(data)) return [];
+      let arr1 = data.filter((item) => item[flag]);
+      let arr2 = arr1.map((item) => {
+        if (item.children)
+          return { ...item, children: this.getFlagData(item.children, flag) };
+        else return item;
+      });
+      // console.log('arrr-oppp', arr2)
+      return arr2;
+    },
+
+    async getGridList (type, agencyId) {
+      const { user } = await this.$store.state;
+      console.log("user---ppp", user);
+      // addorupdate  query
+      await this.$http
+        .post("/gov/org/customergrid/gridoption", {
+          agencyId: agencyId || user.agencyId,
+          purpose: type,
+        })
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            return this.$message.error(res.msg);
+          } else {
+            console.log("获取查询详情成功", res.data);
+
+            if (type === "query") this.optionsG = res.data;
+            else this.optionsEditG = res.data;
+          }
+        })
+        .catch(() => {
+          return this.$message.error("网络错误");
+        });
+    },
+
+    async getDemandUserList () {
+      const { user } = await this.$store.state;
+      console.log("user---ppp", user);
+      const params = {
+        agencyId: user.agencyId,
+        gridId: this.form.gridId,
+        name: "",
+      };
+      // addorupdate
+      await this.$http
+        .post("/epmetuser/icresiuser/demandusers", params)
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            return this.$message.error(res.msg);
+          } else {
+            console.log("获取查询详情成功", res.data);
+            this.demandUserList = res.data;
+          }
+        })
+        .catch(() => {
+          return this.$message.error("网络错误");
+        });
+    },
+
+    async getDemandOptions () {
+      this.$http
+        .post("/heart/icresidemanddict/demandoption")
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            return this.$message.error(res.msg);
+          } else {
+            this.searchdemandOptions = this.getTreeData(res.data);
+            this.demandOptions = this.getFlagData(
+              this.getTreeData(res.data),
+              "usableFlag"
+            );
+          }
+        })
+        .catch(() => {
+          return this.$message.error("网络错误");
+        });
+    },
+
+    async getServiceuserList (serviceType, query) {
+      if (!serviceType) return false;
+      const { demandUserId } = this.form;
+      const params = {
+        serviceName: "",
+        serviceType: serviceType,
+        queryPurpose: query,
+      };
+      await this.$http
+        .post("/heart/userdemand/servicelist", params)
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            return this.$message.error(res.msg);
+          } else {
+            this.serviceOptiondList = res.data.filter(
+              (item) => item.value != demandUserId
+            );
+          }
+        })
+        .catch(() => {
+          return this.$message.error("网络错误");
+        });
+    },
+
+    async getDictOptions () {
+      this.$http
+        .post("/sys/dict/data/dictlist", { dictType: "user_demand_status" })
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            return this.$message.error(res.msg);
+          } else {
+            this.statusOptions = res.data;
+          }
+        })
+        .catch(() => {
+          return this.$message.error("网络错误");
+        });
+
+      this.$http
+        .post("/sys/dict/data/dictlist", {
+          dictType: "user_demand_report_type",
+        })
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            return this.$message.error(res.msg);
+          } else {
+            this.reportOptions =
+              res.data && res.data.filter((item) => item.value != "self_help");
+          }
+        })
+        .catch(() => {
+          return this.$message.error("网络错误");
+        });
+
+      this.$http
+        .post("/sys/dict/data/dictlist", {
+          dictType: "user_demand_service_type",
+        })
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            return this.$message.error(res.msg);
+          } else {
+            this.serviceOptions = res.data;
+          }
+        })
+        .catch(() => {
+          return this.$message.error("网络错误");
+        });
+    },
+
+    async getInfo () {
+      let params = {
+        demandRecId: this.demandRecId,
+      };
+      await this.$http
+        .post("/heart/userdemand/demandDetail", params)
+        .then(({ data: res }) => {
+          if (res.code !== 0) {
+            return this.$message.error(res.msg);
+          } else {
+            this.form = {
+              ...this.form,
+              ...res.data,
+              categoryCodeArr: [
+                res.data.parentCode,
+                res.data.parentCode + res.data.categoryCode,
+              ],
+            };
+
+            this.finishServiceTime = [this.form.serviceStartTime, this.form.serviceEndTime]
+            this.getGridList();
+            this.getDemandOptions();
+            this.getDemandUserList();
+            this.getServiceuserList();
+          }
+        })
+        .catch(() => {
+          return this.$message.error("网络错误");
+        });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/scss/buttonstyle.scss";
+
+.resi-container .resi-card-table {
+  ::v-deep .el-table th {
+    color: #fff;
+    background-color: rgba(33, 149, 254, 1);
+    // border-right: 1px solid rgba(33, 149, 254, 1);
+  }
+}
+.resi-table {
+  ::v-deep .el-button--text {
+    text-decoration: underline;
+  }
+  ::v-deep .btn-color-del {
+    margin: 0 10px;
+    color: rgba(213, 16, 16, 1);
+  }
+  ::v-deep .btn-color-edit {
+    color: rgba(0, 167, 169, 1);
+  }
+}
+.form-wr {
+  .input-width {
+    width: 260px;
+    &-small {
+      width: 160px;
+    }
+    &-middle {
+      width: 200px;
+    }
+    &-min {
+      min-width: 260px;
+    }
+  }
+  .input-width-textarea {
+    width: 400px;
+  }
+  .form-score {
+    ::v-deep .el-rate {
+      margin-top: 8px;
+    }
+  }
+}
+
+.resi-row-btn {
+  display: flex;
+  margin-bottom: 13px;
+  ::v-deep .el-button {
+    // margin-left: 10px;
+    border: 0;
+  }
+  ::v-deep .el-select {
+    margin-right: 10px;
+  }
+  .el-button--success {
+    background: rgba(34, 193, 195, 1);
+  }
+}
+.avatar-uploader {
+  ::v-deep .el-upload {
+    cursor: pointer;
+    position: relative;
+    overflow: hidden;
+  }
+  .el-upload:hover {
+    border-color: #409eff;
+  }
+  .avatar {
+    width: 70px;
+    height: 70px;
+    display: block;
+  }
+  .avatar-uploader-icon {
+    border: 1px dashed #d9d9d9;
+    border-radius: 6px;
+    font-size: 28px;
+    color: #8c939d;
+    width: 70px;
+    height: 70px;
+    line-height: 70px;
+    text-align: center;
+  }
+}
+
+.resi-btns {
+  margin-top: 20px;
+  text-align: center;
+}
+</style>
diff --git a/src/views/modules/communityService/measure/info.vue b/src/views/modules/communityService/measure/info.vue
index 5d84e0cde..680b5c0de 100644
--- a/src/views/modules/communityService/measure/info.vue
+++ b/src/views/modules/communityService/measure/info.vue
@@ -1,30 +1,24 @@
 <template>
-  <el-dialog title="需求信息"
-             width="50%"
-             top="5vh"
-             append-to-body
-             class="dialog-h"
-             :visible="true"
-             :close-on-click-modal="false"
-             :before-close="handlerClose">
-    <el-form label-width="120px"
-             :model="form"
-             :rules="rules"
-             ref="ruleForm"
-             class="form-wr dialog-h-content scroll-h">
-      <el-form-item label="操作方式"
-                    prop="addType">
-        <el-radio-group v-model="addType">
-          <el-radio label="look">查看</el-radio>
-          <template v-if="form.reportType != 'self_help'">
-            <el-radio label="edit"
-                      v-if="form.status === 'pending'">修改</el-radio>
-            <el-radio label="cancel"
-                      v-if="form.status !== 'finished' && form.status !== 'canceled'">取消</el-radio>
-          </template>
-          <el-radio label="appoint"
-                    v-if="form.status === 'pending' || form.status === 'assigned'">指派</el-radio>
-          <!-- <el-radio label="finish"
+  <div>
+    <el-card :class="{'box-card':source==='visiual'}">
+      <el-form label-width="120px"
+               :model="form"
+               :rules="rules"
+               ref="ruleForm">
+        <el-form-item label="操作方式"
+                      :class="{'form-item':source==='visiual'}"
+                      prop="addType">
+          <el-radio-group v-model="addType">
+            <el-radio label="look">查看</el-radio>
+            <template v-if="form.reportType != 'self_help'">
+              <el-radio label="edit"
+                        v-if="form.status === 'pending'">修改</el-radio>
+              <el-radio label="cancel"
+                        v-if="form.status !== 'finished' && form.status !== 'canceled'">取消</el-radio>
+            </template>
+            <el-radio label="appoint"
+                      v-if="form.status === 'pending' || form.status === 'assigned'">指派</el-radio>
+            <!-- <el-radio label="finish"
                     v-if="
               (form.reportType == 'self_help' &&
                 form.serviceShowFlag &&
@@ -34,8 +28,8 @@
               form.status === 'have_order' ||
               (form.status == 'finished' && !form.evaluateFlag)
             ">完成</el-radio> -->
-          <el-radio label="finish"
-                    v-if="
+            <el-radio label="finish"
+                      v-if="
               (form.reportType == 'self_help' &&
                 form.serviceShowFlag &&
                 form.serviceType !== 'volunteer' &&
@@ -43,253 +37,327 @@
               form.status === 'assigned' ||
               form.status === 'have_order' 
             ">完成</el-radio>
-        </el-radio-group>
-      </el-form-item>
-
-      <el-form-item label="所属网格"
-                    prop="gridId">
-        <el-input v-if="disabled"
-                  v-model="form.gridName"
-                  :disabled="disabled"
-                  class="input-width"></el-input>
-        <!-- <span >{{ form.gridName }}</span> -->
-        <el-select v-else
-                   v-model="form.gridId"
-                   filterable
-                   placeholder="请选择"
-                   class="input-width"
-                   clearable
-                   :disabled="disabled"
-                   @change="handleGridChange">
-          <el-option v-for="item in disabled ? optionsG : optionsEditG"
-                     :key="item.value"
-                     :label="item.label"
-                     :value="item.value">
-          </el-option>
-        </el-select>
-      </el-form-item>
-      <el-form-item label="需求类型"
-                    prop="categoryCode">
-        <el-input v-if="disabled"
-                  v-model="form.categoryName"
-                  :disabled="disabled"
-                  class="input-width"
-                  clearable></el-input>
-        <el-cascader v-else
-                     v-model="form.categoryCodeArr"
-                     :options="demandOptions"
-                     :disabled="disabled"
-                     clearable
-                     class="input-width"
-                     @change="handleCateSlect"></el-cascader>
-      </el-form-item>
-      <el-form-item label="上报类型"
-                    prop="reportType">
-        <el-input v-if="disabled"
-                  v-model="form.reportTypeName"
-                  :disabled="disabled"
-                  class="input-width"></el-input>
-        <el-select v-else
-                   v-model="form.reportType"
-                   filterable
-                   class="input-width"
-                   placeholder="请选择"
-                   clearable
-                   :disabled="disabled">
-          <el-option v-for="item in reportOptions"
-                     :key="item.value"
-                     :label="item.label"
-                     :value="item.value">
-          </el-option>
-        </el-select>
-      </el-form-item>
-      <el-form-item label="上报人"
-                    prop="reportUserName">
-        <el-input v-model="form.reportUserName"
-                  :disabled="disabled"
-                  placeholder="请输入"
-                  class="input-width"
-                  clearable></el-input>
-      </el-form-item>
-      <el-form-item label="上报人手机号"
-                    prop="reportUserMobile">
-        <el-input v-model="form.reportUserMobile"
-                  :disabled="disabled"
-                  placeholder="请输入"
-                  class="input-width"
-                  maxlength="11"
-                  clearable></el-input>
-      </el-form-item>
-      <el-form-item label="上报时间"
-                    prop="reportTime">
-        <el-date-picker v-model="form.reportTime"
-                        type="datetime"
-                        class="input-width"
-                        clearable
-                        :disabled="disabled"
-                        value-format="yyyy-MM-dd HH:mm:ss"
-                        placeholder="选择日期时间">
-        </el-date-picker>
-      </el-form-item>
-      <el-form-item label="需求人"
-                    prop="demandUserId">
-        <el-input v-if="disabled"
-                  v-model="form.demandUserName"
-                  :disabled="disabled"
-                  class="input-width"></el-input>
-        <el-select v-else
-                   v-model="selectDemandUser"
-                   class="input-width"
-                   filterable
-                   :disabled="disabled"
-                   placeholder="请选择"
-                   clearable
-                   @change="handleDemandChange">
-          <el-option v-for="item in demandUserList"
-                     :key="item.demandUserId"
-                     :label="item.label"
-                     :value="item">
-          </el-option>
-        </el-select>
-      </el-form-item>
-      <el-form-item label="服务时间"
-                    prop="wantServiceTime">
-        <el-date-picker v-model="form.wantServiceTime"
-                        type="datetime"
-                        class="input-width"
-                        clearable
-                        :disabled="disabled"
-                        value-format="yyyy-MM-dd HH:mm:ss"
-                        placeholder="选择日期时间">
-        </el-date-picker>
-      </el-form-item>
-      <el-form-item label="需求内容"
-                    prop="content">
-        <el-input v-model="form.content"
-                  :autosize="{ minRows: 2, maxRows: 10 }"
-                  :disabled="disabled"
-                  type="textarea"
-                  clearable
-                  class="input-width-textarea"
-                  placeholder="请输入内容"></el-input>
-      </el-form-item>
-      <el-form-item v-if="
+          </el-radio-group>
+        </el-form-item>
+
+        <el-form-item label="所属网格"
+                      :class="{'form-item':source==='visiual'}"
+                      prop="gridId">
+          <div :class="{'visiual-form':source==='visiual'}">
+            <el-input v-if="disabled"
+                      v-model="form.gridName"
+                      :disabled="disabled"
+                      class="input-width"></el-input>
+            <!-- <span >{{ form.gridName }}</span> -->
+            <el-select v-else
+                       v-model="form.gridId"
+                       filterable
+                       placeholder="请选择"
+                       class="input-width"
+                       clearable
+                       :disabled="disabled"
+                       @change="handleGridChange">
+              <el-option v-for="item in disabled ? optionsG : optionsEditG"
+                         :key="item.value"
+                         :label="item.label"
+                         :value="item.value">
+              </el-option>
+            </el-select>
+          </div>
+        </el-form-item>
+        <el-form-item label="需求类型"
+                      :class="{'form-item':source==='visiual'}"
+                      prop="categoryCode">
+
+          <div :class="{'visiual-form':source==='visiual'}">
+            <el-input v-if="disabled"
+                      v-model="form.categoryName"
+                      :disabled="disabled"
+                      class="input-width"
+                      clearable></el-input>
+            <el-cascader v-else
+                         v-model="form.categoryCodeArr"
+                         :options="demandOptions"
+                         :disabled="disabled"
+                         clearable
+                         class="input-width"
+                         @change="handleCateSlect"></el-cascader>
+          </div>
+        </el-form-item>
+        <el-form-item label="上报类型"
+                      :class="{'form-item':source==='visiual'}"
+                      prop="reportType">
+
+          <div :class="{'visiual-form':source==='visiual'}">
+            <el-input v-if="disabled"
+                      v-model="form.reportTypeName"
+                      :disabled="disabled"
+                      class="input-width"></el-input>
+            <el-select v-else
+                       v-model="form.reportType"
+                       filterable
+                       class="input-width"
+                       placeholder="请选择"
+                       clearable
+                       :disabled="disabled">
+              <el-option v-for="item in reportOptions"
+                         :key="item.value"
+                         :label="item.label"
+                         :value="item.value">
+              </el-option>
+            </el-select>
+          </div>
+        </el-form-item>
+        <el-form-item label="上报人"
+                      :class="{'form-item':source==='visiual'}"
+                      prop="reportUserName">
+
+          <div :class="{'visiual-form':source==='visiual'}">
+            <el-input v-model="form.reportUserName"
+                      :disabled="disabled"
+                      placeholder="请输入"
+                      class="input-width"
+                      clearable></el-input>
+          </div>
+        </el-form-item>
+        <el-form-item label="上报人手机号"
+                      :class="{'form-item':source==='visiual'}"
+                      prop="reportUserMobile">
+
+          <div :class="{'visiual-form':source==='visiual'}">
+            <el-input v-model="form.reportUserMobile"
+                      :disabled="disabled"
+                      placeholder="请输入"
+                      class="input-width"
+                      maxlength="11"
+                      clearable></el-input>
+          </div>
+        </el-form-item>
+        <el-form-item label="上报时间"
+                      :class="{'form-item':source==='visiual'}"
+                      prop="reportTime">
+
+          <div :class="{'visiual-form':source==='visiual'}">
+            <el-date-picker v-model="form.reportTime"
+                            type="datetime"
+                            class="input-width"
+                            clearable
+                            :disabled="disabled"
+                            value-format="yyyy-MM-dd HH:mm:ss"
+                            placeholder="选择日期时间">
+            </el-date-picker>
+          </div>
+        </el-form-item>
+        <el-form-item label="需求人"
+                      :class="{'form-item':source==='visiual'}"
+                      prop="demandUserId">
+
+          <div :class="{'visiual-form':source==='visiual'}">
+            <el-input v-if="disabled"
+                      v-model="form.demandUserName"
+                      :disabled="disabled"
+                      class="input-width"></el-input>
+            <el-select v-else
+                       v-model="selectDemandUser"
+                       class="input-width"
+                       filterable
+                       :disabled="disabled"
+                       placeholder="请选择"
+                       clearable
+                       @change="handleDemandChange">
+              <el-option v-for="item in demandUserList"
+                         :key="item.demandUserId"
+                         :label="item.label"
+                         :value="item">
+              </el-option>
+            </el-select>
+          </div>
+        </el-form-item>
+        <el-form-item label="服务时间"
+                      :class="{'form-item':source==='visiual'}"
+                      prop="wantServiceTime">
+
+          <div :class="{'visiual-form':source==='visiual'}">
+            <el-date-picker v-model="form.wantServiceTime"
+                            type="datetime"
+                            clearable
+                            :disabled="disabled"
+                            value-format="yyyy-MM-dd HH:mm:ss"
+                            placeholder="选择日期时间">
+            </el-date-picker>
+          </div>
+        </el-form-item>
+        <el-form-item label="需求内容"
+                      :class="{'form-item':source==='visiual'}"
+                      prop="content">
+
+          <div :class="{'visiual-form':source==='visiual'}">
+            <el-input v-model="form.content"
+                      :autosize="{ minRows: 2, maxRows: 10 }"
+                      :disabled="disabled"
+                      type="textarea"
+                      clearable
+                      class="cell-width-area"
+                      placeholder="请输入内容"></el-input>
+          </div>
+        </el-form-item>
+        <el-form-item v-if="
           addType === 'appoint' ||
           addType == 'finish' ||
           (addType == 'look' && form.serviceShowFlag)
         "
-                    label="服务方"
-                    prop="serviceType">
-        <template v-if="disabled && addType !== 'appoint'">
-          <el-input v-model="form.serviceShowName"
-                    :disabled="disabled"
-                    class="input-width"></el-input>
-        </template>
-        <template v-else>
-          <el-select v-model="form.serviceType"
-                     class="input-width-small"
-                     placeholder="请选择"
-                     clearable
-                     :disabled="disabled && addType !== 'appoint'"
-                     @change="handleServiceChange('add', $event)">
-            <el-option v-for="item in serviceOptions"
-                       :key="item.value"
-                       :label="item.label"
-                       :value="item.value">
-            </el-option>
-          </el-select>
-          -
-          <el-select v-model="form.serverId"
-                     class="input-width-middle"
-                     filterable
-                     placeholder="请选择"
-                     clearable
-                     :disabled="disabled && addType !== 'appoint'">
-            <el-option v-for="item in serviceOptiondList"
-                       :key="item.value"
-                       :label="item.label"
-                       :value="item.value">
-            </el-option>
-          </el-select>
-        </template>
-      </el-form-item>
-      <el-form-item v-if="addType == 'look' && form.status == 'canceled'"
-                    label="取消时间"
-                    prop="cancelTime">
-        <span>{{ form.cancelTime }}</span>
-      </el-form-item>
-      <template v-if="
+                      :class="{'form-item':source==='visiual'}"
+                      label="服务方"
+                      prop="serviceType">
+
+          <div :class="{'visiual-form':source==='visiual'}">
+            <template v-if="disabled && addType !== 'appoint'">
+              <el-input v-model="form.serviceShowName"
+                        :disabled="disabled"
+                        class="input-width"></el-input>
+            </template>
+            <template v-else>
+              <el-select v-model="form.serviceType"
+                         class="input-width-small"
+                         placeholder="请选择"
+                         clearable
+                         :disabled="disabled && addType !== 'appoint'"
+                         @change="handleServiceChange('add', $event)">
+                <el-option v-for="item in serviceOptions"
+                           :key="item.value"
+                           :label="item.label"
+                           :value="item.value">
+                </el-option>
+              </el-select>
+              -
+              <el-select v-model="form.serverId"
+                         class="input-width-middle"
+                         filterable
+                         placeholder="请选择"
+                         clearable
+                         :disabled="disabled && addType !== 'appoint'">
+                <el-option v-for="item in serviceOptiondList"
+                           :key="item.value"
+                           :label="item.label"
+                           :value="item.value">
+                </el-option>
+              </el-select>
+            </template>
+          </div>
+        </el-form-item>
+        <el-form-item v-if="addType == 'look' && form.status == 'canceled'"
+                      label="取消时间"
+                      :class="{'form-item':source==='visiual'}"
+                      prop="cancelTime">
+          <span>{{ form.cancelTime }}</span>
+        </el-form-item>
+        <template v-if="
           (addType == 'finish' && form.reportType != 'self_help') ||
           (addType == 'look' && form.status == 'finished')
         ">
-        <el-form-item label="实际服务时间"
-                      prop="serviceStartTime">
-          <el-date-picker v-model="finishServiceTime"
-                          class="input-width-min"
-                          clearable
-                          :disabled="disabled && addType != 'finish'"
-                          type="datetimerange"
-                          range-separator="至"
-                          start-placeholder="开始日期"
-                          end-placeholder="结束日期"
-                          value-format="yyyy-MM-dd HH:mm:ss"
-                          @change="handelBlurServiceTime">
-          </el-date-picker>
-        </el-form-item>
-        <el-form-item label="完成情况"
-                      prop="finishResult">
-          <el-radio v-model="form.finishResult"
-                    label="resolved"
-                    :disabled="disabled && addType != 'finish'">已解决</el-radio>
-          <el-radio v-model="form.finishResult"
-                    label="unresolved"
-                    :disabled="disabled && addType != 'finish'">未解决</el-radio>
-        </el-form-item>
-        <el-form-item label="评价"
-                      prop="score"
-                      class="form-score">
-          <el-rate v-model="form.score"
-                   :allow-half="true"
-                   :disabled="disabled && addType != 'finish'"></el-rate>
-        </el-form-item>
-        <el-form-item label="备注"
-                      prop="finishDesc">
-          <el-input v-model="form.finishDesc"
-                    :autosize="{ minRows: 2, maxRows: 10 }"
-                    :disabled="disabled && addType != 'finish'"
-                    type="textarea"
-                    clearable
-                    class="input-width-textarea"
-                    placeholder="请输入内容"></el-input>
-        </el-form-item>
-      </template>
-      <template v-if="addType == 'finish' && form.reportType == 'self_help'">
-        <el-form-item label="实际服务时间"
-                      prop="serviceStartTime">
-          <el-date-picker v-model="finishServiceTime"
-                          class="input-width-min"
-                          clearable
-                          :disabled="disabled && addType != 'finish'"
-                          type="datetimerange"
-                          range-separator="至"
-                          start-placeholder="开始日期"
-                          end-placeholder="结束日期"
-                          value-format="yyyy-MM-dd HH:mm:ss"
-                          @change="handelBlurServiceTime">
-          </el-date-picker>
-        </el-form-item>
-      </template>
-    </el-form>
-    <div class="resi-btns">
-      <el-button size="small"
-                 @click="handlerClose">关闭</el-button>
-      <el-button v-if="addType != 'look'"
-                 type="primary"
-                 size="small"
-                 :loading="btnLoading"
-                 @click="handleSubmit">提交</el-button>
-    </div>
-  </el-dialog>
+          <el-form-item label="实际服务时间"
+                        :class="{'form-item':source==='visiual'}"
+                        prop="serviceStartTime">
+
+            <div :class="{'visiual-form':source==='visiual'}">
+              <el-date-picker v-model="finishServiceTime"
+                              class="input-width-min"
+                              clearable
+                              :disabled="disabled && addType != 'finish'"
+                              type="datetimerange"
+                              range-separator="至"
+                              start-placeholder="开始日期"
+                              end-placeholder="结束日期"
+                              value-format="yyyy-MM-dd HH:mm:ss"
+                              @change="handelBlurServiceTime">
+              </el-date-picker>
+            </div>
+          </el-form-item>
+          <el-form-item label="完成情况"
+                        :class="{'form-item':source==='visiual'}"
+                        prop="finishResult">
+            <el-radio v-model="form.finishResult"
+                      label="resolved"
+                      :disabled="disabled && addType != 'finish'">已解决</el-radio>
+            <el-radio v-model="form.finishResult"
+                      label="unresolved"
+                      :disabled="disabled && addType != 'finish'">未解决</el-radio>
+          </el-form-item>
+          <el-form-item label="评价"
+                        prop="score"
+                        :class="{'form-item':source==='visiual'}"
+                        class="form-score">
+            <el-rate v-model="form.score"
+                     :allow-half="true"
+                     :disabled="disabled && addType != 'finish'"></el-rate>
+          </el-form-item>
+          <el-form-item label="备注"
+                        :class="{'form-item':source==='visiual'}"
+                        prop="finishDesc">
+
+            <div :class="{'visiual-form':source==='visiual'}">
+              <el-input v-model="form.finishDesc"
+                        :autosize="{ minRows: 2, maxRows: 10 }"
+                        :disabled="disabled && addType != 'finish'"
+                        type="textarea"
+                        clearable
+                        class="cell-width-area"
+                        placeholder="请输入内容"></el-input>
+            </div>
+          </el-form-item>
+        </template>
+        <template v-if="addType == 'finish' && form.reportType == 'self_help'">
+          <el-form-item label="实际服务时间"
+                        :class="{'form-item':source==='visiual'}"
+                        prop="serviceStartTime">
+
+            <div :class="{'visiual-form':source==='visiual'}">
+              <el-date-picker v-model="finishServiceTime"
+                              class="input-width-min"
+                              clearable
+                              :disabled="disabled && addType != 'finish'"
+                              type="datetimerange"
+                              range-separator="至"
+                              start-placeholder="开始日期"
+                              end-placeholder="结束日期"
+                              value-format="yyyy-MM-dd HH:mm:ss"
+                              @change="handelBlurServiceTime">
+              </el-date-picker>
+            </div>
+          </el-form-item>
+        </template>
+      </el-form>
+      <!-- <div class="resi-btns">
+        <el-button size="small"
+                   @click="handlerClose">关闭</el-button>
+        <el-button v-if="addType != 'look'"
+                   type="primary"
+                   size="small"
+                   :loading="btnLoading"
+                   @click="handleSubmit">提交</el-button>
+      </div> -->
+
+      <div v-if="source==='manage'"
+           class="div-btn ">
+        <el-button size="small"
+                   @click="handlerClose">关闭</el-button>
+        <el-button v-if="addType != 'look'"
+                   style="margin-left:20px"
+                   type="primary"
+                   size="small"
+                   @click="handleSubmit">提交</el-button>
+      </div>
+      <div v-else
+           class="div-btn">
+        <div class="item_btn"
+             @click="handlerClose()">关闭</div>
+        <div v-if="addType != 'look'"
+             class="item_btn mgl"
+             @click="handleSubmit()">提交</div>
+      </div>
+    </el-card>
+
+  </div>
 </template>
 
 <script>
@@ -305,6 +373,10 @@ export default {
     //   type: String,
     //   default: "look",
     // },
+    source: {//展示来源：manage  管理平台    visiual  可视化平台
+      type: String,
+      default: 'visiual'
+    }
   },
 
   data () {
@@ -833,91 +905,6 @@ export default {
 
 <style lang="scss" scoped>
 @import "@/assets/scss/buttonstyle.scss";
-
-.resi-container .resi-card-table {
-  ::v-deep .el-table th {
-    color: #fff;
-    background-color: rgba(33, 149, 254, 1);
-    // border-right: 1px solid rgba(33, 149, 254, 1);
-  }
-}
-.resi-table {
-  ::v-deep .el-button--text {
-    text-decoration: underline;
-  }
-  ::v-deep .btn-color-del {
-    margin: 0 10px;
-    color: rgba(213, 16, 16, 1);
-  }
-  ::v-deep .btn-color-edit {
-    color: rgba(0, 167, 169, 1);
-  }
-}
-.form-wr {
-  .input-width {
-    width: 260px;
-    &-small {
-      width: 160px;
-    }
-    &-middle {
-      width: 200px;
-    }
-    &-min {
-      min-width: 260px;
-    }
-  }
-  .input-width-textarea {
-    width: 400px;
-  }
-  .form-score {
-    ::v-deep .el-rate {
-      margin-top: 8px;
-    }
-  }
-}
-
-.resi-row-btn {
-  display: flex;
-  margin-bottom: 13px;
-  ::v-deep .el-button {
-    // margin-left: 10px;
-    border: 0;
-  }
-  ::v-deep .el-select {
-    margin-right: 10px;
-  }
-  .el-button--success {
-    background: rgba(34, 193, 195, 1);
-  }
-}
-.avatar-uploader {
-  ::v-deep .el-upload {
-    cursor: pointer;
-    position: relative;
-    overflow: hidden;
-  }
-  .el-upload:hover {
-    border-color: #409eff;
-  }
-  .avatar {
-    width: 70px;
-    height: 70px;
-    display: block;
-  }
-  .avatar-uploader-icon {
-    border: 1px dashed #d9d9d9;
-    border-radius: 6px;
-    font-size: 28px;
-    color: #8c939d;
-    width: 70px;
-    height: 70px;
-    line-height: 70px;
-    text-align: center;
-  }
-}
-
-.resi-btns {
-  margin-top: 20px;
-  text-align: center;
-}
+@import "@/assets/scss/modules/visual/a_customize.scss";
+@import "@/assets/scss/modules/shequzhili/event-info.scss";
 </style>
diff --git a/src/views/modules/shequzhili/event/cpts/event-info.vue b/src/views/modules/shequzhili/event/cpts/event-info.vue
index 3b38fc9ae..815da6103 100644
--- a/src/views/modules/shequzhili/event/cpts/event-info.vue
+++ b/src/views/modules/shequzhili/event/cpts/event-info.vue
@@ -48,7 +48,7 @@
         <div v-if="!eventDetailData.operationId &&pageTypeCopy == 'dispose' "
              class="process-form">
           <el-card :class="{'box-card':source==='visiual'}">
-            <div class="process-title">处理</div>
+            <div :class="['process-title',{'process-title-vis':source==='visiual'}]">处理</div>
             <process-form ref="ref_processinfo_dispose"
                           :source="source"
                           :eventId="eventId"
diff --git a/src/views/modules/shequzhili/event/cpts/process-form-demand.vue b/src/views/modules/shequzhili/event/cpts/process-form-demand.vue
index 2aeada736..77c0193f0 100644
--- a/src/views/modules/shequzhili/event/cpts/process-form-demand.vue
+++ b/src/views/modules/shequzhili/event/cpts/process-form-demand.vue
@@ -19,7 +19,7 @@
       </el-form-item> -->
       <el-form-item label="服务内容"
                     label-width="150px"
-                    class="form-item"
+                    :class="{'form-item':source==='visiual'}"
                     prop="content">
         <div :class="{'visiual-form':source==='visiual'}">
           <el-input v-model="formData.content"
@@ -33,7 +33,7 @@
 
       <el-form-item label="服务类型"
                     label-width="150px"
-                    class="form-item"
+                    :class="{'form-item':source==='visiual'}"
                     prop="categoryCode">
         <div :class="{'visiual-form':source==='visiual'}">
 
@@ -48,7 +48,7 @@
 
       <el-form-item label="服务时间"
                     label-width="150px"
-                    class="form-item"
+                    :class="{'form-item':source==='visiual'}"
                     prop="wantServiceTime">
         <div :class="{'visiual-form':source==='visiual'}">
           <el-date-picker v-model="formData.wantServiceTime"
@@ -63,7 +63,7 @@
 
       <el-form-item label="需求人"
                     label-width="150px"
-                    class="form-item"
+                    :class="{'form-item':source==='visiual'}"
                     prop="demandUserName">
         <div :class="{'visiual-form':source==='visiual'}">
           <el-input v-model="formData.demandUserName"
@@ -73,7 +73,7 @@
       </el-form-item>
       <el-form-item label="联系电话"
                     label-width="150px"
-                    class="form-item"
+                    :class="{'form-item':source==='visiual'}"
                     prop="demandUserMobile">
         <div :class="{'visiual-form':source==='visiual'}">
           <el-input v-model="formData.demandUserMobile"
@@ -83,7 +83,7 @@
       </el-form-item>
       <el-form-item label="服务地点"
                     prop="serviceLocation"
-                    class="form-item"
+                    :class="{'form-item':source==='visiual'}"
                     label-width="150px"
                     style="display: block">
 
@@ -95,7 +95,7 @@
 
       </el-form-item>
       <el-form-item label="位置坐标"
-                    class="form-item"
+                    :class="{'form-item':source==='visiual'}"
                     prop="longitude"
                     label-width="150px"
                     style="display: block">
@@ -137,7 +137,7 @@
       </el-form-item>
 
       <el-form-item label="门牌号"
-                    class="form-item"
+                    :class="{'form-item':source==='visiual'}"
                     label-width="150px"
                     prop="locationDetail">
         <div :class="{'visiual-form':source==='visiual'}">
@@ -148,7 +148,7 @@
       </el-form-item>
 
       <el-form-item label="服务方"
-                    class="form-item"
+                    :class="{'form-item':source==='visiual'}"
                     label-width="150px"
                     prop="serverId">
 
@@ -341,11 +341,6 @@ export default {
   },
   created () {
 
-    if (this.source === 'visiual') {
-      require("@/assets/scss/modules/shequzhili/event-info-visiual.scss")
-    } else {
-      require("@/assets/scss/modules/shequzhili/event-info.scss")
-    }
 
   },
 
@@ -695,6 +690,7 @@ export default {
 
 <style lang='scss' scoped>
 @import "@/assets/scss/modules/visual/a_customize.scss";
+@import "@/assets/scss/modules/shequzhili/event-info.scss";
 </style>
 
 
diff --git a/src/views/modules/shequzhili/event/cpts/process-form-project.vue b/src/views/modules/shequzhili/event/cpts/process-form-project.vue
index d8dd2ff3a..71fef5e66 100644
--- a/src/views/modules/shequzhili/event/cpts/process-form-project.vue
+++ b/src/views/modules/shequzhili/event/cpts/process-form-project.vue
@@ -7,7 +7,7 @@
              label-width="100px">
       <el-form-item label="事件分类"
                     label-width="150px"
-                    class="form-item"
+                    :class="{'form-item':source==='visiual'}"
                     prop="categoryList">
         <div :class="{'visiual-form':source==='visiual'}">
           <el-cascader class="cell-width-2"
@@ -22,7 +22,7 @@
       </el-form-item>
       <el-form-item label="项目标题"
                     prop="title"
-                    class="form-item"
+                    :class="{'form-item':source==='visiual'}"
                     label-width="150px"
                     style="display: block">
         <div :class="{'visiual-form':source==='visiual'}">
@@ -36,7 +36,7 @@
 
       <el-form-item label="所属网格	"
                     prop="gridId"
-                    class="form-item"
+                    :class="{'form-item':source==='visiual'}"
                     label-width="150px"
                     style="display: block">
         <div :class="{'visiual-form':source==='visiual'}">
@@ -55,7 +55,7 @@
 
       <el-form-item label="处理部门"
                     label-width="150px"
-                    class="form-item"
+                    :class="{'form-item':source==='visiual'}"
                     prop="staffList">
         <el-popover placement="bottom"
                     width="400"
@@ -77,7 +77,7 @@
 
       <el-form-item label="协办单位"
                     label-width="150px"
-                    class="form-item"
+                    :class="{'form-item':source==='visiual'}"
                     prop="assistanceUnitIndex">
         <div :class="{'visiual-form':source==='visiual'}">
           <el-select v-model.trim="formData.assistanceUnitIndex"
@@ -94,7 +94,7 @@
 
       <el-form-item label="项目方案"
                     label-width="150px"
-                    class="form-item"
+                    :class="{'form-item':source==='visiual'}"
                     prop="publicReply">
         <div :class="{'visiual-form':source==='visiual'}">
           <el-input type="textarea"
@@ -108,7 +108,7 @@
 
       <el-form-item label="内部备注"
                     label-width="150px"
-                    class="form-item"
+                    :class="{'form-item':source==='visiual'}"
                     prop="internalRemark">
         <div :class="{'visiual-form':source==='visiual'}">
           <el-input type="textarea"
@@ -122,7 +122,7 @@
 
       <el-form-item label="图片/附件："
                     label-width="150px"
-                    class="form-item"
+                    :class="{'form-item':source==='visiual'}"
                     prop="internalFile">
         <el-upload class="avatar-uploader"
                    :action="uploadUlr"
@@ -137,7 +137,7 @@
 
       <el-form-item label="标签"
                     label-width="150px"
-                    class="form-item"
+                    :class="{'form-item':source==='visiual'}"
                     prop="tagList">
 
         <fold-text v-if="tagList.length>0"
@@ -394,11 +394,7 @@ export default {
   },
   created () {
 
-    if (this.source === 'visiual') {
-      require("@/assets/scss/modules/shequzhili/event-info-visiual.scss")
-    } else {
-      require("@/assets/scss/modules/shequzhili/event-info.scss")
-    }
+
 
   },
 
@@ -629,6 +625,7 @@ export default {
 
 <style lang='scss' scoped>
 @import "@/assets/scss/modules/visual/a_customize.scss";
+@import "@/assets/scss/modules/shequzhili/event-info.scss";
 </style>
 
 
diff --git a/src/views/modules/shequzhili/event/cpts/process-form-replay.vue b/src/views/modules/shequzhili/event/cpts/process-form-replay.vue
index a76ba3b6f..0eeceaa40 100644
--- a/src/views/modules/shequzhili/event/cpts/process-form-replay.vue
+++ b/src/views/modules/shequzhili/event/cpts/process-form-replay.vue
@@ -7,7 +7,7 @@
              :rules="dataRule">
       <el-form-item label="事件分类"
                     label-width="150px"
-                    class="form-item"
+                    :class="{'form-item':source==='visiual'}"
                     prop="categoryList">
         <div :class="{'visiual-form':source==='visiual'}">
           <el-cascader class="cell-width-2"
@@ -23,7 +23,7 @@
       <el-form-item label="回复内容"
                     prop="content"
                     label-width="150px"
-                    class="form-item"
+                    :class="{'form-item':source==='visiual'}"
                     style="display: block">
         <div :class="{'visiual-form':source==='visiual'}">
           <el-input class="cell-width-area"
@@ -38,9 +38,9 @@
       </el-form-item>
       <el-form-item label=""
                     label-width="150px"
-                    class="form-item"
+                    :class="{'form-item':source==='visiual'}"
                     style="display: block">
-        <el-checkbox class="form-item"
+        <el-checkbox :class="{'form-item':source==='visiual'}"
                      v-model="status">已完成</el-checkbox>
       </el-form-item>
 
@@ -121,18 +121,12 @@ export default {
 
   created () {
 
-
+    console.log(this.source)
 
   },
 
   async mounted () {
-    this.$nextTick(() => {
-      if (this.source === 'visiual') {
-        import("@/assets/scss/modules/shequzhili/event-info-visiual.scss")
-      } else {
-        import("@/assets/scss/modules/shequzhili/event-info.scss")
-      }
-    })
+
     this.getCategoryList()
     if (this.eventId) {
       this.eventDetailCopy = JSON.parse(JSON.stringify(this.eventDetailData));
@@ -246,6 +240,7 @@ export default {
 
 <style lang='scss' scoped>
 @import "@/assets/scss/modules/visual/a_customize.scss";
+@import "@/assets/scss/modules/shequzhili/event-info.scss";
 </style>
 
 
diff --git a/src/views/modules/shequzhili/event/cpts/process-form.vue b/src/views/modules/shequzhili/event/cpts/process-form.vue
index 78c00638d..560b8aeda 100644
--- a/src/views/modules/shequzhili/event/cpts/process-form.vue
+++ b/src/views/modules/shequzhili/event/cpts/process-form.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="">
-    <div class="g-process-info">
+    <div>
 
       <el-form ref="ref_form1"
                :inline="false"
@@ -9,9 +9,9 @@
 
         <el-form-item label="处理方式"
                       label-width="150px"
-                      class="form-item"
+                      :class="{'form-item':source==='visiual'}"
                       prop="operationType">
-          <el-radio-group class="form-item"
+          <el-radio-group :class="{'form-item':source==='visiual'}"
                           v-model="operationType"
                           @change="handleChangeOperationType">
             <el-radio v-if="!eventId"
@@ -150,11 +150,7 @@ export default {
 
   created () {
 
-    if (this.source === 'visiual') {
-      require("@/assets/scss/modules/shequzhili/event-info-visiual.scss")
-    } else {
-      require("@/assets/scss/modules/shequzhili/event-info.scss")
-    }
+    console.log(this.source)
 
   },
 
@@ -240,7 +236,9 @@ export default {
 </script>
 
 
-
+<style lang="scss" scoped>
+@import "@/assets/scss/modules/shequzhili/event-info.scss";
+</style>
 
 
 
diff --git a/src/views/modules/shequzhili/xiangmu/cpts/project-info.vue b/src/views/modules/shequzhili/xiangmu/cpts/project-info.vue
index 1b1cb45fd..a77e51220 100644
--- a/src/views/modules/shequzhili/xiangmu/cpts/project-info.vue
+++ b/src/views/modules/shequzhili/xiangmu/cpts/project-info.vue
@@ -8,30 +8,30 @@
           <h3 v-if="source==='manage'">项目详情</h3>
 
           <div class="m-info">
-            <div class="info-prop">
+            <div :class="['info-prop',{'info-prop-vis':source==='visiual'}]">
               <span class="info-title-2">项目标题：</span>
               <span>{{ projectInfo.projectTitle }}</span>
             </div>
-            <div class="info-prop">
+            <div :class="['info-prop',{'info-prop-vis':source==='visiual'}]">
               <span class="info-title-2">项目背景：</span>
               <span>{{ projectInfo.backGround || "--" }}</span>
             </div>
-            <div class="info-prop">
+            <div :class="['info-prop',{'info-prop-vis':source==='visiual'}]">
               <span class="info-title-2">项目方案：</span>
               <span>{{ projectInfo.publicReply }}</span>
             </div>
-            <div class="info-prop">
+            <div :class="['info-prop',{'info-prop-vis':source==='visiual'}]">
               <span class="info-title-2">内部备注：</span>
               <span>{{ projectInfo.internalRemark || "--" }}</span>
             </div>
 
-            <div class="info-prop"
+            <div :class="['info-prop',{'info-prop-vis':source==='visiual'}]"
                  v-if="projectInfo.departmentNameList.length > 0">
               <span class="info-title-2">当前处理部门：</span>
               <span>{{ projectInfo.departmentNameList.join("、") }}</span>
             </div>
 
-            <div class="info-prop"
+            <div :class="['info-prop',{'info-prop-vis':source==='visiual'}]"
                  v-if="
                 projectInfo.origin == 'issue' ||
                 projectInfo.origin == 'resi_event'
@@ -41,14 +41,14 @@
                  @click="handleWatchOrigin">查看项目来源</a>
             </div>
 
-            <div class="info-prop"
+            <div :class="['info-prop',{'info-prop-vis':source==='visiual'}]"
                  v-if="projectInfo.projectStatus == 'closed'">
               <span class="info-title-2">项目评价：</span>
               <a style="cursor: pointer"
                  @click="showedEvaluation = true">查看项目评价</a>
             </div>
 
-            <div class="info-prop">
+            <div :class="['info-prop',{'info-prop-vis':source==='visiual'}]">
               <span class="info-title-2">分类：</span>
               <fold-text v-if="projectCate.length > 0"
                          style="width: 250px"
@@ -84,12 +84,16 @@
                              @click="updateProjectCate">确定</el-button>
                 </div>
                 <div slot="reference">
-                  <el-button size="small"
+                  <el-button v-if="source==='manage'"
+                             size="small"
                              type="">更改</el-button>
+
+                  <div v-else
+                       class="one-btn">更改</div>
                 </div>
               </el-popover>
             </div>
-            <div class="info-prop">
+            <div :class="['info-prop',{'info-prop-vis':source==='visiual'}]">
               <span class="info-title-2">标签：</span>
               <fold-text v-if="projectTag.length > 0"
                          style="width: 250px"
@@ -141,19 +145,32 @@
                              @click="updateProjectTag">确定</el-button>
                 </div>
                 <div slot="reference">
-                  <el-button size="small"
+                  <el-button v-if="source==='manage'"
+                             size="small"
                              type="">更改</el-button>
+
+                  <div v-else
+                       class="one-btn">更改</div>
                 </div>
               </el-popover>
             </div>
           </div>
 
-          <div class="m-btns"
-               v-if="
-              !projectInfo.processable || projectInfo.projectStatus != 'pending'
-            ">
-            <el-button size=""
-                       @click="handleClose">关闭</el-button>
+          <div v-if="!projectInfo.processable || projectInfo.projectStatus != 'pending'            ">
+
+            <div v-if="source==='manage'"
+                 class="m-btns ">
+              <el-button size="small"
+                         @click="handleClose">关闭</el-button>
+
+            </div>
+            <div v-else
+                 class="m-btns">
+              <div class="item_btn"
+                   @click="handleClose">关闭</div>
+
+            </div>
+
           </div>
         </el-card>
         <el-card :class="{'box-card':source==='visiual'}"
@@ -298,14 +315,32 @@
               </el-form-item>
             </el-form>
           </div>
-          <div class="m-btns">
+          <!-- <div class="m-btns">
             <el-button size=""
                        style="margin-right: 50px"
                        @click="handleClose">关闭</el-button>
             <el-button size=""
                        type="danger"
                        @click="handleSubmit">确定</el-button>
+          </div> -->
+
+          <div v-if="source==='manage'"
+               class="m-btns ">
+            <el-button size="small"
+                       @click="handleClose">关闭</el-button>
+            <el-button size=""
+                       type="danger"
+                       @click="handleSubmit">确定</el-button>
           </div>
+          <div v-else
+               class="m-btns">
+            <div class="item_btn"
+                 @click="handleClose">关闭</div>
+            <div class="item_btn mgl"
+                 @click="handleSubmit">确定</div>
+
+          </div>
+
         </el-card>
       </div>
       <div class="g-right">
@@ -313,8 +348,9 @@
                  :class="{'box-card':source==='visiual'}"
                  :style="styleFullHeight"
                  v-if="projectProcess.length > 0">
-          <div :class="['process-title',{'process-title-vis':source==='visiual'}]">处理进展</div>
           <div class="m-process">
+            <div :class="['process-title',{'process-title-vis':source==='visiual'}]">处理进展</div>
+
             <div class="list">
               <div class="item"
                    :class="[index === 0 ? 'z-on' : '',{'item-vis':source==='visiual'}]"
@@ -681,11 +717,6 @@ export default {
   },
   created () {
 
-    if (this.source === 'visiual') {
-      require("@/assets/scss/modules/shequzhili/event-info-visiual.scss")
-    } else {
-      require("@/assets/scss/modules/shequzhili/event-info.scss")
-    }
 
   },
 
diff --git a/src/views/modules/visual/communityGovern/fivelayers/eventInfo.vue b/src/views/modules/visual/communityGovern/fivelayers/eventInfo.vue
index 6e40e3dd8..04bee8078 100644
--- a/src/views/modules/visual/communityGovern/fivelayers/eventInfo.vue
+++ b/src/views/modules/visual/communityGovern/fivelayers/eventInfo.vue
@@ -49,7 +49,7 @@ export default {
       loading: false,
 
       pageType: 'dispose',
-      eventId: '1536238232963260418',
+      eventId: '1529724450524061698',
       eventDetailData: {},
     };
   },