feat: 1、优化导入 2、部门物品台账查询对接

石广澎

2023-11-29 20913c80c3f5fc8e533cb92b90e6f20bcd68e032

 admin-web/src/views/departmentitem/itemdis/disDetails/edit.vue

@@ -1,111 +1,269 @@
<template>
  <win-sm :title="setting.title" @close="close" :width="'800px'">
    <el-form ref="ruleForm" :model="formData" :rules="rules" class="demo-ruleForm" label-width="100px">
      <el-form-item label="编号" prop="code">
        <el-input disabled v-model="formData.code" clearable maxlength="20" show-word-limit style="width: 100%"/>
      </el-form-item>
      <el-form-item label="仓库名称" prop="name">
        <el-input v-model="formData.name" clearable maxlength="20" show-word-limit style="width: 100%"/>
      </el-form-item>
      <el-form-item label="地址" >
        <el-input v-model="formData.adss" clearable maxlength="20" show-word-limit style="width: 100%"/>
      </el-form-item>
      <el-form-item label="状态" prop="status">
        <el-switch
          v-model="formData.status"
          active-color="#0d997c"
          inactive-color="#C0CCDA">
        </el-switch>
      </el-form-item>
  <el-dialog
      width="1000px"
      :visible="true"
      :top="'15vh'"
      :close-on-click-modal="false"
      :append-to-body="true"
      :destroy-on-close="true"
      @close="close"
  >
    <div slot="title" align="left" class="dialog-title">
      <div
          class="tab-item"
          :class="tabIndex == index ? 'active' : ''"
          v-for="(item, index) in tabs"
          :key="index"
          @click="tabIndex = index"
      >
        {{ item }}
      </div>
    </div>
    <el-form v-show="tabIndex == 0" ref="ruleForm" :model="formData" :rules="rules" class="demo-ruleForm">
      <div v-for="(item, index) in formData.list" :key="index">
        <el-row :gutter="20">
          <el-col :span="6">
            <el-form-item label="规格型号:">
              {{ item.baseGoodModelName }}
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="单位:">
              {{ item.unit }}
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20" v-for="(childItem, childIndex) in item.recordUserInfos" :key="childIndex">
          <el-col :span="6">
            <el-form-item label="分发数量:">
              {{ childItem.count }}
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="使用人:">
              <el-input v-if="childItem.isEdit" v-model="childItem.userName" style="width: 120px"></el-input>
              <span v-else>{{ childItem.userName }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="联系电话:">
              <el-input v-if="childItem.isEdit" v-model="childItem.phone" style="width: 120px"></el-input>
              <span v-else>{{ childItem.phone }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item>
              <span class="edit-text" @click="handleEditItem(childItem)">{{childItem.isEdit?'取消':'修改'}}</span>
            </el-form-item>
          </el-col>
        </el-row>

        <el-divider v-if="index+1<formData.list.length"></el-divider>
      </div>
    </el-form>
    <div slot="footer" align="center" class="dialog-footer">

    <el-form
        v-show="tabIndex == 1"
        ref="ruleForm"
        :model="formData"
        :rules="rules"
        class="demo-ruleForm"
        style="width: 96%"
    >
      <div v-for="(item, index) in list" :key="index">
        <el-row :gutter="20" class="item-header">
          <el-col :span="6">
            <el-form-item label="修改时间:">
              {{ item.updateTime }}
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="修改人:">
              {{ item.updateUserName }}
            </el-form-item>
          </el-col>
        </el-row>
        <el-divider></el-divider>
        <template v-for="(record,i) in item.recordSkuDtoList">
          <el-row :key="i" :gutter="20">
            <el-col :span="6">
              <el-form-item label="规格型号:">
                {{ record.baseGoodModelName }}
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="单位:">
                {{ record.unit }}
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="20" v-for="(use, k) in record.recordUserInfos" :key="k+'_'+i">
            <el-col :span="6">
              <el-form-item label="分发数量:">
                {{ use.num }}
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="使用人:">
                {{ use.useName }}
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="联系电话:">
                <span>{{ use.phone }}</span>
              </el-form-item>
            </el-col>
          </el-row>
<!--          <el-divider v-if="index+1<list.length"></el-divider>-->
          <el-divider></el-divider>
        </template>
      </div>
    </el-form>
    <div v-if="tabIndex == 0" slot="footer" align="center" class="dialog-footer">
      <my-button name="取消" site="form" @click="close"/>
      <my-button name="保存" site="form" @click="save"/>
    </div>
  </win-sm>
  </el-dialog>
</template>

<script>
import winSm from '@/components/win/win-sm'
import myButton from '@/components/myButton/myButton'
import * as finsystenant from '@/api/baseSetting/finsystenant'
import myButton from '@/components/myButton/myButton';
import {useInfoUpdate, useRecord} from "@/api/stock/transfer";

export default {
  components: {winSm, myButton},
  components: {myButton},
  props: {
    setting: {
      type: Object,
      default: () => {
      }
    }
      },
    },
  },
  data() {
    return {
      checkAll: false,
      checkedList: [],
      tabs: ['修改使用人', '使用记录'],
      tabIndex: 0,
      list: [],
      formData: {
        code: '',
        name: '',
        status: true,
        summary: '',
        list: [],
      },
      rules: {
        code: [
          {required: true, message: '请输入机构编号', trigger: 'blur'}
        ],
        name: [
          {required: true, message: '请输入机构名称', trigger: 'blur'}
        ],
        status: [
          {required: true, message: '请选择状态', trigger: 'blur'}
        ]
      }
    }
        code: [{required: true, message: '请输入机构编号', trigger: 'blur'}],
        name: [{required: true, message: '请输入机构名称', trigger: 'blur'}],
        status: [{required: true, message: '请选择状态', trigger: 'blur'}],
      },
    };
  },
  created() {
    if(this.setting.info){
      this.formData = Object.assign({},JSON.parse(this.setting.info))
    }
    useRecord({transferOrderId: this.setting.id}).then((res) => {
      let model = JSON.parse(JSON.stringify(res[0].recordSkuDtoList))
      model.map(m => {
        m.recordUserInfos.map(u => {
          u.baseGoodModelId = m.baseGoodModelId
          u.baseUnit = m.unit
          u.businessId = this.setting.id
          u.count = u.num
          u.tel = u.phone
          u.procureModelId = m.procureModelId
          u.userName = u.useName
          u.isEdit = false
        })
      })
      this.formData.list = model;
      this.list = res
    });
  },
  methods: {
    getEditInfo(id){

    getEditInfo(id) {
    },
    handleEditItem(user) {
      user.isEdit = !user.isEdit;
      if(!user.isEdit){
        console.log(user)
        user.phone = user.tel
        user.userName = user.useName
      }
    },
    close() {
      this.$emit('close')
      this.$emit('close');
    },
    save() {
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          const params = Object.assign({}, this.formData)
          if(this.setting.id){
            // 编辑接口
            finsystenant.edit(params).then(res => {
              if (res) {
                this.$message.success('保存成功！')
                this.close()
                this.$emit('search')
              } else {
                this.$message.error('保存失败')
              }
          let recordInfoList = []
          this.formData.list.map(item=>{
            item.recordUserInfos.map(re=>{
              recordInfoList.push(re)
            })
          }else{
            params.orgId = this.setting.orgId
            finsystenant.add(params).then(res => {
              if (res) {
                this.$message.success('保存成功！')
                this.close()
                this.$emit('search')
              } else {
                this.$message.error('保存失败')
              }
            })
          }
          })
          useInfoUpdate({recordInfoList}).then((res) => {
            this.$message.success('保存成功！');
            this.close();
            this.$emit('search');
          }).catch(()=>{
            this.$message.error('保存失败');
          });
        } else {
          this.$message.error('校验未通过，请检查。')
          this.$message.error('校验未通过，请检查。');
        }
      })
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.dialog-title {
  display: flex;
  align-items: center;

  .tab-item {
    color: #3d3d3d;
    font-size: 16px;
    font-style: normal;
    padding: 0 10px;
    position: relative;
    cursor: pointer;

    &.active::after {
      content: '';
      width: 100%;
      height: 2px;
      background: #409eff;
      position: absolute;
      bottom: -10px;
      left: 0;
    }
  }
}
</script>

.edit-text {
  color: #409eff;
  cursor: pointer;
}

.item-header {
  ::v-deep {
    .el-form-item__label,
    .el-form-item__content {
      font-weight: 700;
    }
  }
}

::v-deep .el-divider--horizontal {
  margin: 10px 0;
}

::v-deep {
  .el-form-item {
    margin-bottom: 5px;
  }
}

.line {
  width: 100%;
  height: 1px;
  margin: 10px 0;
  background: rgba($color: #dcdfe6, $alpha: 0.45);
}
</style>