维修基金相关页面修改

Lou

2024-02-27 953890b950f73a64a538238f207ee43684059c78

 src/views/property/process/maintenanceFundApply/edit.vue

@@ -14,6 +14,24 @@
          <span>审批信息</span>
        </div>
        <avue-form ref="crud" :option="option" v-model="form" @submit="handleSubmit">

          <template slot-scope="{ row, size, index }" slot="vote">
            <div>{{ topicTitle }}</div>
            <el-table :data="topictData" v-if="topictData.length">
              <el-table-column width="300" property="optionContent" label="选项"
                label-class-name="workOrderStyle"></el-table-column>
              <el-table-column width="300" property="number" label="人数" label-class-name="workOrderStyle">
              </el-table-column>
              <el-table-column width="300">
                <template slot-scope="scope">
                  <el-button slot="reference" type="primary" size="mini"
                    @click="openUserPopup(scope.row, 1)">详情</el-button>
                </template>
              </el-table-column>
            </el-table>
          </template>


          <template slot-scope="{size}" slot="menuForm">
            <el-button type="primary" :size="size" @click="$refs.crud.submit()">保存信息</el-button>
            <!-- <el-button :size="size" @click="$refs.form.resetForm()">自定义清空</el-button> -->
@@ -32,10 +50,10 @@
          <el-timeline>
            <el-timeline-item :key="flow.id" :timestamp="flow.createTime" v-for="flow in flowList" placement="top">
              <el-card shadow="hover">
                <p>{{flow.assigneeName}} 在 [{{flow.createTime}}] 开始处理 [{{flow.historyActivityName}}] 环节</p>
                <p v-if="flow.historyActivityDurationTime!==''">任务历时 [{{flow.historyActivityDurationTime}}]</p>
                <p v-if="flow.comment!==''">批复意见: [{{flow.comment}}]</p>
                <p v-if="flow.endTime!==''">结束时间: [{{flow.endTime}}]</p>
                <p>{{ flow.assigneeName }} 在 [{{ flow.createTime }}] 开始处理 [{{ flow.historyActivityName }}] 环节</p>
                <p v-if="flow.historyActivityDurationTime !== ''">任务历时 [{{ flow.historyActivityDurationTime }}]</p>
                <p v-if="flow.comment !== ''">批复意见: [{{ flow.comment }}]</p>
                <p v-if="flow.endTime !== ''">结束时间: [{{ flow.endTime }}]</p>
              </el-card>
            </el-timeline-item>
          </el-timeline>
@@ -60,196 +78,206 @@
      <el-button type="danger" @click="handleDisagree">关闭申请</el-button>
    </div>

    <deitDiscussion ref="DeitDiscussion">
    </deitDiscussion>

  </basic-container>
</template>

<script>
  import {
    historyFlowList,
    leaveDetail
  } from "@/api/work/process";
