up

src/views/contract/contractEdit.vue

@@ -0,0 +1,747 @@
+<template>
+  <div>
+    <el-steps :active="step" align-center>
+      <el-step title="选择预算计划">
+      </el-step>
+      <el-step title="新增预算支出事项">
+      </el-step>
+      <el-step title="新增成功">
+      </el-step>
+    </el-steps>
+
+    <div style="margin: 20px;" v-if="step==1">
+      <Input v-model="planSearch" search enter-button="搜 索" placeholder="搜索预算计划.." @on-search="getBudgets" />
+
+      <xy-table :list="plans" :show-index="false" :table-item="planTable" :height="boxheight" style="margin-top: 10px;"
+        ref="editorPlanTable" row-key="id" border default-expand-all
+        :tree-props="{ children: 'notChildren', hasChildren: 'hasChildren' }" @select="selectPlan">
+        <template v-slot:btns>
+          <el-table-column label="使用金额（元）" header-align="center" width="130">
+            <template slot-scope="scope" v-if="scope.row.pid === 0">
+              <Input :value="scope.row.useMoney" @input="planInput($event,scope.row)" />
+            </template>
+          </el-table-column>
+        </template>
+      </xy-table>
+      <div style="display: flex;justify-content: flex-end;">
+        <Page :total="planTotal" show-elevator @on-change="planPageChange" />
+      </div>
+      <div style="text-align: center;">
+        <el-button style="margin-top: 12px;" @click="nextStep">下一步</el-button>
+      </div>
+    </div>
+    <div style="padding: 20px; margin: 20px;background-color: #fff;" v-if="step==2">
+
+      <el-form ref="form" :model="detail" label-width="180px">
+        <el-form-item label="项目名称">
+          <el-input clearable placeholder="请填写项目名称" @change="checkName" v-model="detail.name" style="width: 300px;" />
+        </el-form-item>
+
+
+        <el-form-item label="是否需要签订合同">
+          <el-switch v-model="detail.is_contract" active-text="是" inactive-text="否" :active-value="1"
+            :inactive-value="0" />
+        </el-form-item>
+
+
+        <el-form-item label="是否为简易流程">
+          <el-switch v-model="detail.is_simple" active-text="是" inactive-text="否" :active-value="1"
+            :inactive-value="0" />
+          <span style="flex: 1;text-align: right;">（水电煤等费用付款）</span>
+        </el-form-item>
+
+        <el-form-item label="承包商/供货商" v-if="detail.is_simple">
+          <el-input v-model="detail.supply" placeholder="请填写承包商/供货商" style="width: 300px;" />
+        </el-form-item>
+
+
+        <el-form-item label="项目类型" v-if="!detail.is_simple">
+          <el-select clearable placeholder="请选择项目类型" v-model="detail.type" style="width: 300px;">
+            <el-option v-for="item in [{label:'服务',value:1},{label:'货物',value:2},{label:'工程',value:3}]"
+              :label="item.label" :value="item.value"></el-option>
+          </el-select>
+        </el-form-item>
+
+
+        <el-form-item label="采购形式" v-if="!detail.is_simple">
+
+          <el-select clearable placeholder="请选择采购形式" v-model="detail.methods" style="width: 300px;">
+            <el-option v-for="item in purchaseType" :label="item.value" :value="item.id"></el-option>
+          </el-select>
+        </el-form-item>
+
+
+        <el-form-item label="采购方式" v-if="!detail.is_simple">
+          <el-select clearable placeholder="请选择采购方式" v-model="detail.modality" style="width: 300px;">
+            <el-option v-for="item in purchaseWay" :label="item.value" :value="item.id"></el-option>
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="采购预算价" v-if="!detail.is_simple">
+          <el-input clearable placeholder="请填写采购预算价" v-model="detail.price" style="width: 300px;" />
+        </el-form-item>
+
+
+        <el-form-item label="资金渠道" v-if="!detail.is_simple">
+          <el-select multiple clearable placeholder="请选择资金渠道" v-model="detail.fundingChannels" style="width: 300px;">
+            <el-option v-for="item in moneyWay" :value="item.id" :label="item.value"></el-option>
+          </el-select>
+        </el-form-item>
+
+
+
+
+
+      </el-form>
+
+
+      <div style="text-align: center;">
+        <el-button style="margin-top: 12px;" @click="nextStep">上一步</el-button>
+        <el-button style="margin-top: 12px;" @click="nextStep">提交</el-button>
+      </div>
+    </div>
+
+
+  </div>
+</template>
+
+<script>
+  import {
+    getparameter
+  } from "@/api/system/dictionary";
+  import {
+    editorContract,
+    detailContract,
+    checkContractName,
+    getContract
+  } from '@/api/contract/contract'
+  import {
+    getBudget
+  } from "@/api/budget/budget";
+
+  import {
+    getInfo
+  } from '@/api/user.js'
+  import {
+    Message
+  } from 'element-ui'
+  import {
+    resetSelect
+  } from '@/utils'
+  export default {
+
+    data() {
+      var planPass = (rule, value, callback) => {
+        if (this.detail.isBudget) {
+          if (this.detail.plan.length === 0) {
+            return callback(new Error('必选'))
+          } else {
+            callback()
+          }
+        } else {
+          callback()
+        }
+      }
+      var supplyPass = (rule, value, callback) => {
+        if (this.detail.is_simple) {
+          if (value === '') {
+            callback(new Error('必填'))
+          } else {
+            callback()
+          }
+        } else {
+          callback()
+        }
+      }
+      var typePass = (rule, value, callback) => {
+        if (!this.detail.is_simple) {
+          if (value === '') {
+            callback(new Error('必填'))
+          } else {
+            callback()
+          }
+        } else {
+          callback()
+        }
+      }
+      var methodsPass = (rule, value, callback) => {
+        if (!this.detail.is_simple) {
+          if (value === '') {
+            callback(new Error('必填'))
+          } else {
+            callback()
+          }
+        } else {
+          callback()
+        }
+      }
+      var modalityPass = (rule, value, callback) => {
+        if (!this.detail.is_simple) {
+          if (value === '') {
+            callback(new Error('必填'))
+          } else {
+            callback()
+          }
+        } else {
+          callback()
+        }
+      }
+      var pricePass = (rule, value, callback) => {
+        if (!this.detail.is_simple) {
+          if (value === '') {
+            callback(new Error('必填'))
+          } else {
+            if (/^\d+(\.\d+)?$/.test(value)) {
+              callback()
+            } else {
+              callback(new Error('必须为数字'))
+            }
+          }
+        } else {
+          callback()
+        }
+      }
+      return {
+        purchaseType: [],
+        moneyWay: [],
+        purchaseWay: [],
+        userList: ["ma_sm", "admin", "yu_l", "wang_yx", "li_f", "chen_y"],
+        boxheight: 300,
+        step: 1,
+        user: null,
+        adminEdit: false,
+        isFocus: false,
+        contrantId: '',
+        isShowEditor: false,
+        isShowPlan: false,
+        detail: {},
+        plan: [],
+        options: [{
+          value: 1,
+          label: '待申请'
+        }, {
+          value: 2,
+          label: '流转中'
+        }, {
+          value: 3,
+          label: '已办结'
+        }],
+        rules: {
+          name: [{
+            required: true,
+            message: "必填"
+          }],
+          supply: [{
+            validator: supplyPass,
+            trigger: 'change'
+          }],
+          type: [{
+            validator: typePass,
+            trigger: 'change'
+          }],
+          methods: [{
+            validator: methodsPass,
+            trigger: 'change'
+          }],
+          modality: [{
+            validator: modalityPass,
+            trigger: 'change'
+          }],
+          price: [{
+            validator: pricePass,
+            trigger: 'change'
+          }],
+
+          fundingChannels: [{
+            required: true,
+            message: "必填"
+          }],
+          plan: [{
+            validator: planPass,
+            trigger: 'change'
+          }]
+        },
+        plans: [],
+        planSearch: '',
+        planTable: [{
+            sortable: false,
+            width: 44,
+            type: "selection",
+            selectable: (row, index) => {
+              return row.pid === 0
+            }
+          },
+          {
+            label: "科室",
+            prop: 'plan_department.name',
+            width: 100,
+            align: 'center'
+          },
+          {
+            label: "年份",
+            prop: 'year',
+            width: 80,
+            align: 'center'
+          },
+          {
+            label: "分类",
+            prop: 'type_detail.value',
+            width: 120,
+          },
+          {
+            label: "名称",
+            prop: 'name',
+            align: 'left'
+          },
+          {
+            label: "计划金额",
+            prop: 'money',
+            align: 'right',
+            width: 120,
+          },
+          {
+            label: "实付金额",
+            prop: 'use_money_total',
+            width: 120,
+            align: 'right'
+          },
+          {
+            label: '已用金额',
+            prop: 'has_money_total',
+            width: 120,
+            align: 'right'
+          }
+        ],
+        planTotal: 0,
+
+
+        selections: [],
+        contractSelect: {
+          page: 1,
+          page_size: 10,
+          is_framework: 1
+        },
+        contractList: [],
+        loading: false,
+        contractTable: [{
+            type: "selection",
+            width: 56,
+            align: "center",
+          },
+          {
+            title: "项目名称",
+            key: "name",
+            minWidth: 180,
+            align: "left",
+          },
+          {
+            title: "采购形势",
+            width: 120,
+            render: (h, {
+              row
+            }) => {
+              return h('span', {}, row.purchase_type?.value || "无")
+            }
+          },
+          {
+            title: "项目类型",
+            width: 120,
+            render: (h, {
+              row
+            }) => {
+              let map = new Map([
+                [1, "服务"],
+                [2, "货物"],
+                [3, "工程"]
+              ])
+              return h('span', {}, map.get(row.type))
+            }
+          },
+          {
+            title: "采购方式",
+            width: 120,
+            render: (h, {
+              row
+            }) => {
+              return h('span', {}, row.purchase_way?.value || "无")
+            }
+          }
+        ],
+        contractTotal: 0,
+        isShowContractToContracts: false
+      }
+    },
+    methods: {
+      //获取资金渠道
+      async getMoneyWay() {
+        this.moneyWay = (
+          await getparameter({
+            number: "money_way",
+          })
+        ).detail;
+      },
+      //获取购买方式
+      async getPurchaseWay() {
+        this.purchaseWay = (
+          await getparameter({
+            number: "purchase_way",
+          })
+        ).detail;
+      },
+      //获取购买形式列表
+      async getPurchaseType() {
+        this.purchaseType = (
+          await getparameter({
+            number: "purchase_type",
+          })
+        ).detail;
+      },
+      nextStep() {
+        if (this.step == 1) {
+          this.step = 2;
+        }
+      },
+      //预算计划金额输入
+      planInput(e, row) {
+        if (!/^[0-9]+.?[0-9]*$/.test(e) && e) {
+          Message({
+            type: 'warning',
+            message: '金额格式错误'
+          })
+          row.useMoney = 0
+          return
+        }
+        if (e <= (Number(row.money) - Number(row.use_money_total))) {
+          row.useMoney = e
+          this.plan.forEach(item => {
+            if (item.value.plan_id == row.id) {
+              item.value.use_money = e
+            }
+          })
+          return
+        }
+        Message({
+          type: 'warning',
+          message: '使用金额大于剩余预算'
+        })
+        row.useMoney = 0
+      },
+      //确认计划选择
+      planSelect() {
+        if (this.plan.length === 0) {
+          Message({
+            type: 'warning',
+            message: '选择计划不能为空'
+          })
+          return
+        }
+        for (let item of this.plan) {
+          console.log(item)
+          if (!item.value.use_money) {
+            Message({
+              type: 'warning',
+              message: '金额不能为空'
+            })
+            return
+          }
+        }
+        this.detail.plan = this.plan
+        this.isShowPlan = false
+      },
+      //选择计划
+      selectPlan(sel, row) {
+
+        if (sel) {
+
+          let select = sel.map(item => {
+            return {
+              label: item.name,
+              value: {
+                plan_id: item.id,
+                use_money: item.useMoney,
+                new_money: item.money
+              }
+            }
+          })
+
+          this.plan = [...this.detail.plan, ...select]
+        } else {
+          this.plan = this.detail.plan;
+        }
+      },
+      delPlan(val) {
+        this.detail.plan.map((item, index) => {
+          if (item.value.plan_id === val.value.plan_id) {
+            this.detail.plan.splice(index, 1)
+          }
+        })
+      },
+      //获取预算计划
+      async getBudgets() {
+        let res = await getBudget({
+          name: this.planSearch,
+          page_size: 10,
+          page: this.plansPageIndex,
+          is_tree: 1
+        })
+        this.plans = res.list;
+        this.planTotal = res.list.total || 0;
+
+        var selPlans = [...this.detail.plan, ...this.plan]
+        //let selPlans = this.detail.plan.contact([]);
+
+        console.log(selPlans)
+        this.toggleSelection(selPlans.map(item => {
+          return item.value.plan_id
+        }))
+      },
+      planPageChange(e) {
+        this.plansPageIndex = e
+        this.getBudgets()
+      },
+      //默认选择计划
+      toggleSelection(plans) {
+        var selPlans = [...this.detail.plan, ...this.plan]
+        if (plans) {
+          this.plans.forEach(plan => {
+            if (plans.includes(plan.id)) {
+              plan.useMoney = selPlans[plans.indexOf(plan.id)].value.use_money
+              this.$refs.editorPlanTable.toggleRowSelection(plan)
+            }
+            if (plan.children?.length > 0) {
+              plan.children.forEach(cplan => {
+                if (plans.includes(cplan.id)) {
+                  cplan.useMoney = selPlans[plans.indexOf(cplan.id)].value.use_money
+                  this.$refs.editorPlanTable.toggleRowSelection(cplan)
+                }
+              })
+            }
+          })
+          // this.plans.filter(plan => {
+          //   if (plans.includes(plan.id)) {
+          //     plan.useMoney = selPlans[plans.indexOf(plan.id)].value.use_money
+          //     return true
+          //   }
+          // }).map(row => {
+          //   this.$refs.editorPlanTable.toggleRowSelection(row)
+          // })
+        } else {
+          this.$refs.editorPlanTable.clearSelection()
+        }
+      },
+      async getDetail(id) {
+        let res = await detailContract({
+          id: id
+        })
+        this.contrantId = res.id
+        this.selections = []
+        this.detail = {
+          name: res.name,
+          is_contract: res.is_contract,
+          content: res.content,
+          is_simple: res?.is_simple,
+          date: res.date,
+          req_status: res.req_status,
+          purchase_status: res.purchase_status,
+          join_status: res.join_status,
+          invite_status: res.invite_status,
+          supply: res?.supply,
+          type: res.type,
+          methods: res.purchase_type_id,
+          modality: res.purchase_way_id,
+          fundingChannels: res.money_way_id?.split(',')?.map(item => {
+            return Number(item)
+          }),
+          price: res.plan_price,
+          isBudget: res.is_plan === 1 ? true : false,
+          is_framework: res.is_framework,
+          use_framework_buy: res.use_framework_buy,
+          contract_to_contracts: res.contract_to_contracts,
+          plan: res.plans.map(item => {
+            return {
+              label: item.name,
+              value: {
+                plan_id: item.id,
+                use_money: res.plan_link.filter(item1 => {
+                  return item1.plan_id === item.id
+                })[0].use_money,
+                new_money: item.money
+              }
+            }
+          })
+        }
+        this.plan = this.detail.plan
+      },
+      //y验证合同的名称是否存在重复
+      checkName(e) {
+
+      },
+      editor() {
+        editorContract({
+          id: this.contrantId,
+          type: this.detail.type,
+          is_plan: this.detail.isBudget ? 1 : 0,
+          is_simple: this.detail?.is_simple,
+          content: this.detail?.content,
+          is_contract: this.detail?.is_contract,
+          supply: this.detail?.supply,
+          purchase_type_id: this.detail.methods,
+          purchase_way_id: this.detail.modality,
+          money_way_id: this.detail.fundingChannels.toString(),
+          plan_price: this.detail.price,
+          name: this.detail.name,
+          req_status: this.detail.req_status,
+          purchase_status: this.detail.purchase_status,
+          join_status: this.detail.join_status,
+          invite_status: this.detail.invite_status,
+          date: this.detail.date,
+          contract_plan_links: this.detail.plan.map(item => {
+            return item.value
+          }),
+          is_framework: this.detail.is_framework,
+          use_framework_buy: this.detail.use_framework_buy,
+          contract_to_contracts: this.selections.map(i => {
+            return {
+              contract_id: this.contrantId,
+              to_contract_id: i.id,
+              use_money: i.money
+            }
+          })
+        }).then(res => {
+          this.isShowEditor = false
+          Message({
+            type: 'success',
+            message: "操作成功"
+          })
+          this.$emit('success')
+        })
+      },
+
+
+      //框架合同
+      async getContractToContracts() {
+        const res = await getContract(this.contractSelect)
+        let selectedIds = this.selections.map(i => i.id)
+        this.contractList = res.list.data.map(item => {
+          return {
+            ...item,
+            _checked: !!selectedIds.find(i => i === item.id),
+          }
+        })
+        this.contractTotal = res.list.total
+      },
+      selectionChange(selection) {
+        this.selections = Array.from(
+          new Set(
+            selection
+          )
+        );
+      },
+      delSelections(val) {
+        this.selections.map((item, index) => {
+          if (item.id === val.id) {
+            this.selections.splice(index, 1)
+          }
+        })
+      },
+    },
+    computed: {
+
+    },
+    created() {
+      this.getBudgets();
+      this.getMoneyWay();
+      this.getPurchaseType();
+      this.getPurchaseWay();
+      this.boxheight = document.documentElement.clientHeight - 400;
+    },
+    watch: {
+      isShowContractToContracts(val) {
+        if (val) {
+          this.getContractToContracts();
+        } else {
+          this.contractSelect = {
+            page: 1,
+            page_size: 10,
+            is_framework: 1,
+          }
+          this.contractList = [];
+          this.contractTotal = 0;
+        }
+      }
+    },
+    mounted() {
+      let that = this;
+      getInfo().then(response => {
+        console.log(response)
+        this.user = response;
+
+        if (that.userList.indexOf(response.username) != -1) {
+
+          that.adminEdit = true;
+        }
+
+      }).catch(error => {})
+
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .contract-add-plan {
+    min-height: 30px;
+    border: 1px solid #dcdee2;
+    border-radius: 4px;
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    align-content: center;
+
+    padding: 0 8px;
+
+    &-no-plan {
+      height: 30px;
+      line-height: 30px;
+      color: #CDD0D5;
+    }
+  }
+
+  .xy-table-item-label {
+    width: 200px;
+  }
+
+  .xy-table-item-price {
+    position: relative;
+
+    &::after {
+      z-index: 1;
+      position: absolute;
+      right: 0;
+      top: 0;
+      content: '（元）'
+    }
+
+    ::v-deep .el-input__clear {
+      position: relative;
+      right: 30px;
+      z-index: 2;
+    }
+  }
+
+  .xy-table-item-price-wan {
+    position: relative;
+
+    &::after {
+      position: absolute;
+      right: 0;
+      top: 0;
+      content: '（万元）'
+    }
+
+    ::v-deep .el-input__clear {
+      position: relative;
+      right: 46px;
+      z-index: 2;
+    }
+  }
+</style>