Lou
2024-02-26 48dc8c0d856526929172913e2fc53e66776add8b
src/views/property/process/maintenanceFundApply/handle.vue
@@ -25,7 +25,7 @@
                <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>
@@ -62,358 +62,401 @@
</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"
  import website from '@/config/website'
import {
  getList,
  remove,
  update,
  add,
  getPropertyCapitalApply
} from "@/api/property/propertyCapitalApply"
import {
  completeTask
} from "@/api/work/work"
import website from '@/config/website'
  export default {
    data() {
      return {
        taskId: '',
        businessId: '',
        processInstanceId: '',
        src: '',
        flowList: [],
        form: {
          flow: {
            assigneeName: '',
          },
          startTime: '',
          endTime: '',
          reason: '',
export default {
  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",
              }, ],
              disabled: true
            },
            {
              label: '维修项目名称',
              prop: 'name',
              searchLabelWidth: 120,
              searchSpan: 5,
              search: true,
              span: 12,
              labelWidth: 140,
              rules: [{
                required: true,
                message: "请输入维修项目名称",
                trigger: "blur",
              }, ],
              disabled: true
            },
            {
              label: "预计开工时间",
              prop: "runTime",
              span: 12,
              labelWidth: 140,
              type: "date",
              format: "yyyy-MM-dd",
              valueFormat: "yyyy-MM-dd",
              rules: [{
                required: true,
                message: "请选择合同开始时间",
                trigger: "blur",
              }, ],
              disabled: true
            },
            {
              label: "预计竣工时间",
              prop: "completedTime",
              labelWidth: 140,
              span: 12,
              type: "date",
              format: "yyyy-MM-dd",
              valueFormat: "yyyy-MM-dd",
              rules: [{
                required: true,
                message: "请选择合同结束时间",
                trigger: "blur",
              }, ],
              disabled: true
            },
            {
              label: "项目分摊方式",
              prop: "allocationWay",
              labelWidth: 140,
              value: '按建筑面积分摊',
              span: 12,
              row: true,
              disabled: true
            },
            {
              label: '联系人',
              prop: 'linkman',
              span: 12,
              labelWidth: 120,
              search: true,
              searchSpan: 4,
              rules: [{
                required: true,
                message: "请输入联系人",
                trigger: "blur",
              }, ],
              disabled: true
            },
            {
              label: '联系方式',
              prop: 'linkPhone',
              span: 12,
              labelWidth: 140,
              rules: [{
                required: true,
                message: "请输入联系方式",
                trigger: "blur",
              }, ],
              disabled: true
            },
            {
              label: "项目预算总金额(元)",
              prop: "budgetAmount",
              span: 12,
              hide: true,
              labelWidth: 140,
              type: 'number',
              precision: 2,
              value: '0.00',
              disabled: true
            },
            {
              label: "实际预算金额(元)",
              prop: "actualAmount",
              span: 12,
              hide: true,
              labelWidth: 140,
              type: 'number',
              precision: 2,
              value: '0.00',
              disabled: true
            },
            {
              label: "自筹金额(元)",
              prop: "selfAmount",
              span: 12,
              hide: true,
              labelWidth: 140,
              type: 'number',
              precision: 2,
              value: '0.00',
              disabled: true
            },
            {
              label: "预算应拨付金额(元)",
              prop: "budgetAppropriateAmount",
              span: 12,
              hide: true,
              labelWidth: 140,
              type: 'number',
              precision: 2,
              value: '0.00',
              disabled: true
            },
            {
              label: "项目摘要",
              span: 24,
              hide: true,
              prop: "projectDigest",
              placeholder: "例如:“XX小区XX栋XX设施设备维修,总的预算金额是X,是否含有审价,本次维修涉及范围共XX户,总面积的建筑面积为XX平方米”",
              labelWidth: 140,
              type: "textarea",
              disabled: true
            },
            {
              label: "项目进度描述",
              span: 24,
              hide: true,
              prop: "projectDescribe",
              labelWidth: 140,
              type: "textarea",
              disabled: true
            }, {
              label: "批复意见",
              span: 24,
              hide: true,
              prop: "comment",
              labelWidth: 140,
              type: "textarea",
              rules: [{
                required: true,
                message: "请输入批复意见",
                trigger: "blur",
              }, ],
            },
            {
              label: '施工方案附件',
              prop: 'constructionSchemeUrls',
              type: 'upload',
              listType: 'picture-img',
              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: {
      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) {
            data.data.constructionSchemeUrls = website.minioUrl + data.data.constructionSchemeUrls
            this.form = data.data
          }
        })
        startTime: '',
        endTime: '',
        reason: '',
      },
      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/todo`
            })
          } else {
            this.$message.error(data.msg || '提交失败')
      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: 120,
          width: 220,
          overHidden: true,
          rules: [{
            required: true,
            message: "请选择小区",
            trigger: "blur",
          },],
          disabled: true
        },
        {
          label: '维修项目名称',
          prop: 'name',
          searchLabelWidth: 120,
          searchSpan: 5,
          search: true,
          span: 12,
          labelWidth: 140,
          rules: [{
            required: true,
            message: "请输入维修项目名称",
            trigger: "blur",
          },],
          disabled: true
        },
        {
          label: "预计开工时间",
          prop: "runTime",
          span: 12,
          labelWidth: 140,
          type: "date",
          format: "yyyy-MM-dd",
          valueFormat: "yyyy-MM-dd",
          rules: [{
            required: true,
            message: "请选择合同开始时间",
            trigger: "blur",
          },],
          disabled: true
        },
        {
          label: "预计竣工时间",
          prop: "completedTime",
          labelWidth: 140,
          span: 12,
          type: "date",
          format: "yyyy-MM-dd",
          valueFormat: "yyyy-MM-dd",
          rules: [{
            required: true,
            message: "请选择合同结束时间",
            trigger: "blur",
          },],
          disabled: true
        },
        {
          label: "项目分摊方式",
          prop: "allocationWay",
          labelWidth: 140,
          value: '按建筑面积分摊',
          span: 12,
          row: true,
          disabled: true
        },
        {
          label: '联系人',
          prop: 'linkman',
          span: 12,
          labelWidth: 120,
          search: true,
          searchSpan: 4,
          rules: [{
            required: true,
            message: "请输入联系人",
            trigger: "blur",
          },],
          disabled: true
        },
        {
          label: '联系方式',
          prop: 'linkPhone',
          span: 12,
          labelWidth: 140,
          rules: [{
            required: true,
            message: "请输入联系方式",
            trigger: "blur",
          },],
          disabled: true
        },
        {
          label: "项目预算总金额(元)",
          prop: "budgetAmount",
          span: 12,
          hide: true,
          labelWidth: 140,
          type: 'number',
          precision: 2,
          value: '0.00',
          disabled: true
        },
        {
          label: "实际预算金额(元)",
          prop: "actualAmount",
          span: 12,
          hide: true,
          labelWidth: 140,
          type: 'number',
          precision: 2,
          value: '0.00',
          disabled: true
        },
        {
          label: "自筹金额(元)",
          prop: "selfAmount",
          span: 12,
          hide: true,
          labelWidth: 140,
          type: 'number',
          precision: 2,
          value: '0.00',
          disabled: true
        },
        {
          label: "预算应拨付金额(元)",
          prop: "budgetAppropriateAmount",
          span: 12,
          hide: true,
          labelWidth: 140,
          type: 'number',
          precision: 2,
          value: '0.00',
          disabled: true
        },
        {
          display: false,
          hide: true,
          parent: false,
          label: "投票结果",
          prop: "articleId",
          search: false,
          viewDisabled: false,
          type: 'select',
          dicUrl: `/api/blade-article/article/getArticleByDistrictId?type=4&eventType=1&districtIdList={{districtId}}`,
          // slot: true,
          formslot: true,
          cascader: ['vote'],
          props: {
            label: "title",
            value: "id"
          },
          defaultExpandedKeys: ["361102003"],
          span: 12,
          width: 260,
          rules: [{
            required: true,
            message: "请选择议事",
            trigger: "blur",
          },],
          change: (val) => {
            console.log("val===>", val)
            // console.log("form===>",this.form)
          }
        })
      },
      handleDisagree() {
        if (!this.form.comment) {
          this.$message.warning('请先填写批复意见')
          return
        },
        {
          label: "项目摘要",
          span: 24,
          hide: true,
          prop: "projectDigest",
          placeholder: "例如:“XX小区XX栋XX设施设备维修,总的预算金额是X,是否含有审价,本次维修涉及范围共XX户,总面积的建筑面积为XX平方米”",
          labelWidth: 140,
          type: "textarea",
          disabled: true
        },
        {
          label: "项目进度描述",
          span: 24,
          hide: true,
          prop: "projectDescribe",
          labelWidth: 140,
          type: "textarea",
          disabled: true
        }, {
          label: "批复意见",
          span: 24,
          hide: true,
          prop: "comment",
          labelWidth: 140,
          type: "textarea",
          rules: [{
            required: true,
            message: "请输入批复意见",
            trigger: "blur",
          },],
        },
        {
          label: '施工方案附件',
          prop: 'constructionSchemeUrls',
          type: 'upload',
          listType: 'picture-img',
          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",
          },],
        }
        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/todo`
            })
          } else {
            this.$message.error(data.msg || '提交失败')
          }
        })
      },
      handleCancel() {
        this.$router.$avueRouter.closeTag()
        this.$router.push({
          path: `/property/todo`
        })
        ],
      }
    }
  },
  'form.districtId': {
    handler(newData) {
      const column = this.findObject(this.option.column, "articleId")
      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: {
    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) {
          data.data.constructionSchemeUrls = website.minioUrl + data.data.constructionSchemeUrls
          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/todo`
          })
        } else {
          this.$message.error(data.msg || '提交失败')
        }
      })
    },
    handleDisagree() {
      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/todo`
          })
        } else {
          this.$message.error(data.msg || '提交失败')
        }
      })
    },
    handleCancel() {
      this.$router.$avueRouter.closeTag()
      this.$router.push({
        path: `/property/todo`
      })
    }
  }
}
</script>
<style scoped>
  .container {
    position: relative;
    /* 确保按钮相对于该元素定位 */
  }
.container {
  position: relative;
  /* 确保按钮相对于该元素定位 */
}
  #myButton {
    position: fixed;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
  }
#myButton {
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}
</style>