import {
  historyFlowList,
  leaveDetail
} from "@/api/work/process";

  import {
    getList,
    remove,
    update,
    add,
    getPropertyCapitalApply
  } from "@/api/property/propertyCapitalApply";
  import {
    completeTask
  } from "@/api/work/work";

  export default {
    data() {
      return {
        taskId: '',
        businessId: '',
        processInstanceId: '',
        src: '',
        flowList: [],
        form: {
          flow: {
            assigneeName: '',
          },
          startTime: '',
          endTime: '',
          reason: '',
          comment: '',
import {
  getList,
  remove,
  update,
  add,
  getPropertyCapitalApply
} from "@/api/property/propertyCapitalApply";
import {
  completeTask
} from "@/api/work/work";
import {
  getLists
} from "@/api/discuss/topics"
import deitDiscussion from "../../components/deitDiscussion.vue"
export default {
  components: {
    deitDiscussion
  },
  data() {
    return {
      taskId: '',
      businessId: '',
      processInstanceId: '',
      src: '',
      flowList: [],
      form: {
        flow: {
          assigneeName: '',
        },
        option: {
          height: "auto",
          calcHeight: 54,
          dialogWidth: 1150,
          tip: false,
          searchShow: true,
          searchMenuSpan: 3,
          menuWidth: 350,
          border: true,
          //stripe:true,
          submitBtn: false,
          emptyBtn: false,
          index: true,
          viewBtn: true,
          selection: true,
          dialogClickModal: false,
          column: [{
              label: "小区",
              prop: "districtId",
              searchSpan: 5,
              search: true,
              type: 'tree',
              dicUrl: `/api/blade-district/district/getDistrictTree`,
              props: {
                label: "name",
                value: "id"
              },
              defaultExpandedKeys: ["361102003"],
              span: 12,
              labelWidth: 120,
              width: 220,
              overHidden: true,
              rules: [{
                required: true,
                message: "请选择小区",
                trigger: "blur",
              }, ],
            },
            {
              label: '维修项目名称',
              prop: 'name',
              searchLabelWidth: 120,
              searchSpan: 5,
              search: true,
              span: 12,
              labelWidth: 140,
              rules: [{
                required: true,
                message: "请输入维修项目名称",
                trigger: "blur",
              }, ],
            },
            {
              label: "预计开工时间",
              prop: "runTime",
              span: 12,
              labelWidth: 140,
              type: "date",
              format: "yyyy-MM-dd",
              valueFormat: "yyyy-MM-dd",
              rules: [{
                required: true,
                message: "请选择合同开始时间",
                trigger: "blur",
              }, ],
            },
            {
              label: "预计竣工时间",
              prop: "completedTime",
              labelWidth: 140,
              span: 12,
              type: "date",
              format: "yyyy-MM-dd",
              valueFormat: "yyyy-MM-dd",
              rules: [{
                required: true,
                message: "请选择合同结束时间",
                trigger: "blur",
              }, ],
            },
            {
              label: "项目分摊方式",
              prop: "allocationWay",
              labelWidth: 140,
              value: '按建筑面积分摊',
              span: 12,
              row: true,
            },
            {
              label: '联系人',
              prop: 'linkman',
              span: 12,
              labelWidth: 120,
              search: true,
              searchSpan: 4,
              rules: [{
                required: true,
                message: "请输入联系人",
                trigger: "blur",
              }, ],
            },
            {
              label: '联系方式',
              prop: 'linkPhone',
              span: 12,
              labelWidth: 140,
              rules: [{
                required: true,
                message: "请输入联系方式",
                trigger: "blur",
              }, ],
            },
            {
              label: "项目预算总金额(元)",
              prop: "budgetAmount",
              span: 12,
              hide: true,
              labelWidth: 140,
              type: 'number',
              precision: 2,
              value: '0.00',
            },
            {
              label: "实际预算金额(元)",
              prop: "actualAmount",
              span: 12,
              hide: true,
              labelWidth: 140,
              type: 'number',
              precision: 2,
              value: '0.00',
            },
            {
              label: "自筹金额(元)",
              prop: "selfAmount",
              span: 12,
              hide: true,
              labelWidth: 140,
              type: 'number',
              precision: 2,
              value: '0.00',
            },
            {
              label: "预算应拨付金额(元)",
              prop: "budgetAppropriateAmount",
              span: 12,
              hide: true,
              labelWidth: 140,
              type: 'number',
              precision: 2,
              value: '0.00',
            },
            {
        startTime: '',
        endTime: '',
        reason: '',
        comment: '',
      },
      option: {
        height: "auto",
        calcHeight: 54,
        dialogWidth: 1150,
        tip: false,
        searchShow: true,
        searchMenuSpan: 3,
        menuWidth: 350,
        border: true,
        //stripe:true,
        submitBtn: false,
        emptyBtn: false,
        index: true,
        viewBtn: true,
        selection: true,
        dialogClickModal: false,
        column: [{
          label: "小区",
          prop: "districtId",
          searchSpan: 5,
          search: true,
          type: 'tree',
          dicUrl: `/api/blade-district/district/getDistrictTree`,
          cascader: ['articleId'],
          props: {
            label: "name",
            value: "id"
          },
          defaultExpandedKeys: ["361102003"],
          span: 12,
          labelWidth: 140,
          width: 220,
          overHidden: true,
          rules: [{
            required: true,
            message: "请选择小区",
            trigger: "blur",
          },],
        },
        {
          label: '维修项目名称',
          prop: 'name',
          searchLabelWidth: 120,
          searchSpan: 5,
          search: true,
          span: 12,
          labelWidth: 140,
          rules: [{
            required: true,
            message: "请输入维修项目名称",
            trigger: "blur",
          },],
        },
        {
          label: "预计开工时间",
          prop: "runTime",
          span: 12,
          labelWidth: 140,
          type: "date",
          format: "yyyy-MM-dd",
          valueFormat: "yyyy-MM-dd",
          rules: [{
            required: true,
            message: "请选择合同开始时间",
            trigger: "blur",
          },],
        },
        {
          label: "预计竣工时间",
          prop: "completedTime",
          labelWidth: 140,
          span: 12,
          type: "date",
          format: "yyyy-MM-dd",
          valueFormat: "yyyy-MM-dd",
          rules: [{
            required: true,
            message: "请选择合同结束时间",
            trigger: "blur",
          },],
        },
        {
          label: "项目分摊方式",
          prop: "allocationWay",
          labelWidth: 140,
          value: '按建筑面积分摊',
          span: 12,
          row: true,
        },
        {
          label: '联系人',
          prop: 'linkman',
          span: 12,
          labelWidth: 140,
          search: true,
          searchSpan: 4,
          rules: [{
            required: true,
            message: "请输入联系人",
            trigger: "blur",
          },],
        },
        {
          label: '联系方式',
          prop: 'linkPhone',
          span: 12,
          labelWidth: 140,
          rules: [{
            required: true,
            message: "请输入联系方式",
            trigger: "blur",
          },],
        },
        {
          label: "项目预算总金额(元)",
          prop: "budgetAmount",
          span: 12,
          hide: true,
          labelWidth: 140,
          type: 'number',
          precision: 2,
          value: '0.00',
        },
        {
          label: "实际预算金额(元)",
          prop: "actualAmount",
          span: 12,
          hide: true,
          labelWidth: 140,
          type: 'number',
          precision: 2,
          value: '0.00',
        },
        {
          label: "自筹金额(元)",
          prop: "selfAmount",
          span: 12,
          hide: true,
          labelWidth: 140,
          type: 'number',
          precision: 2,
          value: '0.00',
        },
        {
          label: "预算应拨付金额(元)",
          prop: "budgetAppropriateAmount",
          span: 12,
          hide: true,
          labelWidth: 140,
          type: 'number',
          precision: 2,
          value: '0.00',
        },
        {
          display: false,
          hide: true,
          parent: false,
@@ -271,7 +299,7 @@
          width: 260,
          rules: [{
            required: true,
            message: "请选择议事",
            message: "请选择投票结果",
            trigger: "blur",
          },],
          change: (val) => {
@@ -281,171 +309,242 @@

          }
        },
            {
              label: "项目摘要",
              span: 24,
              hide: true,
              prop: "projectDigest",
              placeholder: "例如:“XX小区XX栋XX设施设备维修，总的预算金额是X，是否含有审价，本次维修涉及范围共XX户，总面积的建筑面积为XX平方米”",
              labelWidth: 140,
              type: "textarea",
            },
            {
              label: "项目进度描述",
              span: 24,
              hide: true,
              prop: "projectDescribe",
              labelWidth: 140,
              type: "textarea",
            },
            // {
            //   label: "批复意见",
            //   span: 24,
            //   hide: true,
            //   prop: "comment",
            //   labelWidth: 140,
            //   type: "textarea",
            //   rules: [{
            //     required: true,
            //     message: "请输入批复意见",
            //     trigger: "blur",
            //   }, ],
            // },
            {
              label: '施工方案附件',
              prop: 'constructionSchemeUrls',
              type: 'upload',
              span: 24,
              hide: true,
              labelWidth: 140,
              multiple: true,
              // showFileList: true,
              propsHttp: {
                res: 'data',
                name: "originalName",
                url: "link"
              },
              action: '/api/blade-resource/oss/endpoint/put-file-attach',
              rules: [{
                required: true,
                message: "请上传施工方案",
                trigger: "blur",
              }, ],
            }
          ],
        }
      }
    },
    created() {
      this.init();
    },
    beforeRouteUpdate(to, from, next) {
      // 在当前路由改变，但是该组件被复用时调用
      // 举例来说，对于一个带有动态参数的路径 /foo/:id，在 /foo/1 和 /foo/2 之间跳转的时候
      // 由于会渲染同样的 Foo 组件，因此组件实例会被复用。而这个钩子就会在这个情况下被调用
      // 可以访问组件实例 `this`
      if (to.fullPath !== from.fullPath) {
        next();
        this.init();
      }
    },
    methods: {
      handleSubmit(form, done, loading) {
        if (form.constructionSchemeUrls.length > 0) {
          var urls = []
          var split = form.constructionSchemeUrls.split(",");
          split.forEach(url => {
            var names = url.split("jczz/");
            urls.push(names[1])
          })
          form.constructionSchemeUrls = urls.join(",")
        }
        update(form).then(
          () => {
            this.onLoad(this.page);
            this.$message({
              type: "success",
              message: "操作成功!",
            });
            done();

        {
          display: false,
          span: 24,
          hide: true,
          prop: "vote",
          slot: true,
          label: "投票详情",
          labelWidth: 140,

        },
        {
          label: "项目摘要",
          span: 24,
          hide: true,
          prop: "projectDigest",
          placeholder: "例如:“XX小区XX栋XX设施设备维修，总的预算金额是X，是否含有审价，本次维修涉及范围共XX户，总面积的建筑面积为XX平方米”",
          labelWidth: 140,
          type: "textarea",
        },
        {
          label: "项目进度描述",
          span: 24,
          hide: true,
          prop: "projectDescribe",
          labelWidth: 140,
          type: "textarea",
        },
        // {
        //   label: "批复意见",
        //   span: 24,
        //   hide: true,
        //   prop: "comment",
        //   labelWidth: 140,
        //   type: "textarea",
        //   rules: [{
        //     required: true,
        //     message: "请输入批复意见",
        //     trigger: "blur",
        //   }, ],
        // },
        {
          label: '施工方案附件',
          prop: 'constructionSchemeUrls',
          type: 'upload',
          span: 24,
          hide: true,
          labelWidth: 140,
          multiple: true,
          // showFileList: true,
          propsHttp: {
            res: 'data',
            name: "originalName",
            url: "link"
          },
          (error) => {
            window.console.log(error);
            loading();
          }
        );
      },
      init() {
        this.taskId = this.$route.params.taskId;
        this.processInstanceId = this.$route.params.processInstanceId;
        this.businessId = this.$route.params.businessId;
        historyFlowList(this.processInstanceId).then(res => {
          const data = res.data;
          if (data.success) {
            this.flowList = data.data;
          }
        })
        getPropertyCapitalApply(this.businessId).then(res => {
          const data = res.data;
          if (data.success) {
            this.form = data.data;
          }
        })
      },
      handleAgree() {
        // if (!this.form.comment) {
        //   this.$message.warning('请先填写批复意见');
        //   return;
        // }
        const params = {
          taskId: this.taskId,
          processInstanceId: this.processInstanceId,
          flag: 'ok',
          comment: this.form.comment,
        };
        completeTask(params).then(res => {
          const data = res.data;
          if (data.success) {
            this.$message.success(data.msg);
            this.$router.$avueRouter.closeTag();
            this.$router.push({
              path: `/property/propertyCapitalApply`
            });
          } else {
            this.$message.error(data.msg || '提交失败');
          }
        })
      },
      handleDisagree() {
        this.form.comment = '关闭申请'
        if (!this.form.comment) {
          this.$message.warning('请先填写批复意见');
          return;
          action: '/api/blade-resource/oss/endpoint/put-file-attach',
          rules: [{
            required: true,
            message: "请上传施工方案",
            trigger: "blur",
          },],
        }
        const params = {
          taskId: this.taskId,
          processInstanceId: this.processInstanceId,
          comment: this.form.comment,
        };
        completeTask(params).then(res => {
          const data = res.data;
          if (data.success) {
            this.$message.success(data.msg);
            this.$router.$avueRouter.closeTag();
            this.$router.push({
              path: `/property/propertyCapitalApply`
            });
          } else {
            this.$message.error(data.msg || '提交失败');
          }
        })
        ],
      },
      handleCancel() {
        this.$router.$avueRouter.closeTag();
        this.$router.push({
          path: `/property/todo`
        });
      }
      topictData: [],
      topicTitle: "",
      articleRange: ""
    }
  },


  watch: {
    'form.districtId': {
      handler(newData) {
        const column = this.findObject(this.option.column, "articleId")
        if (newData && this.form.articleId) {
          column.display = true;
        } else {
          column.display = false
        }
      }
    },


    'form.articleId': {
      handler(newData) {
        this.getVoteDetail(this.form.articleId, this.articleRange)
        const column = this.findObject(this.option.column, "vote")
        if (newData) {
          column.display = true;
        } else {
          column.display = false
        }
      }
    },

  },


  created() {
    this.init();
  },
  beforeRouteUpdate(to, from, next) {
    // 在当前路由改变，但是该组件被复用时调用
    // 举例来说，对于一个带有动态参数的路径 /foo/:id，在 /foo/1 和 /foo/2 之间跳转的时候
    // 由于会渲染同样的 Foo 组件，因此组件实例会被复用。而这个钩子就会在这个情况下被调用
    // 可以访问组件实例 `this`
    if (to.fullPath !== from.fullPath) {
      next();
      this.init();
    }
  },
  methods: {
    handleSubmit(form, done, loading) {
      if (form.constructionSchemeUrls.length > 0) {
        var urls = []
        var split = form.constructionSchemeUrls.split(",");
        split.forEach(url => {
          var names = url.split("jczz/");
          urls.push(names[1])
        })
        form.constructionSchemeUrls = urls.join(",")
      }
      update(form).then(
        () => {
          this.onLoad(this.page);
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          done();
        },
        (error) => {
          window.console.log(error);
          loading();
        }
      );
    },
    init() {
      this.taskId = this.$route.params.taskId;
      this.processInstanceId = this.$route.params.processInstanceId;
      this.businessId = this.$route.params.businessId;
      historyFlowList(this.processInstanceId).then(res => {
        const data = res.data;
        if (data.success) {
          this.flowList = data.data;
        }
      })
      getPropertyCapitalApply(this.businessId).then(res => {
        const data = res.data;
        if (data.success) {
          this.form = data.data;
        }
      })
    },
    handleAgree() {
      // if (!this.form.comment) {
      //   this.$message.warning('请先填写批复意见');
      //   return;
      // }
      const params = {
        taskId: this.taskId,
        processInstanceId: this.processInstanceId,
        flag: 'ok',
        comment: this.form.comment,
      };
      completeTask(params).then(res => {
        const data = res.data;
        if (data.success) {
          this.$message.success(data.msg);
          this.$router.$avueRouter.closeTag();
          this.$router.push({
            path: `/property/propertyCapitalApply`
          });
        } else {
          this.$message.error(data.msg || '提交失败');
        }
      })
    },
    handleDisagree() {
      this.form.comment = '关闭申请'
      if (!this.form.comment) {
        this.$message.warning('请先填写批复意见');
        return;
      }
      const params = {
        taskId: this.taskId,
        processInstanceId: this.processInstanceId,
        comment: this.form.comment,
      };
      completeTask(params).then(res => {
        const data = res.data;
        if (data.success) {
          this.$message.success(data.msg);
          this.$router.$avueRouter.closeTag();
          this.$router.push({
            path: `/property/propertyCapitalApply`
          });
        } else {
          this.$message.error(data.msg || '提交失败');
        }
      })
    },
    handleCancel() {
      this.$router.$avueRouter.closeTag();
      this.$router.push({
        path: `/property/todo`
      });
    },

    getVoteDetail(articleId, districtId) {
      let params = {
        level: 1,
        articleId: articleId,
        districtId: districtId
      }
      getLists(1, 10, params).then(res => {
        const data = res.data.data
        if (data.length) {
          this.topictData = data[0].children;
          this.topicTitle = data[0].discussContent;
        }
      })
    },

    openUserPopup(row) {
      this.$refs.DeitDiscussion.openUser(row, 1, [this.form.districtId])
    },
  }
</script>
}
</script>

<style>


.workOrderStyle {
  font-weight: normal;
}
</style>