修改

zhouwx

2025-09-17 28cf6fc4ded0524afc5e363cd717bf7a1d26ba7f

修改

 public/afterSalesExample.docx

Binary files differ

 public/contractChangeExample.docx

Binary files differ

 public/customerCommunicateExample.docx

Binary files differ

 public/customerListExample.docx

Binary files differ

 public/customerNeedExample.docx

Binary files differ

 public/monthRecordExample.docx

Binary files differ

 src/api/customerList/index.js

New file
@@ -0,0 +1,32 @@
import request from "@/utils/request";

export function getCustomer(params) {
    return request({
        url: '/market/inventory/list',
        method: 'get',
        params: params
    })
}

export function addCustomer(data) {
    return request({
        url: '/market/inventory/insert',
        method: 'post',
        data: data
    })
}

export function editCustomer(params) {
    return request({
        url: `/market/inventory/update`,
        method: 'post',
        data: params
    })
}

export function delCustomer(data) {
    return request({
        url: `/market/inventory/deleted?customerId=${data}`,
        method: 'get'
    })
}

 src/api/customerNeed/index.js

New file
@@ -0,0 +1,32 @@
import request from "@/utils/request";

export function getCustomerNeed(params) {
    return request({
        url: '/market/record/list',
        method: 'get',
        params: params
    })
}

export function addCustomerNeed(data) {
    return request({
        url: '/market/record/insert',
        method: 'post',
        data: data
    })
}

export function editCustomerNeed(params) {
    return request({
        url: `/market/record/update`,
        method: 'post',
        data: params
    })
}

export function delCustomerNeed(data) {
    return request({
        url: `/market/record/deleted?recordId=${data}`,
        method: 'get'
    })
}

 src/views/work/marketingManagement/afterSales/components/editDialog.vue

New file
@@ -0,0 +1,420 @@
<template>
  <div class="notice">
    <el-dialog
        v-model="dialogVisible"
        :title="title"
        width="900px"
        :before-close="handleClose"
        :close-on-press-escape="false"
        :close-on-click-modal="false"
    >
      <el-form :model="state.form" size="default" ref="busRef" :rules="state.rules"  label-position="right" label-width="170">
        <el-row :gutter="24">
          <el-col :span="24">
            <el-form-item label="企业名称:" prop="companyId" v-if="state.isAdmin">
              <el-select v-model="state.form.companyId" placeholder="请选择" filterable clearable style="width: 100%" :disabled="title == '查看' || title == '编辑' || !state.isAdmin" @change="selectValueCom">
                <el-option
                    v-for="item in state.companyList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="12">
            <el-form-item label="记录名称:" prop="year" >
              <el-input  :disabled="title === '查看'" v-model="state.form.name" placeholder="记录名称"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="编号:" prop="year" >
              <el-input  :disabled="title === '查看'" v-model="state.form.name" placeholder="编号"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="12">
            <el-form-item label="客户名称:" prop="year" >
              <el-input  :disabled="title === '查看'" v-model="state.form.name" placeholder="客户单位/姓名"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="服务时间:" prop="year" >
              <el-date-picker
                  v-model="state.form.fictionTime"
                  type="date"
                  value-format="YYYY-MM-DD"
                  placeholder="请选择服务时间"
                  style="width: 100%"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="24">
            <el-form-item label="地址:" prop="year" >
              <el-input  :disabled="title === '查看'" type="textarea"  v-model="state.form.name" placeholder="地址"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="12">
            <el-form-item label="联系人:" prop="year" >
              <el-input  :disabled="title === '查看'" v-model="state.form.name" placeholder="联系人"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="联系电话:" prop="year" >
              <el-input  :disabled="title === '查看'" v-model="state.form.name" placeholder="联系电话"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="24">
            <el-form-item label="本次服务内容:" prop="year" >
              <el-input  :disabled="title === '查看'" type="textarea" :rows="4" v-model="state.form.name" placeholder=""></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="24">
            <el-form-item label="对客户的使用建议:" prop="year" >
              <el-input  :disabled="title === '查看'" type="textarea" :rows="4" v-model="state.form.name" placeholder=""></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24" style="margin-top: 10px">
          <el-col :span="12">
            <el-form-item label="服务人员:" prop="year" >
              <el-select clearable v-model="state.form.fictionId" :disabled="state.title =='查看'" filterable placeholder="" style="width: 100%">
                <el-option
                    v-for="item in state.peopleList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="联系电话:" prop="year" >
              <el-input  :disabled="title === '查看'" v-model="state.form.name" placeholder="联系电话"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="24">
            <el-form-item label="您对本次服务的评价:" prop="year" >
              <el-radio-group v-model="state.form.type">
                <el-radio :label="1">非常满意</el-radio>
                <el-radio :label="2">满意</el-radio>
                <el-radio :label="3">不满意</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="24">
            <el-form-item label="您对本公司产品质量的意见:" prop="year" >
              <el-input  :disabled="title === '查看'" type="textarea" :rows="4" v-model="state.form.name" placeholder=""></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="24">
            <el-form-item label="客户:" prop="year" >
              <el-input  :disabled="title === '查看'"  v-model="state.form.name" placeholder=""></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <template #footer v-if="title !== '查看'">
        <span class="dialog-footer">
            <el-button @click="handleClose" size="default">取 消</el-button>
            <el-button type="primary"  @click="onSubmit" size="default" v-preReClick>确认</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>
<script setup>
import {onMounted, reactive, ref, toRefs} from 'vue'
import Cookies from "js-cookie";
import {getCompany} from "@/api/onlineEducation/company";
import {ElMessage} from "element-plus";
import {getUser} from "@/api/onlineEducation/user";
import {getDept, getObject, getObjectPage} from "@/api/qualityObjectives/object";
import {addTable, editTable, getTargetById} from "@/api/qualityObjectives/table";
import {addNeedDiscren, editNeedDiscren} from "@/api/need/need";

const dialogVisible = ref(false);
const title = ref("");
const busRef = ref();
const length = ref()
const selectPopperClass = "max-width-select";
const emit = defineEmits(["getList"]);
const dataRef = ref();
const state = reactive({
  form: {
    id: '',
    companyId: null,
    deptId: null,
    year: '',
    fictionId: null,
    checkId: null,
    ratifyId: null,
    fictionTime: null,
    frequency: '',
    expectContents:[],
  },
  rules: {
    companyId: [{ required: true, message: '请选择企业', trigger: 'blur' }],
    deptId: [{ required: true, message: '请选择部门', trigger: 'blur' }],
    year: [{ required: true, message: '请选择年份', trigger: 'blur' }],
    fictionId: [{ required: true, message: '请选择编制人', trigger: 'blur' }],
    ratifyId: [{ required: true, message: '请选择批准人', trigger: 'blur' }],
    checkId: [{ required: true, message: '请选择审核人', trigger: 'blur' }],
    fictionTime: [{ required: true, message: '请选择日期', trigger: 'blur' }],
    frequency: [{ required: true, message: '请输入监测频率', trigger: 'blur' }],
    stakeholder: [{required: true, message: "", trigger: "blur"}],
    expectation: [{required: true, message: "", trigger: "blur"}],
    solutions: [{required: true, message: "", trigger: "blur"}],
    expectContents:[{ required: true, message: '请填写相关方期望或要求识别表', trigger: 'blur' }],
  },
  peopleList: [],
  isAdmin: false,
  companyList: [],
  deptList: [],
  checkMethodList: [],
  methodsList: [
    {
      id: 1,
      name: '面谈'
    },
    {
      id: 2,
      name: '面谈'
    },
    {
      id: 3,
      name: '信函'
    },
    {
      id: 4,
      name: '邮件'
    },
    {
      id: 5,
      name: '其他:'
    },
  ],
  checkTypeList: [],
  typeList: [
    {
      id: 1,
      name: '建议'
    },
    {
      id: 2,
      name: '咨询'
    },
    {
      id: 3,
      name: '反馈'
    },
    {
      id: 4,
      name: '抱怨'
    },
    {
      id: 5,
      name: '其他:'
    },
  ]
})

onMounted(() => {


});
const openDialog = async (type, value,companyList) => {
  const userInfo = JSON.parse(Cookies.get('userInfo'))
  state.isAdmin = userInfo.userType === 0;
  state.form.companyName = userInfo.companyName
  state.form.companyId = userInfo.companyId
  if(state.isAdmin){
    state.form.companyId = value.companyId
    state.form.companyName = value.companyName
    state.companyList = companyList
  }
  title.value = type === 'add' ? '新增' : type ==='edit' ? '编辑' : '查看' ;
  if(type === 'edit' || type === 'review') {
    state.form = JSON.parse(JSON.stringify(value));
    if(state.isAdmin){
      state.form.companyId = value.companyId
      state.form.companyName = value.companyName
    }
  }
  await getDeptList()
  await getPeopleList()
  dialogVisible.value = true;
}
const onSubmit = async () => {
  console.log('state.form',state.form)
  const valid = await busRef.value.validate();
  if(valid){
    if(title.value === '新增'){
      // console.log('sta',state.form)
      // const {id, ...data} = JSON.parse(JSON.stringify(state.form))
      // const res = await addNeedDiscren(data)
      // if(res.code === 200){
      //   ElMessage({
      //     type: 'success',
      //     message: '新增成功'
      //   });
      // }else{
      //   ElMessage.warning(res.message)
      // }
      // emit("getList")
      // busRef.value.clearValidate();
      // reset();
      // dialogVisible.value = false;
    }else if(title.value === '编辑'){
      const {...data} = JSON.parse(JSON.stringify(state.form))
      const res = await editNeedDiscren(data)
      if(res.code === 200){
        ElMessage({
          type: 'success',
          message: '编辑成功'
        });
      }else{
        ElMessage.warning(res.message)
      }
      emit("getList")
      busRef.value.clearValidate();
      reset();
      dialogVisible.value = false;
    }
  }
}
const getDeptList = async () => {
  if(state.isAdmin && (state.form.companyId == 0 || state.form.companyId == null)){
    return
  }
  const param = {
    pageNum: 1,
    pageSize: 999,
    companyId: state.form.companyId
  }
  const res = await getDept(param)
  if(res.code === 200){
    state.deptList = res.data
  }
}
const getPeopleList = async ()=> {
  if(state.isAdmin && (state.form.companyId == 0 || state.form.companyId == null)){
    return
  }
  const queryParams = {
    pageNum: 1,
    pageSize: 9999,
    companyId: state.form.companyId
  }
  const res = await getUser(queryParams)
  if(res.code == 200){
    state.peopleList = res.data.list?res.data.list:[]
  }else{
    ElMessage.warning(res.message)
  }
};
const handleClose = () => {
  busRef.value.clearValidate();
  reset();
  dialogVisible.value = false;
  emit("getList")

}
const reset = () => {
  state.form = {
    id: '',
    companyId: null,
    deptId: null,
    year: '',
    fictionId: null,
    checkId: null,
    ratifyId: null,
    fictionTime: null,
    frequency: '',
    expectContents:[],
  }
  state.companyList = []
}


const changeCheck = (type) => {
  switch (type) {
    case 'type': state.form.qualification = state.checkTypeList.join(','); if(!state.checkTypeList.includes(8))state.form.otherQualifi = '' ;break;
    case 'method': state.form.product = state.checkMethodList.join(',');if(!state.checkMethodList.includes(5))state.form.otherProduct = ''; break;
  }

}


const selectValueCom = (val) => {
  state.form.fictionId = null
  state.form.checkId = null
  state.form.ratifyId = null
  state.form.deptId = null
  state.companyList.forEach(item => {
    if(item.name === val){
      state.form.companyId = item.id
    }
  })
  getDeptList()
  getPeopleList()
}


const addTableData = () => {
  state.form.expectContents.push({expectContentMesses: [{}]})
}
const addObject = (val,itemIndex) => {
  state.form.expectContents.forEach((item,index) => {
    if(index == itemIndex){
      item.expectContentMesses.push({})
    }
  })
}
const delObject = (val,itemIndex) => {
  state.form.expectContents.forEach((item,index) => {
    if(index == itemIndex){
      if(item.expectContentMesses.length == 1){
        state.form.expectContents.splice(index,1)
      }else {
        item.expectContentMesses.pop()
      }
    }
  })
}

defineExpose({
  openDialog
});

</script>

<style scoped lang="scss">
.notice{
  :deep(.el-form .el-form-item__label) {
    font-size: 15px;
  }
  .file {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
}
</style>

 src/views/work/marketingManagement/afterSales/index.vue

New file
@@ -0,0 +1,235 @@
<template>
  <div class="app-container">
    <div style="margin-bottom: 10px">
      <el-form style="display: flex;flex-wrap: wrap;">
        <el-form-item>
          <el-button
              type="primary"
              plain
              icon="Plus"
              @click="openDialog('add',{})"
          >新增</el-button>
        </el-form-item>
        <el-form-item label="企业名称:" v-if="data.isAdmin" style="margin-left: 20px">
          <el-select v-model="data.queryParams.companyId" placeholder="请选择" filterable clearable>
            <el-option
                v-for="item in data.companyList"
                :key="item.id"
                :label="item.name"
                :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" style="margin-left: 30px" @click="searchClick">查询</el-button>
          <el-button plain @click="reset">重置</el-button>
        </el-form-item>
        <el-form-item style="margin-left: 15px">
          <el-button
              type="primary"
              @click="exportData"
          >导出</el-button>
        </el-form-item>
      </el-form>
    </div>
    <!-- 表格数据 -->
    <el-table v-loading="loading" :data="dataList" :border="true"  @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" />
      <el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
      <el-table-column label="售后服务记录" prop="name"  align="center">
      </el-table-column>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="160">
        <template #default="scope">
          <el-button link type="primary"  @click="openDialog('review',scope.row)" >查看</el-button>
          <el-button link type="primary"  @click="openDialog('edit',scope.row)" >编辑</el-button>
          <el-button link type="danger"  @click="handleDelete(scope.row)" >删除</el-button>
        </template>
      </el-table-column>
    </el-table>

    <div class="pag-container">
      <el-pagination
          v-model:current-page="data.queryParams.pageNum"
          v-model:page-size="data.queryParams.pageSize"
          :page-sizes="[10,15,20,25]"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
      />
    </div>
    <editDialog ref="noticeRef" @getList = "getList"></editDialog>
  </div>
</template>

<script setup>
import {getCurrentInstance, onMounted, reactive, ref, toRefs} from "vue";
import editDialog from "./components/editDialog.vue"
import {ElMessage, ElMessageBox} from "element-plus";
import {getCompany} from "@/api/onlineEducation/company";
import Cookies from "js-cookie";
import {generateWordDocument} from "@/utils/exportWord";
import {delTable, getTable} from "@/api/qualityObjectives/table";
import {delNeedDiscren, getNeedDiscren} from "@/api/need/need";
const { proxy } = getCurrentInstance();
const loading = ref(false);
const noticeRef = ref();
const deptRef = ref()
const loadingCompany = ref(false)
const choosedData = ref([])
const data = reactive({
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    companyId: null,
    year: '',
    type: ''
  },
  companyList: [],
  isAdmin: false,
  dialogVisible: false,
});
const dataList = ref([]);
const total = ref(0);

const { queryParams } = toRefs(data);

onMounted(() => {
  const userInfo = JSON.parse(Cookies.get('userInfo'))
  console.log("userInfo",userInfo)
  data.isAdmin = userInfo.userType === 0;
  if(data.isAdmin){
    data.queryParams.companyId = null
  }else {
    data.queryParams.companyId = userInfo.companyId
  }
  getList();
  if(data.isAdmin){
    getCompanyList()
  }
});
const getList = async () => {
  // loading.value = true;
  // const res = await getNeedDiscren(data.queryParams);
  // if(res.code === 200){
  //   dataList.value = res.data.list
  //   total.value = res.data.total
  // }else{
  //   ElMessage.warning(res.message)
  // }
  // loading.value = false;
  dataList.value = [{}]
}

const searchClick = () => {
  getList();
}

const openDialog = (type, value) => {
  noticeRef.value.openDialog(type, value,data.companyList);
}

const getCompanyList = async ()=>{
  const queryParams = {
    pageNum: 1,
    pageSize: 999
  }
  const res = await getCompany(queryParams)
  if (res.code == 200) {
    data.companyList = res.data.list?res.data.list:[]
  } else {
    ElMessage.warning(res.message)
  }
}

const handleSizeChange = (val) => {
  data.queryParams.pageSize = val
  getList()
}
const handleCurrentChange = (val) => {
  data.queryParams.pageNum = val
  getList()
}
const handleClose = () => {
  data.dialogVisible = false
}

/** 重置新增的表单以及其他数据  */
function reset() {
  if(data.isAdmin){
    data.queryParams = {
      companyId: '',
      pageNum: 1,
      pageSize: 10,
    }
    choosedData.value = []
    data.companyList = [];
    getCompanyList()
  }else {
    data.queryParams = {
      companyId: data.queryParams.companyId,
      pageNum: 1,
      pageSize: 10,
    }
  }
  getList();

}
const exportData = () => {
  if(choosedData.value && choosedData.value.length === 0){
    ElMessage.warning('请选择需要导出的数据')
  }else {
    startGeneration()
  }
}
const templatePath = ref('/afterSalesExample.docx')
const startGeneration = async () => {
  const data = JSON.parse(JSON.stringify(choosedData.value))
  data.forEach(item => {


    console.log('xxx',item.tableData)
    try {
      generateWordDocument(templatePath.value, item, item.companyName + `_售后服务卡.docx`);
    } catch (error){
      ElMessage({
        type: 'warning',
        message: '导出失败'
      });
    }
  })
}
const handleSelectionChange = (val) => {
  choosedData.value = val
}
const handleDelete = (val) => {
  ElMessageBox.confirm(
      '确定删除此条数据？',
      '提示',
      {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
      .then( async() => {
        const res = await delNeedDiscren(val.id);
        if(res.code === 200){
          ElMessage({
            type: 'success',
            message: '删除成功'
          });
          getList();
        }else{
          ElMessage.warning(res.message)
        }
      })
}


</script>
<style lang="scss">
.pag-container{
  float: right;
  margin-top: 10px;
}
</style>

 src/views/work/marketingManagement/contractManagement/contractChange/components/editDialog.vue

New file
@@ -0,0 +1,549 @@
<template>
  <div class="notice">
    <el-dialog
        v-model="dialogVisible"
        :title="title"
        width="850px"
        :before-close="handleClose"
        :close-on-press-escape="false"
        :close-on-click-modal="false"
    >
      <el-form :model="state.form" size="default" ref="busRef" :rules="state.rules"  label-position="top" label-width="130">
        <el-row :gutter="24">
          <el-col :span="24">
            <el-form-item label="企业名称:" prop="companyId" v-if="state.isAdmin">
              <el-select v-model="state.form.companyId" placeholder="请选择" filterable clearable style="width: 100%" :disabled="title == '查看' || title == '编辑' || !state.isAdmin" @change="selectValueCom">
                <el-option
                    v-for="item in state.companyList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="24">
            <el-form-item label="评审类型:" prop="year" >
              <el-select clearable v-model="state.form.type" :disabled="title =='查看'" filterable>
                <el-option
                    v-for="item in state.typeList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id"
                />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="8">
            <el-form-item label="合同:" prop="year" >
              <el-select clearable v-model="state.form.contractId" :disabled="title =='查看'" filterable>
                <el-option
                    v-for="item in state.contractList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="记录日期:" prop="year" >
              <el-date-picker
                  v-model="state.form.fictionTime"
                  type="date"
                  value-format="YYYY-MM-DD"
                  placeholder="请选择记录日期"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="记录人:" prop="year">
              <el-select clearable v-model="state.form.personId" :disabled="title =='查看'" filterable  style="width: 240px;margin-bottom: 5px">
                <el-option
                    v-for="item in state.peopleList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id"
                />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24" style="margin-bottom: 10px">
          <el-col :span="24">
            <span style="font-weight: 550;font-size: 18px">顾客信息</span>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="8">
            <el-form-item label="名称:" prop="year" >
              <el-input  :disabled="title === '查看'"  v-model="state.form.name" placeholder="名称"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="联系人:" prop="year" >
              <el-input  :disabled="title === '查看'"  v-model="state.form.name" placeholder="联系人"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="电话:" prop="year" >
              <el-input  :disabled="title === '查看'"  v-model="state.form.name" placeholder="电话"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="24">
            <el-form-item label="顾客明示的要求及用途（订货产品信息）：" prop="expectContents" >
              <el-button
                  :disabled="title === '查看'"
                  type="primary"
                  @click="addProductTable"
                  style="margin-left: 10px;margin-bottom: 10px"
              >新增</el-button>
              <div style="display: flex;width: 100%;">
                <el-table :data="state.form.expectContents" :border="true" >
                  <el-table-column type="index" label="序号"  align="center"></el-table-column>
                  <el-table-column label="产品名称" prop="name" align="center" width="150">
                    <template  #default="{row,$index}">
                      <el-form-item :prop="'expectContents.' + '[' + $index + ']' + 'name'" :rules="state.rules.name">
                        <el-input style="margin-top: 10px" :disabled="title === '查看'" type="textarea" :rows="2" v-model="row.name" placeholder="请输入"></el-input>
                      </el-form-item>
                    </template>
                  </el-table-column>
                  <el-table-column label="规格型号" prop="name" align="center" width="150">
                    <template  #default="{row,$index}">
                      <el-form-item :prop="'expectContents.' + '[' + $index + ']' + 'name'" :rules="state.rules.name">
                        <el-input style="margin-top: 10px" :disabled="title === '查看'" type="textarea" :rows="2" v-model="row.name" placeholder="请输入"></el-input>
                      </el-form-item>
                    </template>
                  </el-table-column>
                  <el-table-column label="数量" prop="name" align="center" width="150">
                    <template  #default="{row,$index}">
                      <el-form-item :prop="'expectContents.' + '[' + $index + ']' + 'name'" :rules="state.rules.name">
                        <el-input style="margin-top: 10px" :disabled="title === '查看'" type="textarea" :rows="2" v-model="row.name" placeholder="请输入"></el-input>
                      </el-form-item>
                    </template>
                  </el-table-column>
                  <el-table-column label="单价" prop="name" align="center" width="150">
                    <template  #default="{row,$index}">
                      <el-form-item :prop="'expectContents.' + '[' + $index + ']' + 'name'" :rules="state.rules.name">
                        <el-input style="margin-top: 10px" :disabled="title === '查看'" type="textarea" :rows="2" v-model="row.name" placeholder="请输入"></el-input>
                      </el-form-item>
                    </template>
                  </el-table-column>
                  <el-table-column label="其他" prop="name" align="center" width="150">
                    <template  #default="{row,$index}">
                      <el-form-item :prop="'expectContents.' + '[' + $index + ']' + 'name'" :rules="state.rules.name">
                        <el-input style="margin-top: 10px" :disabled="title === '查看'" type="textarea" :rows="2" v-model="row.name" placeholder="请输入"></el-input>
                      </el-form-item>
                    </template>
                  </el-table-column>
                  <el-table-column label="操作" align="center"  v-if="title !== '查看'" >
                    <template #default="scope">
                      <el-button link type="danger"  @click="delProduct(scope.row,scope.$index)" >删除</el-button>
                    </template>
                  </el-table-column>
                </el-table>

              </div>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="12">
            <el-form-item label="交货期限：" prop="expectContents" >
              <el-date-picker
                  v-model="state.form.fictionTime"
                  type="date"
                  value-format="YYYY-MM-DD"
                  placeholder="请选择记录日期"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="交付方式：" prop="expectContents" >
              <el-input  :disabled="title === '查看'"  v-model="state.form.name" placeholder="交付方式"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="12">
            <el-form-item label="交货地址：" prop="expectContents" >
              <el-input  :disabled="title === '查看'"  v-model="state.form.name" placeholder="交货地址"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="付款方式：" prop="expectContents" >
              <el-input  :disabled="title === '查看'"  v-model="state.form.name" placeholder="付款方式"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="24">
            <el-form-item label="产品和服务要求及其他要求：（或变更内容）：" prop="expectContents" >
              <el-input  :disabled="title === '查看'" type="textarea" :rows="4"  v-model="state.form.name" placeholder=""></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="24">
            <el-form-item label="风险识别：" prop="expectContents" >
              <el-input  :disabled="title === '查看'" type="textarea" :rows="4"  v-model="state.form.name" placeholder=""></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="24">
            <el-form-item :label="state.form.type == 1 ? '评审内容' :'变更内容' " prop="expectContentsX" >
              <el-button
                  :disabled="title === '查看'"
                  type="primary"
                  @click="addContentTable"
                  style="margin-left: 10px;margin-bottom: 10px"
              >新增</el-button>
              <div style="display: flex;width: 100%;">
                <el-table :data="state.form.expectContentsX" :border="true" >
                  <el-table-column type="index" label="序号"  align="center"></el-table-column>
                  <el-table-column :label="state.form.type == 1 ? '评审部门' :'变更部门' " prop="name" align="center" width="150">
                    <template  #default="{row,$index}">
                      <el-form-item :prop="'expectContentsX.' + '[' + $index + ']' + 'name'" :rules="state.rules.name">
                        <el-input style="margin-top: 10px" :disabled="title === '查看'" type="textarea" :rows="4" v-model="row.name" placeholder="请输入"></el-input>
                      </el-form-item>
                    </template>
                  </el-table-column>
                  <el-table-column :label="state.form.type == 1 ? '评审内容(含风险)' :'变更内容(含风险)' " prop="need" align="center" width="150">
                    <template #default="{row,$index}">
                      <div v-for="(i,index) in row.expectContentMessesX" :key="index">
                        <el-form-item :prop="'expectContentsX.' + '[' + $index + '].' +'expectContentMessesX.' + '[' + index + ']' + '.need'" :rules="state.rules.need">
                          <el-input style="margin-top: 10px" :disabled="title === '查看'" type="textarea" :rows="4" v-model="i.need" placeholder="请输入"></el-input>
                        </el-form-item>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column :label="state.form.type == 1 ? '评审意见' :'变更意见' " prop="need" align="center" width="150">
                    <template #default="{row,$index}">
                      <div v-for="(i,index) in row.expectContentMessesX" :key="index">
                        <el-form-item :prop="'expectContentsX.' + '[' + $index + '].' +'expectContentMessesX.' + '[' + index + ']' + '.need'" :rules="state.rules.need">
                          <el-input style="margin-top: 10px" :disabled="title === '查看'" type="textarea" :rows="4" v-model="i.need" placeholder="请输入"></el-input>
                        </el-form-item>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column label="签字" prop="need" align="center" width="150">
                    <template #default="{row,$index}">
                      <div v-for="(i,index) in row.expectContentMessesX" :key="index">
                        <el-form-item :prop="'expectContentsX.' + '[' + $index + '].' +'expectContentMessesX.' + '[' + index + ']' + '.need'" :rules="state.rules.need">
                          <el-input style="margin-top: 10px" :disabled="title === '查看'" type="textarea" :rows="4" v-model="i.need" placeholder="请输入"></el-input>
                        </el-form-item>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column label="操作" align="center"  v-if="title !== '查看'" >
                    <template #default="scope">
                      <el-button link type="primary"  @click="addObject(scope.row,scope.$index)" >添加</el-button>
                      <el-button link type="danger"  @click="delContent(scope.row,scope.$index)" >删除</el-button>
                    </template>
                  </el-table-column>
                </el-table>

              </div>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="24">
            <el-form-item label="审批意见：" prop="expectContents" >
              <el-input  :disabled="title === '查看'" type="textarea" :rows="4"  v-model="state.form.name" placeholder=""></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="12">
            <el-form-item label="法人/委托代理人签字：" prop="expectContents" >
              <el-select clearable v-model="state.form.personId" :disabled="title =='查看'" filterable  style="width: 240px;margin-bottom: 5px">
                <el-option
                    v-for="item in state.peopleList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="日期：" prop="expectContents" >
              <el-date-picker
                  v-model="state.form.fictionTime"
                  type="date"
                  value-format="YYYY-MM-DD"
                  placeholder="请选择记录日期"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <template #footer v-if="title !== '查看'">
        <span class="dialog-footer">
            <el-button @click="handleClose" size="default">取 消</el-button>
            <el-button type="primary"  @click="onSubmit" size="default" v-preReClick>确认</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>
<script setup>
import {onMounted, reactive, ref, toRefs} from 'vue'
import Cookies from "js-cookie";
import {getCompany} from "@/api/onlineEducation/company";
import {ElMessage} from "element-plus";
import {getUser} from "@/api/onlineEducation/user";
import {getDept, getObject, getObjectPage} from "@/api/qualityObjectives/object";
import {addTable, editTable, getTargetById} from "@/api/qualityObjectives/table";
import {addNeedDiscren, editNeedDiscren} from "@/api/need/need";

const dialogVisible = ref(false);
const title = ref("");
const busRef = ref();
const length = ref()
const selectPopperClass = "max-width-select";
const emit = defineEmits(["getList"]);
const dataRef = ref();
const state = reactive({
  form: {
    id: '',
    companyId: null,
    deptId: null,
    year: '',
    fictionId: null,
    checkId: null,
    ratifyId: null,
    fictionTime: null,
    frequency: '',
    expectContents:[],
    expectContentsX: []
  },
  rules: {
    companyId: [{ required: true, message: '请选择企业', trigger: 'blur' }],
    deptId: [{ required: true, message: '请选择部门', trigger: 'blur' }],
    year: [{ required: true, message: '请选择年份', trigger: 'blur' }],
    fictionId: [{ required: true, message: '请选择编制人', trigger: 'blur' }],
    ratifyId: [{ required: true, message: '请选择批准人', trigger: 'blur' }],
    checkId: [{ required: true, message: '请选择审核人', trigger: 'blur' }],
    fictionTime: [{ required: true, message: '请选择日期', trigger: 'blur' }],
    frequency: [{ required: true, message: '请输入监测频率', trigger: 'blur' }],
    stakeholder: [{required: true, message: "", trigger: "blur"}],
    expectation: [{required: true, message: "", trigger: "blur"}],
    solutions: [{required: true, message: "", trigger: "blur"}],
    expectContents:[{ required: true, message: '请填写相关方期望或要求识别表', trigger: 'blur' }],
  },
  peopleList: [],
  isAdmin: false,
  companyList: [],
  deptList: [],
  contractList:[],
  typeList: [
    {
      id: 1,
      name: '合同评审'
    },
    {
      id: 2,
      name: '合同变更'
    }
  ]
})

onMounted(() => {


});
const openDialog = async (type, value,companyList) => {
  const userInfo = JSON.parse(Cookies.get('userInfo'))
  state.isAdmin = userInfo.userType === 0;
  state.form.companyName = userInfo.companyName
  state.form.companyId = userInfo.companyId
  if(state.isAdmin){
    state.form.companyId = value.companyId
    state.form.companyName = value.companyName
    state.companyList = companyList
  }
  title.value = type === 'add' ? '新增' : type ==='edit' ? '编辑' : '查看' ;
  if(type === 'edit' || type === 'review') {
    state.form = JSON.parse(JSON.stringify(value));
    if(state.isAdmin){
      state.form.companyId = value.companyId
      state.form.companyName = value.companyName
    }
  }
  await getDeptList()
  await getPeopleList()
  dialogVisible.value = true;
}
const onSubmit = async () => {
  console.log('state.form',state.form)
  const valid = await busRef.value.validate();
  if(valid){
    if(title.value === '新增'){
      // console.log('sta',state.form)
      // const {id, ...data} = JSON.parse(JSON.stringify(state.form))
      // const res = await addNeedDiscren(data)
      // if(res.code === 200){
      //   ElMessage({
      //     type: 'success',
      //     message: '新增成功'
      //   });
      // }else{
      //   ElMessage.warning(res.message)
      // }
      // emit("getList")
      // busRef.value.clearValidate();
      // reset();
      // dialogVisible.value = false;
    }else if(title.value === '编辑'){
      const {...data} = JSON.parse(JSON.stringify(state.form))
      const res = await editNeedDiscren(data)
      if(res.code === 200){
        ElMessage({
          type: 'success',
          message: '编辑成功'
        });
      }else{
        ElMessage.warning(res.message)
      }
      emit("getList")
      busRef.value.clearValidate();
      reset();
      dialogVisible.value = false;
    }
  }
}
const getDeptList = async () => {
  if(state.isAdmin && (state.form.companyId == 0 || state.form.companyId == null)){
    return
  }
  const param = {
    pageNum: 1,
    pageSize: 999,
    companyId: state.form.companyId
  }
  const res = await getDept(param)
  if(res.code === 200){
    state.deptList = res.data
  }
}
const getPeopleList = async ()=> {
  if(state.isAdmin && (state.form.companyId == 0 || state.form.companyId == null)){
    return
  }
  const queryParams = {
    pageNum: 1,
    pageSize: 9999,
    companyId: state.form.companyId
  }
  const res = await getUser(queryParams)
  if(res.code == 200){
    state.peopleList = res.data.list?res.data.list:[]
  }else{
    ElMessage.warning(res.message)
  }
};
const handleClose = () => {
  busRef.value.clearValidate();
  reset();
  dialogVisible.value = false;
  emit("getList")

}
const reset = () => {
  state.form = {
    id: '',
    companyId: null,
    deptId: null,
    year: '',
    fictionId: null,
    checkId: null,
    ratifyId: null,
    fictionTime: null,
    frequency: '',
    expectContents:[],
  }
  state.companyList = []
}





const selectValueCom = (val) => {
  state.form.fictionId = null
  state.form.checkId = null
  state.form.ratifyId = null
  state.form.deptId = null
  state.companyList.forEach(item => {
    if(item.name === val){
      state.form.companyId = item.id
    }
  })
  getDeptList()
  getPeopleList()
}


const addProductTable = () => {
  state.form.expectContents.push({expectContentMesses: [{}]})
}
const addContentTable = () => {
  state.form.expectContentsX.push({expectContentMessesX: [{}]})
}
const addObject = (val,itemIndex) => {
  state.form.expectContentsX.forEach((item,index) => {
    if(index == itemIndex){
      item.expectContentMessesX.push({})
    }
  })
}
const delProduct = (val,itemIndex) => {
  state.form.expectContents.forEach((item,index) => {
    if(index == itemIndex){
      if(item.expectContentMesses.length == 1){
        state.form.expectContents.splice(index,1)
      }else {
        item.expectContentMesses.pop()
      }
    }
  })
}
const delContent = (val,itemIndex) => {
  state.form.expectContentsX.forEach((item,index) => {
    if(index == itemIndex){
      if(item.expectContentMessesX.length == 1){
        state.form.expectContentsX.splice(index,1)
      }else {
        item.expectContentMessesX.pop()
      }
    }
  })
}

defineExpose({
  openDialog
});

</script>

<style scoped lang="scss">
.notice{
  :deep(.el-form .el-form-item__label) {
    font-size: 15px;
  }
  .file {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
}
</style>

 src/views/work/marketingManagement/contractManagement/contractChange/index.vue

New file
@@ -0,0 +1,274 @@
<template>
  <div class="app-container">
    <div style="margin-bottom: 10px">
      <el-form style="display: flex;flex-wrap: wrap;">
        <el-form-item>
          <el-button
              type="primary"
              plain
              icon="Plus"
              @click="openDialog('add',{})"
          >新增</el-button>
        </el-form-item>
        <el-form-item label="企业名称:" v-if="data.isAdmin" style="margin-left: 20px">
          <el-select v-model="data.queryParams.companyId" placeholder="请选择" filterable clearable>
            <el-option
                v-for="item in data.companyList"
                :key="item.id"
                :label="item.name"
                :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" style="margin-left: 30px" @click="searchClick">查询</el-button>
          <el-button plain @click="reset">重置</el-button>
        </el-form-item>
        <el-form-item style="margin-left: 15px">
          <el-button
              type="primary"
              @click="exportData"
          >导出</el-button>
        </el-form-item>
      </el-form>
    </div>
    <!-- 表格数据 -->
    <el-table v-loading="loading" :data="dataList" :border="true"  @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" />
      <el-table-column type="index" label="序号" width="80" align="center" />
      <el-table-column label="合同编号" prop="num" align="center" />
      <el-table-column label="合同名称" prop="num" align="center" />
      <el-table-column label="签订日期" prop="num" align="center" />
      <el-table-column label="评审类型" prop="num" align="center" >
        <template #default="scope">

        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="160">
        <template #default="scope">
          <el-button link type="primary"  @click="openDialog('review',scope.row)" >查看</el-button>
          <el-button link type="primary"  @click="openDialog('edit',scope.row)" >编辑</el-button>
          <el-button link type="danger"  @click="handleDelete(scope.row)" >删除</el-button>
        </template>
      </el-table-column>
    </el-table>

    <div class="pag-container">
      <el-pagination
          v-model:current-page="data.queryParams.pageNum"
          v-model:page-size="data.queryParams.pageSize"
          :page-sizes="[10,15,20,25]"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
      />
    </div>
    <editDialog ref="noticeRef" @getList = "getList"></editDialog>
  </div>
</template>

<script setup>
import {getCurrentInstance, onMounted, reactive, ref, toRefs} from "vue";
import editDialog from "./components/editDialog.vue"
import {ElMessage, ElMessageBox} from "element-plus";
import {getCompany} from "@/api/onlineEducation/company";
import Cookies from "js-cookie";
import {generateWordDocument} from "@/utils/exportWord";
import {delTable, getTable} from "@/api/qualityObjectives/table";
import {delNeedDiscren, getNeedDiscren} from "@/api/need/need";
const { proxy } = getCurrentInstance();
const loading = ref(false);
const noticeRef = ref();
const deptRef = ref()
const loadingCompany = ref(false)
const choosedData = ref([])
const data = reactive({
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    companyId: null,
    year: '',
    type: ''
  },
  companyList: [],
  isAdmin: false,
  dialogVisible: false,
});
const dataList = ref([]);
const total = ref(0);

const { queryParams } = toRefs(data);

onMounted(() => {
  const userInfo = JSON.parse(Cookies.get('userInfo'))
  console.log("userInfo",userInfo)
  data.isAdmin = userInfo.userType === 0;
  if(data.isAdmin){
    data.queryParams.companyId = null
  }else {
    data.queryParams.companyId = userInfo.companyId
  }
  getList();
  if(data.isAdmin){
    getCompanyList()
  }
});
const getList = async () => {
  // loading.value = true;
  // const res = await getNeedDiscren(data.queryParams);
  // if(res.code === 200){
  //   dataList.value = res.data.list
  //   total.value = res.data.total
  // }else{
  //   ElMessage.warning(res.message)
  // }
  // loading.value = false;
  dataList.value = [{}]
}

const searchClick = () => {
  getList();
}

const openDialog = (type, value) => {
  noticeRef.value.openDialog(type, value,data.companyList);
}

const getCompanyList = async ()=>{
  const queryParams = {
    pageNum: 1,
    pageSize: 999
  }
  const res = await getCompany(queryParams)
  if (res.code == 200) {
    data.companyList = res.data.list?res.data.list:[]
  } else {
    ElMessage.warning(res.message)
  }
}

const handleSizeChange = (val) => {
  data.queryParams.pageSize = val
  getList()
}
const handleCurrentChange = (val) => {
  data.queryParams.pageNum = val
  getList()
}
const handleClose = () => {
  data.dialogVisible = false
}

/** 重置新增的表单以及其他数据  */
function reset() {
  if(data.isAdmin){
    data.queryParams = {
      companyId: '',
      pageNum: 1,
      pageSize: 10,
    }
    choosedData.value = []
    data.companyList = [];
    getCompanyList()
  }else {
    data.queryParams = {
      companyId: data.queryParams.companyId,
      pageNum: 1,
      pageSize: 10,
    }
  }
  getList();

}
const exportData = () => {
  if(choosedData.value && choosedData.value.length === 0){
    ElMessage.warning('请选择需要导出的数据')
  }else {
    startGeneration()
  }
}
const templatePath = ref('/contractChangeExample.docx')
const startGeneration = async () => {
  const data = JSON.parse(JSON.stringify(choosedData.value))
  data.forEach(item => {
    item.expectContents = [
      {
        name: '张三',
        expectContentMesses: [
          {
            need: 'xxx',
            personName: 'x',
            visit:true,
            network: true,
            other: false

          },
          {
            need: '22',
            personName: '2',
            visit:false,
            network: false,
            other: true

          },
        ]
      }
    ]
    item.tableData = item.expectContents.map((i,index) => {
      return{
        ...i,
        expectContentMesses: i.expectContentMesses.map((q,qindex) => {
          return{
            ...q,
            first: qindex == 0,
            num: index+1,
          }
        })
      }
    })
    console.log('xxx',item.tableData)
    try {
      generateWordDocument(templatePath.value, item, item.companyName + `_合同评审变更表.docx`);
    } catch (error){
      ElMessage({
        type: 'warning',
        message: '导出失败'
      });
    }
  })
}
const handleSelectionChange = (val) => {
  choosedData.value = val
}
const handleDelete = (val) => {
  ElMessageBox.confirm(
      '确定删除此条数据？',
      '提示',
      {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
      .then( async() => {
        const res = await delNeedDiscren(val.id);
        if(res.code === 200){
          ElMessage({
            type: 'success',
            message: '删除成功'
          });
          getList();
        }else{
          ElMessage.warning(res.message)
        }
      })
}


</script>
<style lang="scss">
.pag-container{
  float: right;
  margin-top: 10px;
}
</style>

 src/views/work/marketingManagement/contractManagement/contractLedger/components/editDialog.vue

New file
@@ -0,0 +1,195 @@
<template>
  <div class="notice">
    <el-dialog
        v-model="dialogVisible"
        :title="title"
        width="550px"
        :before-close="handleClose"
        :close-on-press-escape="false"
        :close-on-click-modal="false"
    >
      <el-form :model="state.form" size="default" ref="busRef" :rules="state.formRules" label-width="150px" >
        <el-form-item label="企业名称:" prop="companyId" v-if="state.isAdmin">
          <el-select v-model="state.form.companyId" placeholder="请选择" filterable clearable style="width: 100%" :disabled="title == '查看' || title == '编辑' || !state.isAdmin">
            <el-option
                v-for="item in state.companyList"
                :key="item.id"
                :label="item.name"
                :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="合同编号:" prop="name" >
          <el-input v-model="state.form.name" :disabled="title === '查看'"  placeholder="顾客名称"/>
        </el-form-item>
        <el-form-item label="合同名称:" prop="address" >
          <el-input v-model="state.form.address" :disabled="title === '查看'" placeholder="顾客地址"/>
        </el-form-item>
        <el-form-item label="签订日期:" prop="remark" >
          <el-date-picker
              v-model="state.form.faultDate"
              type="date"
              value-format="YYYY-MM-DD"
              placeholder="请选择签订日期"
              :disabled="title =='查看'"
              style="width: 100%"
          />
        </el-form-item>
      </el-form>
      <template #footer v-if="title !== '查看'">
        <span class="dialog-footer">
            <el-button @click="handleClose" size="default">取 消</el-button>
            <el-button type="primary"  @click="onSubmit" size="default" v-preReClick>确认</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>
<script setup>
import {reactive, ref, toRefs} from 'vue'
import Editor from "@/components/Editor/index.vue";
import {ElMessage, ElMessageBox} from "element-plus";
import {addNotice} from "@/api/backManage/notice";
import {addDict, editDict, getDictDetail} from "@/api/backManage/evaluate";
import {addCompany, checkName, distributeCompany, editCompany, getCompany} from "@/api/onlineEducation/company";
import {verifyPhone} from "@/utils/validate";
import {getToken} from "@/utils/auth";
import {addQualification, editQualification} from "@/api/companyInfo/qualifications";
import Cookies from "js-cookie";

const dialogVisible = ref(false);
const title = ref("");
const busRef = ref();
const length = ref()
const emit = defineEmits(["getList"]);
const validateUserPhone = (rule, value, callback)=>{
  if(value === ''){
    callback(new Error('请输入手机号'))
  }else{
    if(!verifyPhone(value)){
      callback(new Error('手机号格式有误'))
    }else{
      callback()
    }
  }
}
const state = reactive({
  form: {
    id: '',
    companyId: '',
    name: '',
    address: '',
    person: '',
    phone: '',
    email: '',
    remark: ''
  },
  formRules:{
    companyId: [{ required: true, message: '请选择企业', trigger: 'blur' }],
    name:[{ required: true, message: '请输入顾客名称', trigger: 'blur' }],
    address:[{ required: true, message: '请输入顾客地址', trigger: 'blur' }],
    person:[{ required: true, message: '请输入联系人', trigger: 'blur' }],
    phone: [{ validator: validateUserPhone,required: true, trigger: 'blur' }],
  },
  companyList: [],
  isAdmin: false
})


const openDialog = async (type, value,companyList) => {
  const userInfo = JSON.parse(Cookies.get('userInfo'))
  state.isAdmin = userInfo.userType === 0;
  if(state.isAdmin){
    state.companyList = companyList
  }
  title.value = type === 'add' ? '新增' : type ==='edit' ? '编辑' : '查看' ;
  if(type === 'edit' || type === 'review') {
    state.form = JSON.parse(JSON.stringify(value));
    if(state.isAdmin){
      state.form.companyId = value.companyId
      state.form.companyName = value.companyName
    }
  }
  dialogVisible.value = true;
}

const onSubmit = async () => {
  const valid = await busRef.value.validate();
  if(!state.isAdmin){
    const userInfo = JSON.parse(Cookies.get('userInfo'))
    state.form.companyId = userInfo.companyId
  }
  if(valid){
    if(title.value === '新增'){
      // const {id, ...data} = JSON.parse(JSON.stringify(state.form))
      // const res = await addQualification(data)
      // if(res.code === 200){
      //   ElMessage({
      //     type: 'success',
      //     message: '新增成功'
      //   });
      // }else{
      //   ElMessage.warning(res.message)
      // }
      // emit("getList")
      // busRef.value.clearValidate();
      // reset();
      // dialogVisible.value = false;
    }else if(title.value === '编辑'){
      // const {...data} = JSON.parse(JSON.stringify(state.form))
      // const res = await editQualification(data)
      // if(res.code === 200){
      //   ElMessage({
      //     type: 'success',
      //     message: '编辑成功'
      //   });
      // }else{
      //   ElMessage.warning(res.message)
      // }
      // emit("getList")
      // busRef.value.clearValidate();
      // reset();
      // dialogVisible.value = false;
    }
  }
}

const handleClose = () => {
  busRef.value.clearValidate();
  reset();
  dialogVisible.value = false;
  emit("getList")

}

const reset = () => {
  state.form = {
    id: '',
    companyId: '',
    name: '',
    address: '',
    person: '',
    phone: '',
    email: '',
    remark: ''
  }
  state.companyList = []
}
defineExpose({
  openDialog
});

</script>

<style scoped lang="scss">
.notice{
  :deep(.el-form .el-form-item__label) {
    font-size: 15px;
  }
  .file {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
}
</style>

 src/views/work/marketingManagement/contractManagement/contractLedger/index.vue

New file
@@ -0,0 +1,196 @@
<template>
  <div class="app-container">
    <div style="margin-bottom: 10px">
      <el-form style="display: flex;flex-wrap: wrap;">
        <el-form-item>
          <el-button
              type="primary"
              plain
              icon="Plus"
              @click="openDialog('add',{})"
          >新增</el-button>
        </el-form-item>
        <el-form-item label="企业名称:" v-if="data.isAdmin" style="margin-left: 20px">
          <el-select v-model="data.queryParams.companyId" placeholder="请选择" filterable clearable>
            <el-option
                v-for="item in data.companyList"
                :key="item.id"
                :label="item.name"
                :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item v-if="data.isAdmin">
          <el-button type="primary" style="margin-left: 30px" @click="searchClick">查询</el-button>
          <el-button plain @click="reset">重置</el-button>
        </el-form-item>
      </el-form>
    </div>
    <!-- 表格数据 -->
    <el-table v-loading="loading" :data="dataList" :border="true" >
      <el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
      <el-table-column label="合同编号" prop="companyName" align="center" v-if="data.isAdmin" />
      <el-table-column label="合同名称" prop="certificateName" align="center"  width="130"/>
      <el-table-column label="签订日期" prop="certificateNum" align="center"  />
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width"  width="160">
        <template #default="scope">
          <el-button link type="primary"  @click="openDialog('review',scope.row)" >查看</el-button>
          <el-button link type="primary"  @click="openDialog('edit',scope.row)" >编辑</el-button>
          <el-button link type="danger"  @click="handleDelete(scope.row)" >删除</el-button>
        </template>
      </el-table-column>
    </el-table>

    <div class="pag-container">
      <el-pagination
          v-model:current-page="data.queryParams.pageNum"
          v-model:page-size="data.queryParams.pageSize"
          :page-sizes="[10,15,20,25]"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
      />
    </div>
    <editDialog ref="noticeRef" @getList = "getList"></editDialog>
  </div>
</template>

<script setup>
import {getCurrentInstance, onMounted, reactive, ref, toRefs} from "vue";
import editDialog from "./components/editDialog.vue"
import {ElMessage, ElMessageBox} from "element-plus";
import {getCompany} from "@/api/onlineEducation/company";
import Cookies from "js-cookie";
import {generateWordDocument} from "@/utils/exportWord";
import {delQualification, getQualification} from "@/api/companyInfo/qualifications";
import axios from "axios";
import {getToken} from "@/utils/auth";
const { proxy } = getCurrentInstance();
const loading = ref(false);
const noticeRef = ref();
const loadingCompany = ref(false)
const choosedData = ref([])
const data = reactive({
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    companyId: null,
  },
  companyList: [],
  isAdmin: false
});
const dataList = ref([]);
const total = ref(0);

const { queryParams } = toRefs(data);

onMounted(() => {
  const userInfo = JSON.parse(Cookies.get('userInfo'))
  console.log("userInfo",userInfo)
  data.isAdmin = userInfo.userType === 0;
  if(data.isAdmin){
    data.queryParams.companyId = null
  }else {
    data.queryParams.companyId = userInfo.companyId
  }
  getList();
  if(data.isAdmin){
    getCompanyList()
  }
});
const getList = async () => {
  // loading.value = true;
  // const res = await getQualification(data.queryParams);
  // if(res.code === 200){
  //   dataList.value = res.data.list.map(item => {
  //     return{
  //       ...item,
  //       effectiveTime: item.effectiveTime.substring(0,10),
  //     }
  //   })
  //   total.value = res.data.total
  // }else{
  //   ElMessage.warning(res.message)
  // }
  // loading.value = false;

}

const searchClick = () => {
  getList();
}
const openDialog = (type, value) => {
  noticeRef.value.openDialog(type, value,data.companyList);
}
const getCompanyList = async ()=>{
  const queryParams = {
    pageNum: 1,
    pageSize: 999
  }
  const res = await getCompany(queryParams)
  if (res.code == 200) {
    data.companyList = res.data.list?res.data.list:[]
    // data.queryParams.companyId = data.companyList[0].id
  } else {
    ElMessage.warning(res.message)
  }
}
const handleSizeChange = (val) => {
  data.queryParams.pageSize = val
  getList()
}
const handleCurrentChange = (val) => {
  data.queryParams.pageNum = val
  getList()
}

/** 重置新增的表单以及其他数据  */
function reset() {
  data.queryParams = {
    companyId: '',
    pageNum: 1,
    pageSize: 10,
  }
  choosedData.value = []
  data.companyList = [];
  getList();
  getCompanyList()

}



const handleSelectionChange = (val) => {
  choosedData.value = val
}
const handleDelete = (val) => {
  ElMessageBox.confirm(
      '确定删除此条数据？',
      '提示',
      {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
      .then( async() => {
        const res = await delQualification(val.id);
        if(res.code === 200){
          ElMessage({
            type: 'success',
            message: '删除成功'
          });
          getList();
        }else{
          ElMessage.warning(res.message)
        }
      })
}

</script>
<style lang="scss">
.pag-container{
  float: right;
  margin-top: 10px;
}
</style>

 src/views/work/marketingManagement/customerList/communicate/components/editDialog.vue

New file
@@ -0,0 +1,473 @@
<template>
  <div class="notice">
    <el-dialog
        v-model="dialogVisible"
        :title="title"
        width="900px"
        :before-close="handleClose"
        :close-on-press-escape="false"
        :close-on-click-modal="false"
    >
      <el-form :model="state.form" size="default" ref="busRef" :rules="state.rules"  label-position="right" label-width="130">
        <el-row :gutter="24">
          <el-col :span="24">
            <el-form-item label="企业名称:" prop="companyId" v-if="state.isAdmin">
              <el-select v-model="state.form.companyId" placeholder="请选择" filterable clearable style="width: 100%" :disabled="title == '查看' || title == '编辑' || !state.isAdmin" @change="selectValueCom">
                <el-option
                    v-for="item in state.companyList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="12">
            <el-form-item label="记录名称:" prop="year" >
              <el-input  :disabled="title === '查看'" v-model="state.form.name" placeholder="记录名称"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="编号:" prop="year" >
              <el-input  :disabled="title === '查看'" v-model="state.form.name" placeholder="编号"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="12">
            <el-form-item label="客户单位/姓名:" prop="year" >
              <el-input  :disabled="title === '查看'" v-model="state.form.name" placeholder="客户单位/姓名"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="联系电话:" prop="year" >
              <el-input  :disabled="title === '查看'" v-model="state.form.name" placeholder="联系电话"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="12">
            <el-form-item label="沟通时间:" prop="year" >
              <el-input  :disabled="title === '查看'" v-model="state.form.name" placeholder="沟通时间"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="沟通方式:" prop="year" >
              <el-checkbox-group v-model="state.checkMethodList" :disabled="title === '查看'" style="display: flex;flex-wrap: wrap" @change="changeCheck('method')" class="custom-checkbox-group">
                <div v-for="(item,index) in state.methodsList">
                  <el-checkbox :label="item.id" :key="item.id" style="margin-left: 20px;">
                    {{item.name}}
                    <el-input
                        :disabled="title === '查看'"
                        v-if="item.id == 5 && state.checkMethodList.includes(5)"
                        v-model="state.form.otherProduct"
                        style="margin-left: 5px;width: 160px"
                        placeholder="请输入其他"
                        size="small"
                    />
                  </el-checkbox>
                </div>
              </el-checkbox-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="12">
            <el-form-item label="沟通地点:" prop="year" >
              <el-input  :disabled="title === '查看'" v-model="state.form.name" placeholder="沟通地点"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="沟通类型:" prop="year" >
              <el-checkbox-group v-model="state.checkTypeList" :disabled="title === '查看'" style="display: flex;flex-wrap: wrap" @change="changeCheck('type')" class="custom-checkbox-group">
                <div v-for="(item,index) in state.typeList">
                  <el-checkbox :label="item.id" :key="item.id" style="margin-left: 20px;">
                    {{item.name}}
                    <el-input
                        :disabled="title === '查看'"
                        v-if="item.id == 5 && state.checkTypeList.includes(5)"
                        v-model="state.form.otherProduct"
                        style="margin-left: 5px;width: 160px"
                        placeholder="请输入其他"
                        size="small"
                    />
                  </el-checkbox>
                </div>
              </el-checkbox-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24" style="margin-top: 10px">
          <el-col :span="12">
            <el-form-item label="详细内容:" prop="year" >
              <el-input  :disabled="title === '查看'" type="textarea" :rows="4" v-model="state.form.name" placeholder="详细内容"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="记录人:" prop="year" >
              <el-select clearable v-model="state.form.fictionId" :disabled="state.title =='查看'" filterable placeholder="编制" style="width: 100%">
                <el-option
                    v-for="item in state.peopleList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="时间:" prop="year" >
              <el-date-picker
                  v-model="state.form.fictionTime"
                  type="date"
                  value-format="YYYY-MM-DD"
                  placeholder="请选择编制日期"
                  style="width: 100%"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="12">
            <el-form-item label="处理过程描述:" prop="year" >
              <el-input  :disabled="title === '查看'" type="textarea" :rows="4" v-model="state.form.name" placeholder="详细内容"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="记录人:" prop="year" >
              <el-select clearable v-model="state.form.fictionId" :disabled="state.title =='查看'" filterable placeholder="编制" style="width: 100%">
                <el-option
                    v-for="item in state.peopleList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="时间:" prop="year" >
              <el-date-picker
                  v-model="state.form.fictionTime"
                  type="date"
                  value-format="YYYY-MM-DD"
                  placeholder="请选择编制日期"
                  style="width: 100%"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="12">
            <el-form-item label="领导审阅:" prop="year" >
              <el-input  :disabled="title === '查看'" type="textarea" :rows="4" v-model="state.form.name" placeholder="详细内容"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="记录人:" prop="year" >
              <el-select clearable v-model="state.form.fictionId" :disabled="state.title =='查看'" filterable placeholder="编制" style="width: 100%">
                <el-option
                    v-for="item in state.peopleList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="时间:" prop="year" >
              <el-date-picker
                  v-model="state.form.fictionTime"
                  type="date"
                  value-format="YYYY-MM-DD"
                  placeholder="请选择编制日期"
                  style="width: 100%"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <template #footer v-if="title !== '查看'">
        <span class="dialog-footer">
            <el-button @click="handleClose" size="default">取 消</el-button>
            <el-button type="primary"  @click="onSubmit" size="default" v-preReClick>确认</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>
<script setup>
import {onMounted, reactive, ref, toRefs} from 'vue'
import Cookies from "js-cookie";
import {getCompany} from "@/api/onlineEducation/company";
import {ElMessage} from "element-plus";
import {getUser} from "@/api/onlineEducation/user";
import {getDept, getObject, getObjectPage} from "@/api/qualityObjectives/object";
import {addTable, editTable, getTargetById} from "@/api/qualityObjectives/table";
import {addNeedDiscren, editNeedDiscren} from "@/api/need/need";

const dialogVisible = ref(false);
const title = ref("");
const busRef = ref();
const length = ref()
const selectPopperClass = "max-width-select";
const emit = defineEmits(["getList"]);
const dataRef = ref();
const state = reactive({
  form: {
    id: '',
    companyId: null,
    deptId: null,
    year: '',
    fictionId: null,
    checkId: null,
    ratifyId: null,
    fictionTime: null,
    frequency: '',
    expectContents:[],
  },
  rules: {
    companyId: [{ required: true, message: '请选择企业', trigger: 'blur' }],
    deptId: [{ required: true, message: '请选择部门', trigger: 'blur' }],
    year: [{ required: true, message: '请选择年份', trigger: 'blur' }],
    fictionId: [{ required: true, message: '请选择编制人', trigger: 'blur' }],
    ratifyId: [{ required: true, message: '请选择批准人', trigger: 'blur' }],
    checkId: [{ required: true, message: '请选择审核人', trigger: 'blur' }],
    fictionTime: [{ required: true, message: '请选择日期', trigger: 'blur' }],
    frequency: [{ required: true, message: '请输入监测频率', trigger: 'blur' }],
    stakeholder: [{required: true, message: "", trigger: "blur"}],
    expectation: [{required: true, message: "", trigger: "blur"}],
    solutions: [{required: true, message: "", trigger: "blur"}],
    expectContents:[{ required: true, message: '请填写相关方期望或要求识别表', trigger: 'blur' }],
  },
  peopleList: [],
  isAdmin: false,
  companyList: [],
  deptList: [],
  checkMethodList: [],
  methodsList: [
    {
      id: 1,
      name: '面谈'
    },
    {
      id: 2,
      name: '面谈'
    },
    {
      id: 3,
      name: '信函'
    },
    {
      id: 4,
      name: '邮件'
    },
    {
      id: 5,
      name: '其他:'
    },
  ],
  checkTypeList: [],
  typeList: [
    {
      id: 1,
      name: '建议'
    },
    {
      id: 2,
      name: '咨询'
    },
    {
      id: 3,
      name: '反馈'
    },
    {
      id: 4,
      name: '抱怨'
    },
    {
      id: 5,
      name: '其他:'
    },
  ]
})

onMounted(() => {


});
const openDialog = async (type, value,companyList) => {
  const userInfo = JSON.parse(Cookies.get('userInfo'))
  state.isAdmin = userInfo.userType === 0;
  state.form.companyName = userInfo.companyName
  state.form.companyId = userInfo.companyId
  if(state.isAdmin){
    state.form.companyId = value.companyId
    state.form.companyName = value.companyName
    state.companyList = companyList
  }
  title.value = type === 'add' ? '新增' : type ==='edit' ? '编辑' : '查看' ;
  if(type === 'edit' || type === 'review') {
    state.form = JSON.parse(JSON.stringify(value));
    if(state.isAdmin){
      state.form.companyId = value.companyId
      state.form.companyName = value.companyName
    }
  }
  await getDeptList()
  await getPeopleList()
  dialogVisible.value = true;
}
const onSubmit = async () => {
  console.log('state.form',state.form)
  const valid = await busRef.value.validate();
  if(valid){
    if(title.value === '新增'){
      // console.log('sta',state.form)
      // const {id, ...data} = JSON.parse(JSON.stringify(state.form))
      // const res = await addNeedDiscren(data)
      // if(res.code === 200){
      //   ElMessage({
      //     type: 'success',
      //     message: '新增成功'
      //   });
      // }else{
      //   ElMessage.warning(res.message)
      // }
      // emit("getList")
      // busRef.value.clearValidate();
      // reset();
      // dialogVisible.value = false;
    }else if(title.value === '编辑'){
      const {...data} = JSON.parse(JSON.stringify(state.form))
      const res = await editNeedDiscren(data)
      if(res.code === 200){
        ElMessage({
          type: 'success',
          message: '编辑成功'
        });
      }else{
        ElMessage.warning(res.message)
      }
      emit("getList")
      busRef.value.clearValidate();
      reset();
      dialogVisible.value = false;
    }
  }
}
const getDeptList = async () => {
  if(state.isAdmin && (state.form.companyId == 0 || state.form.companyId == null)){
    return
  }
  const param = {
    pageNum: 1,
    pageSize: 999,
    companyId: state.form.companyId
  }
  const res = await getDept(param)
  if(res.code === 200){
    state.deptList = res.data
  }
}
const getPeopleList = async ()=> {
  if(state.isAdmin && (state.form.companyId == 0 || state.form.companyId == null)){
    return
  }
  const queryParams = {
    pageNum: 1,
    pageSize: 9999,
    companyId: state.form.companyId
  }
  const res = await getUser(queryParams)
  if(res.code == 200){
    state.peopleList = res.data.list?res.data.list:[]
  }else{
    ElMessage.warning(res.message)
  }
};
const handleClose = () => {
  busRef.value.clearValidate();
  reset();
  dialogVisible.value = false;
  emit("getList")

}
const reset = () => {
  state.form = {
    id: '',
    companyId: null,
    deptId: null,
    year: '',
    fictionId: null,
    checkId: null,
    ratifyId: null,
    fictionTime: null,
    frequency: '',
    expectContents:[],
  }
  state.companyList = []
}


const changeCheck = (type) => {
  switch (type) {
    case 'type': state.form.qualification = state.checkTypeList.join(','); if(!state.checkTypeList.includes(8))state.form.otherQualifi = '' ;break;
    case 'method': state.form.product = state.checkMethodList.join(',');if(!state.checkMethodList.includes(5))state.form.otherProduct = ''; break;
  }

}


const selectValueCom = (val) => {
  state.form.fictionId = null
  state.form.checkId = null
  state.form.ratifyId = null
  state.form.deptId = null
  state.companyList.forEach(item => {
    if(item.name === val){
      state.form.companyId = item.id
    }
  })
  getDeptList()
  getPeopleList()
}


const addTableData = () => {
  state.form.expectContents.push({expectContentMesses: [{}]})
}
const addObject = (val,itemIndex) => {
  state.form.expectContents.forEach((item,index) => {
    if(index == itemIndex){
      item.expectContentMesses.push({})
    }
  })
}
const delObject = (val,itemIndex) => {
  state.form.expectContents.forEach((item,index) => {
    if(index == itemIndex){
      if(item.expectContentMesses.length == 1){
        state.form.expectContents.splice(index,1)
      }else {
        item.expectContentMesses.pop()
      }
    }
  })
}

defineExpose({
  openDialog
});

</script>

<style scoped lang="scss">
.notice{
  :deep(.el-form .el-form-item__label) {
    font-size: 15px;
  }
  .file {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
}
</style>

 src/views/work/marketingManagement/customerList/communicate/index.vue

New file
@@ -0,0 +1,235 @@
<template>
  <div class="app-container">
    <div style="margin-bottom: 10px">
      <el-form style="display: flex;flex-wrap: wrap;">
        <el-form-item>
          <el-button
              type="primary"
              plain
              icon="Plus"
              @click="openDialog('add',{})"
          >新增</el-button>
        </el-form-item>
        <el-form-item label="企业名称:" v-if="data.isAdmin" style="margin-left: 20px">
          <el-select v-model="data.queryParams.companyId" placeholder="请选择" filterable clearable>
            <el-option
                v-for="item in data.companyList"
                :key="item.id"
                :label="item.name"
                :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" style="margin-left: 30px" @click="searchClick">查询</el-button>
          <el-button plain @click="reset">重置</el-button>
        </el-form-item>
        <el-form-item style="margin-left: 15px">
          <el-button
              type="primary"
              @click="exportData"
          >导出</el-button>
        </el-form-item>
      </el-form>
    </div>
    <!-- 表格数据 -->
    <el-table v-loading="loading" :data="dataList" :border="true"  @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" />
      <el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
      <el-table-column label="记录名称" prop="name"  align="center">
      </el-table-column>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="160">
        <template #default="scope">
          <el-button link type="primary"  @click="openDialog('review',scope.row)" >查看</el-button>
          <el-button link type="primary"  @click="openDialog('edit',scope.row)" >编辑</el-button>
          <el-button link type="danger"  @click="handleDelete(scope.row)" >删除</el-button>
        </template>
      </el-table-column>
    </el-table>

    <div class="pag-container">
      <el-pagination
          v-model:current-page="data.queryParams.pageNum"
          v-model:page-size="data.queryParams.pageSize"
          :page-sizes="[10,15,20,25]"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
      />
    </div>
    <editDialog ref="noticeRef" @getList = "getList"></editDialog>
  </div>
</template>

<script setup>
import {getCurrentInstance, onMounted, reactive, ref, toRefs} from "vue";
import editDialog from "./components/editDialog.vue"
import {ElMessage, ElMessageBox} from "element-plus";
import {getCompany} from "@/api/onlineEducation/company";
import Cookies from "js-cookie";
import {generateWordDocument} from "@/utils/exportWord";
import {delTable, getTable} from "@/api/qualityObjectives/table";
import {delNeedDiscren, getNeedDiscren} from "@/api/need/need";
const { proxy } = getCurrentInstance();
const loading = ref(false);
const noticeRef = ref();
const deptRef = ref()
const loadingCompany = ref(false)
const choosedData = ref([])
const data = reactive({
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    companyId: null,
    year: '',
    type: ''
  },
  companyList: [],
  isAdmin: false,
  dialogVisible: false,
});
const dataList = ref([]);
const total = ref(0);

const { queryParams } = toRefs(data);

onMounted(() => {
  const userInfo = JSON.parse(Cookies.get('userInfo'))
  console.log("userInfo",userInfo)
  data.isAdmin = userInfo.userType === 0;
  if(data.isAdmin){
    data.queryParams.companyId = null
  }else {
    data.queryParams.companyId = userInfo.companyId
  }
  getList();
  if(data.isAdmin){
    getCompanyList()
  }
});
const getList = async () => {
  // loading.value = true;
  // const res = await getNeedDiscren(data.queryParams);
  // if(res.code === 200){
  //   dataList.value = res.data.list
  //   total.value = res.data.total
  // }else{
  //   ElMessage.warning(res.message)
  // }
  // loading.value = false;
  dataList.value = [{}]
}

const searchClick = () => {
  getList();
}

const openDialog = (type, value) => {
  noticeRef.value.openDialog(type, value,data.companyList);
}

const getCompanyList = async ()=>{
  const queryParams = {
    pageNum: 1,
    pageSize: 999
  }
  const res = await getCompany(queryParams)
  if (res.code == 200) {
    data.companyList = res.data.list?res.data.list:[]
  } else {
    ElMessage.warning(res.message)
  }
}

const handleSizeChange = (val) => {
  data.queryParams.pageSize = val
  getList()
}
const handleCurrentChange = (val) => {
  data.queryParams.pageNum = val
  getList()
}
const handleClose = () => {
  data.dialogVisible = false
}

/** 重置新增的表单以及其他数据  */
function reset() {
  if(data.isAdmin){
    data.queryParams = {
      companyId: '',
      pageNum: 1,
      pageSize: 10,
    }
    choosedData.value = []
    data.companyList = [];
    getCompanyList()
  }else {
    data.queryParams = {
      companyId: data.queryParams.companyId,
      pageNum: 1,
      pageSize: 10,
    }
  }
  getList();

}
const exportData = () => {
  if(choosedData.value && choosedData.value.length === 0){
    ElMessage.warning('请选择需要导出的数据')
  }else {
    startGeneration()
  }
}
const templatePath = ref('/customerCommunicateExample.docx')
const startGeneration = async () => {
  const data = JSON.parse(JSON.stringify(choosedData.value))
  data.forEach(item => {


    console.log('xxx',item.tableData)
    try {
      generateWordDocument(templatePath.value, item, item.companyName + `_相关方期望和需求识别表.docx`);
    } catch (error){
      ElMessage({
        type: 'warning',
        message: '导出失败'
      });
    }
  })
}
const handleSelectionChange = (val) => {
  choosedData.value = val
}
const handleDelete = (val) => {
  ElMessageBox.confirm(
      '确定删除此条数据？',
      '提示',
      {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
      .then( async() => {
        const res = await delNeedDiscren(val.id);
        if(res.code === 200){
          ElMessage({
            type: 'success',
            message: '删除成功'
          });
          getList();
        }else{
          ElMessage.warning(res.message)
        }
      })
}


</script>
<style lang="scss">
.pag-container{
  float: right;
  margin-top: 10px;
}
</style>

 src/views/work/marketingManagement/customerList/list/components/editDialog.vue

New file
@@ -0,0 +1,192 @@
<template>
  <div class="notice">
    <el-dialog
        v-model="dialogVisible"
        :title="title"
        width="550px"
        :before-close="handleClose"
        :close-on-press-escape="false"
        :close-on-click-modal="false"
    >
      <el-form :model="state.form" size="default" ref="busRef" :rules="state.formRules" label-width="150px" >
        <el-form-item label="企业名称:" prop="companyId" v-if="state.isAdmin">
          <el-select v-model="state.form.companyId" placeholder="请选择" filterable clearable style="width: 100%" :disabled="title == '查看' || title == '编辑' || !state.isAdmin">
            <el-option
                v-for="item in state.companyList"
                :key="item.id"
                :label="item.name"
                :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="顾客名称:" prop="customerName" >
          <el-input v-model="state.form.customerName" :disabled="title === '查看'"  placeholder="顾客名称"/>
        </el-form-item>
        <el-form-item label="顾客地址:" prop="customerAddr" >
          <el-input v-model="state.form.customerAddr" :disabled="title === '查看'" placeholder="顾客地址"/>
        </el-form-item>
        <el-form-item label="联系人:" prop="person" >
          <el-input v-model="state.form.person" :disabled="title === '查看'" placeholder="联系人"/>
        </el-form-item>
        <el-form-item label="电话:" prop="phone" >
          <el-input v-model="state.form.phone" :disabled="title === '查看'" placeholder="电话"/>
        </el-form-item>
        <el-form-item label="邮箱:" prop="emil" >
          <el-input v-model="state.form.emil" :disabled="title === '查看'" placeholder="邮箱"/>
        </el-form-item>
        <el-form-item label="备注:" prop="remark" >
          <el-input v-model="state.form.remark" :disabled="title === '查看'" placeholder="备注"/>
        </el-form-item>
      </el-form>
      <template #footer v-if="title !== '查看'">
        <span class="dialog-footer">
            <el-button @click="handleClose" size="default">取 消</el-button>
            <el-button type="primary"  @click="onSubmit" size="default" v-preReClick>确认</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>
<script setup>
import {reactive, ref, toRefs} from 'vue'
import {ElMessage, ElMessageBox} from "element-plus";
import {verifyPhone} from "@/utils/validate";
import Cookies from "js-cookie";
import {addCustomer, editCustomer} from "@/api/customerList";

const dialogVisible = ref(false);
const title = ref("");
const busRef = ref();
const length = ref()
const emit = defineEmits(["getList"]);
const validateUserPhone = (rule, value, callback)=>{
  if(value === ''){
    callback(new Error('请输入手机号'))
  }else{
    if(!verifyPhone(value)){
      callback(new Error('手机号格式有误'))
    }else{
      callback()
    }
  }
}
const state = reactive({
  form: {
    id: '',
    companyId: '',
    customerName: '',
    customerAddr: '',
    person: '',
    phone: '',
    emil: '',
    remark: ''
  },
  formRules:{
    companyId: [{ required: true, message: '请选择企业', trigger: 'blur' }],
    customerName:[{ required: true, message: '请输入顾客名称', trigger: 'blur' }],
    customerAddr:[{ required: true, message: '请输入顾客地址', trigger: 'blur' }],
    person:[{ required: true, message: '请输入联系人', trigger: 'blur' }],
    phone: [{ validator: validateUserPhone,required: true, trigger: 'blur' }],
  },
  companyList: [],
  isAdmin: false
})


const openDialog = async (type, value,companyList) => {
  const userInfo = JSON.parse(Cookies.get('userInfo'))
  state.isAdmin = userInfo.userType === 0;
  if(state.isAdmin){
    state.companyList = companyList
  }
  title.value = type === 'add' ? '新增' : type ==='edit' ? '编辑' : '查看' ;
  if(type === 'edit' || type === 'review') {
    state.form = JSON.parse(JSON.stringify(value));
    if(state.isAdmin){
      state.form.companyId = value.companyId
      state.form.companyName = value.companyName
    }
  }
  dialogVisible.value = true;
}

const onSubmit = async () => {
  const valid = await busRef.value.validate();
  if(!state.isAdmin){
    const userInfo = JSON.parse(Cookies.get('userInfo'))
    state.form.companyId = userInfo.companyId
  }
  if(valid){
    if(title.value === '新增'){
      const {id, ...data} = JSON.parse(JSON.stringify(state.form))
      const res = await addCustomer(data)
      if(res.code === 200){
        ElMessage({
          type: 'success',
          message: '新增成功'
        });
      }else{
        ElMessage.warning(res.message)
      }
      emit("getList")
      busRef.value.clearValidate();
      reset();
      dialogVisible.value = false;
    }else if(title.value === '编辑'){
      const {...data} = JSON.parse(JSON.stringify(state.form))
      const res = await editCustomer(data)
      if(res.code === 200){
        ElMessage({
          type: 'success',
          message: '编辑成功'
        });
      }else{
        ElMessage.warning(res.message)
      }
      emit("getList")
      busRef.value.clearValidate();
      reset();
      dialogVisible.value = false;
    }
  }
}

const handleClose = () => {
  busRef.value.clearValidate();
  reset();
  dialogVisible.value = false;
  emit("getList")

}

const reset = () => {
  state.form = {
    id: '',
    companyId: '',
    companyName: '',
    customerAddr: '',
    person: '',
    phone: '',
    emil: '',
    remark: ''
  }
  state.companyList = []
}
defineExpose({
  openDialog
});

</script>

<style scoped lang="scss">
.notice{
  :deep(.el-form .el-form-item__label) {
    font-size: 15px;
  }
  .file {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
}
</style>

 src/views/work/marketingManagement/customerList/list/index.vue

New file
@@ -0,0 +1,228 @@
<template>
  <div class="app-container">
    <div style="margin-bottom: 10px">
      <el-form style="display: flex;flex-wrap: wrap;">
        <el-form-item>
          <el-button
              type="primary"
              plain
              icon="Plus"
              @click="openDialog('add',{})"
          >新增</el-button>
        </el-form-item>
        <el-form-item label="企业名称:" v-if="data.isAdmin" style="margin-left: 20px">
          <el-select v-model="data.queryParams.companyId" placeholder="请选择" filterable clearable>
            <el-option
                v-for="item in data.companyList"
                :key="item.id"
                :label="item.name"
                :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item v-if="data.isAdmin">
          <el-button type="primary" style="margin-left: 30px" @click="searchClick">查询</el-button>
          <el-button plain @click="reset">重置</el-button>
        </el-form-item>


        <el-form-item style="margin-left: 15px">
          <el-button
              type="primary"
              @click="exportData"
          >导出</el-button>
        </el-form-item>

      </el-form>
    </div>
    <!-- 表格数据 -->
    <el-table v-loading="loading" :data="dataList" :border="true" >
      <el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
      <el-table-column label="企业名称" prop="companyName" align="center" v-if="data.isAdmin" />
      <el-table-column label="顾客名称" prop="customerName" align="center" />
      <el-table-column label="顾客地址" prop="customerAddr" align="center"  width="130"/>
      <el-table-column label="联系人" prop="person" align="center"  />
      <el-table-column label="电话" prop="phone" align="center"  />
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width"  width="160">
        <template #default="scope">
          <el-button link type="primary"  @click="openDialog('review',scope.row)" >查看</el-button>
          <el-button link type="primary"  @click="openDialog('edit',scope.row)" >编辑</el-button>
          <el-button link type="danger"  @click="handleDelete(scope.row)" >删除</el-button>
        </template>
      </el-table-column>
    </el-table>

    <div class="pag-container">
      <el-pagination
          v-model:current-page="data.queryParams.pageNum"
          v-model:page-size="data.queryParams.pageSize"
          :page-sizes="[10,15,20,25]"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
      />
    </div>
    <editDialog ref="noticeRef" @getList = "getList"></editDialog>
  </div>
</template>

<script setup>
import {getCurrentInstance, onMounted, reactive, ref, toRefs} from "vue";
import editDialog from "./components/editDialog.vue"
import {ElMessage, ElMessageBox} from "element-plus";
import {getCompany} from "@/api/onlineEducation/company";
import Cookies from "js-cookie";
import {generateWordDocument} from "@/utils/exportWord";
import {delQualification, getQualification} from "@/api/companyInfo/qualifications";
import axios from "axios";
import {getToken} from "@/utils/auth";
import {delCustomer, getCustomer} from "@/api/customerList";
const { proxy } = getCurrentInstance();
const loading = ref(false);
const noticeRef = ref();
const loadingCompany = ref(false)
const choosedData = ref([])
const data = reactive({
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    companyId: null,
  },
  companyList: [],
  isAdmin: false
});
const dataList = ref([]);
const total = ref(0);

const { queryParams } = toRefs(data);

onMounted(() => {
  const userInfo = JSON.parse(Cookies.get('userInfo'))
  console.log("userInfo",userInfo)
  data.isAdmin = userInfo.userType === 0;
  if(data.isAdmin){
    data.queryParams.companyId = null
  }else {
    data.queryParams.companyId = userInfo.companyId
  }
  getList();
  if(data.isAdmin){
    getCompanyList()
  }
});
const getList = async () => {
  loading.value = true;
  const res = await getCustomer(data.queryParams);
  if(res.code === 200){
    dataList.value = res.data.list
    total.value = res.data.total
  }else{
    ElMessage.warning(res.message)
  }
  loading.value = false;
}

const searchClick = () => {
  getList();
}
const openDialog = (type, value) => {
  noticeRef.value.openDialog(type, value,data.companyList);
}
const getCompanyList = async ()=>{
  const queryParams = {
    pageNum: 1,
    pageSize: 999
  }
  const res = await getCompany(queryParams)
  if (res.code == 200) {
    data.companyList = res.data.list?res.data.list:[]
    // data.queryParams.companyId = data.companyList[0].id
  } else {
    ElMessage.warning(res.message)
  }
}
const handleSizeChange = (val) => {
  data.queryParams.pageSize = val
  getList()
}
const handleCurrentChange = (val) => {
  data.queryParams.pageNum = val
  getList()
}

/** 重置新增的表单以及其他数据  */
function reset() {
  data.queryParams = {
    companyId: '',
    pageNum: 1,
    pageSize: 10,
  }
  choosedData.value = []
  data.companyList = [];
  getList();
  getCompanyList()

}
const exportData = () => {
  if(data.isAdmin && !data.queryParams.companyId){
    ElMessage.warning('管理员请先选择企业')
  }else {
    startGeneration()
  }
}
const templatePath = '/customerListExample.docx'
const startGeneration = async () => {
  const data = {}
  data.name = dataList.value[0].companyName
  data.tableData = dataList.value.map((item,index) => {
    return {
      ...item,
      num: index + 1
    }
  })
  try {
    generateWordDocument(templatePath, data, data.name+'_顾客清单.docx');
  } catch (error){
    ElMessage({
      type: 'warning',
      message: '导出失败'
    });
  }

}


const handleSelectionChange = (val) => {
  choosedData.value = val
}
const handleDelete = (val) => {
  ElMessageBox.confirm(
      '确定删除此条数据？',
      '提示',
      {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
      .then( async() => {
        const res = await delCustomer(val.id);
        if(res.code === 200){
          ElMessage({
            type: 'success',
            message: '删除成功'
          });
          await getList();
        }else{
          ElMessage.warning(res.message)
        }
      })
}

</script>
<style lang="scss">
.pag-container{
  float: right;
  margin-top: 10px;
}
</style>

 src/views/work/marketingManagement/customerList/need/components/editDialog.vue

New file
@@ -0,0 +1,391 @@
<template>
  <div class="notice">
    <el-dialog
        v-model="dialogVisible"
        :title="title"
        width="800px"
        :before-close="handleClose"
        :close-on-press-escape="false"
        :close-on-click-modal="false"
    >
      <el-form :model="state.form" size="default" ref="busRef" :rules="state.rules"  label-position="right" label-width="130">
        <el-row :gutter="24">
          <el-col :span="24">
            <el-form-item label="企业名称:" prop="companyId" v-if="state.isAdmin">
              <el-select v-model="state.form.companyId" placeholder="请选择" filterable clearable style="width: 100%" :disabled="title == '查看' || title == '编辑' || !state.isAdmin" @change="selectValueCom">
                <el-option
                    v-for="item in state.companyList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="24">
            <el-form-item label="记录名称:" prop="recordName" >
              <el-input  :disabled="title === '查看'" v-model="state.form.recordName" placeholder="记录名称"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="24">
            <el-form-item label="需求登记列表:" prop="customerRecordNeeds" >
              <el-button
                  :disabled="title === '查看'"
                  type="primary"
                  @click="addTableData"
                  style="margin-left: 10px;margin-bottom: 10px"
              >新增</el-button>
              <div style="display: flex;width: 100%;">
                <el-table :data="state.form.customerRecordNeeds" :border="true" >
                  <el-table-column type="index" label="序号"  align="center"></el-table-column>
                  <el-table-column label="顾客名称" prop="customerName" align="center" width="150">
                    <template  #default="{row,$index}">
                      <el-form-item :prop="'customerRecordNeeds.' + '[' + $index + ']' + 'customerName'" :rules="state.rules.customerName">
                        <el-input style="margin-top: 10px" :disabled="title === '查看'" type="textarea" :rows="4" v-model="row.customerName" placeholder="请输入"></el-input>
                      </el-form-item>
                    </template>
                  </el-table-column>
                  <el-table-column label="顾客需求" prop="customerNeed" align="center" width="150">
                    <template #default="{row,$index}">
                      <div v-for="(i,index) in row.expectContentMesses" :key="index">
                        <el-form-item :prop="'customerRecordNeeds.' + '[' + $index + '].' +'expectContentMesses.' + '[' + index + ']' + '.customerNeed'" :rules="state.rules.customerNeed">
                          <el-input style="margin-top: 10px" :disabled="title === '查看'" type="textarea" :rows="4" v-model="i.customerNeed" placeholder="请输入"></el-input>
                        </el-form-item>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column label="需求来源" prop="needSource" align="center" width="180">
                    <template #default="{row,$index}">
                      <div v-for="(i,index) in row.expectContentMesses" :key="index">
                        <el-form-item :prop="'customerRecordNeeds.' + '[' + $index + '].' +'expectContentMesses.' + '[' + index + ']' + '.needSource'" :rules="state.rules.needSource">
                          <el-checkbox-group v-model="i.needSource" style="display: flex" :disabled="title === '查看'">
                            <el-checkbox label="1" value="1" style="width: 25px;" >走访</el-checkbox>
                            <el-checkbox label="2" value="2" style="width: 25px;">网调</el-checkbox>
                            <el-checkbox label="3" value="3" style="width: 20px;">其他</el-checkbox>
                          </el-checkbox-group>
                        </el-form-item>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column label="登记人" prop="registrantId" align="center" width="150">
                    <template #default="{row,$index}">
                      <div v-for="(i,index) in row.expectContentMesses" :key="index">
                        <el-form-item :prop="'customerRecordNeeds.' + '[' + $index + '].' +'expectContentMesses.' + '[' + index + ']' + '.registrantId'" :rules="state.rules.registrantId">
                          <el-select clearable v-model="i.registrantId" :disabled="title =='查看'" filterable  style="width: 240px;margin-bottom: 5px">
                            <el-option
                                v-for="item in state.peopleList"
                                :key="item.id"
                                :label="item.name"
                                :value="item.id"
                            />
                          </el-select>
                        </el-form-item>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column label="处理部门" prop="disposeId" align="center" width="150">
                    <template #default="{row,$index}">
                      <div v-for="(i,index) in row.expectContentMesses" :key="index">
                        <el-form-item :prop="'customerRecordNeeds.' + '[' + $index + '].' +'expectContentMesses.' + '[' + index + ']' + '.disposeId'" :rules="state.rules.disposeId">
                          <el-select
                              :disabled="title === '查看'"
                              v-model="i.disposeId"
                              placeholder="请选择部门"
                              style="width: 240px;margin-bottom: 5px"
                          >
                            <el-option
                                v-for="item in state.deptList"
                                :key="item.deptId"
                                :label="item.deptName"
                                :value="item.deptId"
                            />
                          </el-select>
                        </el-form-item>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column label="处理结果" prop="disposeMess" align="center" width="150">
                    <template #default="{row,$index}">
                      <div v-for="(i,index) in row.expectContentMesses" :key="index">
                        <el-form-item :prop="'customerRecordNeeds.' + '[' + $index + '].' +'expectContentMesses.' + '[' + index + ']' + '.disposeMess'" :rules="state.rules.disposeMess">
                          <el-input style="margin-top: 10px" :disabled="title === '查看'" type="textarea" :rows="4" v-model="i.disposeMess" placeholder="请输入"></el-input>
                        </el-form-item>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column label="备注" prop="remark" align="center" width="150">
                    <template #default="{row,$index}">
                      <div v-for="(i,index) in row.expectContentMesses" :key="index">
                        <el-form-item :prop="'customerRecordNeeds.' + '[' + $index + '].' +'expectContentMesses.' + '[' + index + ']' + '.remark'" :rules="state.rules.remark">
                          <el-input style="margin-top: 10px" :disabled="title === '查看'" type="textarea" :rows="4" v-model="i.remark" placeholder="请输入"></el-input>
                        </el-form-item>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column label="操作" align="center"  v-if="title !== '查看'" >
                    <template #default="scope">
<!--                      <el-button link type="primary"  @click="addObject(scope.row,scope.$index)" >添加</el-button>-->
                      <el-button link type="danger"  @click="delObject(scope.row,scope.$index)" >删除</el-button>
                    </template>
                  </el-table-column>
                </el-table>

              </div>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <template #footer v-if="title !== '查看'">
        <span class="dialog-footer">
            <el-button @click="handleClose" size="default">取 消</el-button>
            <el-button type="primary"  @click="onSubmit" size="default" v-preReClick>确认</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>
<script setup>
import {onMounted, reactive, ref, toRefs} from 'vue'
import Cookies from "js-cookie";
import {getCompany} from "@/api/onlineEducation/company";
import {ElMessage} from "element-plus";
import {getUser} from "@/api/onlineEducation/user";
import {getDept, getObject, getObjectPage} from "@/api/qualityObjectives/object";
import {addTable, editTable, getTargetById} from "@/api/qualityObjectives/table";
import {addNeedDiscren, editNeedDiscren} from "@/api/need/need";
import {addCustomerNeed, editCustomerNeed} from "@/api/customerNeed";

const dialogVisible = ref(false);
const title = ref("");
const busRef = ref();
const length = ref()
const selectPopperClass = "max-width-select";
const emit = defineEmits(["getList"]);
const dataRef = ref();
const state = reactive({
  form: {
    id: '',
    companyId: null,
    recordName: null,
    customerRecordNeeds:[],
  },
  rules: {
    companyId: [{ required: true, message: '请选择企业', trigger: 'blur' }],
    recordName: [{ required: true, message: '请输入记录名称', trigger: 'blur' }],
    customerName: [{required: true, message: "", trigger: "blur"}],
    customerNeed: [{required: true, message: "", trigger: "blur"}],
    needSource: [{required: true, message: "", trigger: "blur"}],
    registrantId: [{required: true, message: "", trigger: "blur"}],
    disposeId: [{required: true, message: "", trigger: "blur"}],
    disposeMess: [{required: true, message: "", trigger: "blur"}],
    customerRecordNeeds:[{ required: true, message: '请填写需求登记列表', trigger: 'blur' }],
  },
  peopleList: [],
  isAdmin: false,
  companyList: [],
  deptList: [],
})

onMounted(() => {


});
const openDialog = async (type, value,companyList) => {
  const userInfo = JSON.parse(Cookies.get('userInfo'))
  state.isAdmin = userInfo.userType === 0;
  state.form.companyName = userInfo.companyName
  state.form.companyId = userInfo.companyId
  if(state.isAdmin){
    state.form.companyId = value.companyId
    state.form.companyName = value.companyName
    state.companyList = companyList
  }
  title.value = type === 'add' ? '新增' : type ==='edit' ? '编辑' : '查看' ;
  if(type === 'edit' || type === 'review') {
    state.form = JSON.parse(JSON.stringify(value));
    if(state.isAdmin){
      state.form.companyId = value.companyId
      state.form.companyName = value.companyName
    }
    state.form.customerRecordNeeds.forEach(item => {
      item.customerName =  item.customerName
      const obj = {
        recordId: state.form.id,
        customerNeed: item.customerNeed,
        disposeId: item.disposeId,
        disposeMess: item.disposeMess,
        needSource: item.needSource?.split(','),
        registrantId: item.registrantId,
        remark: item.remark,
      }
      item.expectContentMesses=[obj]
    })
    console.log('xx',state.form)

  }
  await getDeptList()
  await getPeopleList()
  dialogVisible.value = true;
}
const onSubmit = async () => {
  console.log('state.form',state.form)
  let dataDemo = JSON.parse(JSON.stringify(state.form))
  let dataArr = []
  dataArr = dataDemo.customerRecordNeeds.map(item => {
    return {
      customerName: item.customerName,
      customerNeed: item.expectContentMesses[0].customerNeed,
      disposeId: item.expectContentMesses[0].disposeId,
      disposeMess: item.expectContentMesses[0].disposeMess,
      needSource: item.expectContentMesses[0].needSource?.join(','),
      registrantId: item.expectContentMesses[0].registrantId,
      remark: item.expectContentMesses[0].remark,
    }
  })
  dataDemo.customerRecordNeeds = dataArr
  const valid = await busRef.value.validate();
  if(valid){
    if(title.value === '新增'){
      const {id, ...data} = dataDemo
      const res = await addCustomerNeed(data)
      if(res.code === 200){
        ElMessage({
          type: 'success',
          message: '新增成功'
        });
      }else{
        ElMessage.warning(res.message)
      }
      emit("getList")
      busRef.value.clearValidate();
      reset();
      dialogVisible.value = false;
    }else if(title.value === '编辑'){
      const {...data} = dataDemo
      data.customerRecordNeeds.forEach(i => {
        i.recordId = data.id
      })
      const res = await editCustomerNeed(data)
      if(res.code === 200){
        ElMessage({
          type: 'success',
          message: '编辑成功'
        });
      }else{
        ElMessage.warning(res.message)
      }
      emit("getList")
      busRef.value.clearValidate();
      reset();
      dialogVisible.value = false;
    }
  }
}
const getDeptList = async () => {
  if(state.isAdmin && (state.form.companyId == 0 || state.form.companyId == null)){
    return
  }
  const param = {
    pageNum: 1,
    pageSize: 999,
    companyId: state.form.companyId
  }
  const res = await getDept(param)
  if(res.code === 200){
    state.deptList = res.data
  }
}
const getPeopleList = async ()=> {
  if(state.isAdmin && (state.form.companyId == 0 || state.form.companyId == null)){
    return
  }
  const queryParams = {
    pageNum: 1,
    pageSize: 9999,
    companyId: state.form.companyId
  }
  const res = await getUser(queryParams)
  if(res.code == 200){
    state.peopleList = res.data.list?res.data.list:[]
  }else{
    ElMessage.warning(res.message)
  }
};
const handleClose = () => {
  busRef.value.clearValidate();
  reset();
  dialogVisible.value = false;
  emit("getList")

}
const reset = () => {
  state.form = {
    id: '',
    companyId: null,
    recordName: null,
    customerRecordNeeds:[],
  }
  state.companyList = []
}

const selectValueCom = (val) => {
  state.form.customerRecordNeeds.forEach(item => {
    item.expectContentMesses.forEach(i => {
      i.disposeId = null
      i.registrantId = null
    })
  })
  state.companyList.forEach(item => {
    if(item.name === val){
      state.form.companyId = item.id
    }
  })
  getDeptList()
  getPeopleList()
}


const addTableData = () => {
  state.form.customerRecordNeeds.push({expectContentMesses: [{}]})
}
const addObject = (val,itemIndex) => {
  state.form.customerRecordNeeds.forEach((item,index) => {
    if(index == itemIndex){
      item.expectContentMesses.push({})
    }
  })
}
const delObject = (val,itemIndex) => {
  state.form.customerRecordNeeds.forEach((item,index) => {
    if(index == itemIndex){
      if(item.expectContentMesses.length == 1){
        state.form.customerRecordNeeds.splice(index,1)
      }else {
        item.expectContentMesses.pop()
      }
    }
  })
}

defineExpose({
  openDialog
});

</script>

<style scoped lang="scss">
.notice{
  :deep(.el-form .el-form-item__label) {
    font-size: 15px;
  }
  .file {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
}
</style>

 src/views/work/marketingManagement/customerList/need/index.vue

New file
@@ -0,0 +1,261 @@
<template>
  <div class="app-container">
    <div style="margin-bottom: 10px">
      <el-form style="display: flex;flex-wrap: wrap;">
        <el-form-item>
          <el-button
              type="primary"
              plain
              icon="Plus"
              @click="openDialog('add',{})"
          >新增</el-button>
        </el-form-item>
        <el-form-item label="企业名称:" v-if="data.isAdmin" style="margin-left: 20px">
          <el-select v-model="data.queryParams.companyId" placeholder="请选择" filterable clearable>
            <el-option
                v-for="item in data.companyList"
                :key="item.id"
                :label="item.name"
                :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" style="margin-left: 30px" @click="searchClick">查询</el-button>
          <el-button plain @click="reset">重置</el-button>
        </el-form-item>
        <el-form-item style="margin-left: 15px">
          <el-button
              type="primary"
              @click="exportData"
          >导出</el-button>
        </el-form-item>
      </el-form>
    </div>
    <!-- 表格数据 -->
    <el-table v-loading="loading" :data="dataList" :border="true"  @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" />
      <el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
      <el-table-column label="企业名称" prop="companyName" align="center" v-if="data.isAdmin" />
      <el-table-column label="名称"  align="center">
        <template #default="scope">
          <span>{{scope.row.recordName}}需求登记</span>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="160">
        <template #default="scope">
          <el-button link type="primary"  @click="openDialog('review',scope.row)" >查看</el-button>
          <el-button link type="primary"  @click="openDialog('edit',scope.row)" >编辑</el-button>
          <el-button link type="danger"  @click="handleDelete(scope.row)" >删除</el-button>
        </template>
      </el-table-column>
    </el-table>

    <div class="pag-container">
      <el-pagination
          v-model:current-page="data.queryParams.pageNum"
          v-model:page-size="data.queryParams.pageSize"
          :page-sizes="[10,15,20,25]"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
      />
    </div>
    <editDialog ref="noticeRef" @getList = "getList"></editDialog>
  </div>
</template>

<script setup>
import {getCurrentInstance, onMounted, reactive, ref, toRefs} from "vue";
import editDialog from "./components/editDialog.vue"
import {ElMessage, ElMessageBox} from "element-plus";
import {getCompany} from "@/api/onlineEducation/company";
import Cookies from "js-cookie";
import {generateWordDocument} from "@/utils/exportWord";
import {delTable, getTable} from "@/api/qualityObjectives/table";
import {delNeedDiscren, getNeedDiscren} from "@/api/need/need";
import {delCustomerNeed, getCustomerNeed} from "@/api/customerNeed";
const { proxy } = getCurrentInstance();
const loading = ref(false);
const noticeRef = ref();
const deptRef = ref()
const loadingCompany = ref(false)
const choosedData = ref([])
const data = reactive({
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    companyId: null,
  },
  companyList: [],
  isAdmin: false,
  dialogVisible: false,
});
const dataList = ref([]);
const total = ref(0);

const { queryParams } = toRefs(data);

onMounted(() => {
  const userInfo = JSON.parse(Cookies.get('userInfo'))
  console.log("userInfo",userInfo)
  data.isAdmin = userInfo.userType === 0;
  if(data.isAdmin){
    data.queryParams.companyId = null
  }else {
    data.queryParams.companyId = userInfo.companyId
  }
  getList();
  if(data.isAdmin){
    getCompanyList()
  }
});
const getList = async () => {
  loading.value = true;
  const res = await getCustomerNeed(data.queryParams);
  if(res.code === 200){
    dataList.value = res.data.list
    total.value = res.data.total
  }else{
    ElMessage.warning(res.message)
  }
  loading.value = false;
}

const searchClick = () => {
  getList();
}

const openDialog = (type, value) => {
  noticeRef.value.openDialog(type, value,data.companyList);
}

const getCompanyList = async ()=>{
  const queryParams = {
    pageNum: 1,
    pageSize: 999
  }
  const res = await getCompany(queryParams)
  if (res.code == 200) {
    data.companyList = res.data.list?res.data.list:[]
  } else {
    ElMessage.warning(res.message)
  }
}

const handleSizeChange = (val) => {
  data.queryParams.pageSize = val
  getList()
}
const handleCurrentChange = (val) => {
  data.queryParams.pageNum = val
  getList()
}
const handleClose = () => {
  data.dialogVisible = false
}

/** 重置新增的表单以及其他数据  */
function reset() {
  if(data.isAdmin){
    data.queryParams = {
      companyId: '',
      pageNum: 1,
      pageSize: 10,
    }
    choosedData.value = []
    data.companyList = [];
    getCompanyList()
  }else {
    data.queryParams = {
      companyId: data.queryParams.companyId,
      pageNum: 1,
      pageSize: 10,
    }
  }
  getList();

}
const exportData = () => {
  if(choosedData.value && choosedData.value.length === 0){
    ElMessage.warning('请选择需要导出的数据')
  }else {
    startGeneration()
  }
}
const templatePath = ref('/customerNeedExample.docx')
const startGeneration = async () => {
  const data = JSON.parse(JSON.stringify(choosedData.value))
  data.forEach(item => {
    item.customerRecordNeeds.forEach(i => {
      i.customerName =  i.customerName
      const obj = {
        customerNeed: i.customerNeed,
        disposeId: i.disposeId,
        disposeMess: i.disposeMess,
        registrantId: i.registrantId,
        remark: i.remark,
        visit: !!i.needSource?.split(',').includes('1'),
        network: !!i.needSource?.split(',').includes('2'),
        other: !!i.needSource?.split(',').includes('3'),
      }
      i.expectContentMesses=[obj]
    })
    item.tableData = item.customerRecordNeeds.map((i,index) => {
      return{
        ...i,
        expectContentMesses: i.expectContentMesses.map((q,qindex) => {
          return{
            ...q,
            first: qindex == 0,
            num: index+1,
          }
        })
      }
    })
    console.log('xxx',item.tableData)
    try {
      generateWordDocument(templatePath.value, item, item.companyName + `_顾客需求登记表.docx`);
    } catch (error){
      ElMessage({
        type: 'warning',
        message: '导出失败'
      });
    }
  })
}
const handleSelectionChange = (val) => {
  choosedData.value = val
}
const handleDelete = (val) => {
  ElMessageBox.confirm(
      '确定删除此条数据？',
      '提示',
      {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
      .then( async() => {
        const res = await delCustomerNeed(val.id);
        if(res.code === 200){
          ElMessage({
            type: 'success',
            message: '删除成功'
          });
          await getList();
        }else{
          ElMessage.warning(res.message)
        }
      })
}


</script>
<style lang="scss">
.pag-container{
  float: right;
  margin-top: 10px;
}
</style>

 src/views/work/procurementPlatform/warehouseManagement/monthlyInspectionRecord/components/editDialog.vue

New file
@@ -0,0 +1,354 @@
<template>
  <div class="notice">
    <el-dialog
        v-model="dialogVisible"
        :title="title"
        width="850px"
        :before-close="handleClose"
        :close-on-press-escape="false"
        :close-on-click-modal="false"
    >
      <el-form :model="state.form" size="default" ref="busRef" :rules="state.rules"  label-position="right" label-width="130">
        <el-row :gutter="24">
          <el-col :span="24">
            <el-form-item label="企业名称:" prop="companyId" v-if="state.isAdmin">
              <el-select v-model="state.form.companyId" placeholder="请选择" filterable clearable style="width: 100%" :disabled="title == '查看' || title == '编辑' || !state.isAdmin" @change="selectValueCom">
                <el-option
                    v-for="item in state.companyList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="24">
            <el-form-item label="记录名称:" prop="year" >
              <el-input  :disabled="title === '查看'" v-model="state.form.name" placeholder="记录名称"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-col :span="24">
            <el-form-item label="月度检查记录:" prop="expectContents" >
              <el-button
                  :disabled="title === '查看'"
                  type="primary"
                  @click="addTableData"
                  style="margin-left: 10px;margin-bottom: 10px"
              >新增</el-button>
              <div style="display: flex;width: 100%;">
                <el-table :data="state.form.expectContents" :border="true" >
                  <el-table-column type="index" label="序号"  align="center"></el-table-column>
                  <el-table-column label="时间" prop="name" align="center" width="150">
                    <template  #default="{row,$index}">
                      <el-form-item :prop="'expectContents.' + '[' + $index + ']' + 'name'" :rules="state.rules.name">
                        <el-input style="margin-top: 10px" :disabled="title === '查看'" type="textarea" :rows="2" v-model="row.name" placeholder="请输入"></el-input>
                      </el-form-item>
                    </template>
                  </el-table-column>
                  <el-table-column label="检查人" prop="name" align="center" width="150">
                    <template  #default="{row,$index}">
                      <el-form-item :prop="'expectContents.' + '[' + $index + ']' + 'name'" :rules="state.rules.name">
                        <el-input style="margin-top: 10px" :disabled="title === '查看'" type="textarea" :rows="2" v-model="row.name" placeholder="请输入"></el-input>
                      </el-form-item>
                    </template>
                  </el-table-column>
                  <el-table-column label="防护" prop="name" align="center" width="150">
                    <template  #default="{row,$index}">
                      <el-form-item :prop="'expectContents.' + '[' + $index + ']' + 'name'" :rules="state.rules.name">
                        <el-input style="margin-top: 10px" :disabled="title === '查看'" type="textarea" :rows="2" v-model="row.name" placeholder="请输入"></el-input>
                      </el-form-item>
                    </template>
                  </el-table-column>
                  <el-table-column label="标识" prop="name" align="center" width="150">
                    <template  #default="{row,$index}">
                      <el-form-item :prop="'expectContents.' + '[' + $index + ']' + 'name'" :rules="state.rules.name">
                        <el-input style="margin-top: 10px" :disabled="title === '查看'" type="textarea" :rows="2" v-model="row.name" placeholder="请输入"></el-input>
                      </el-form-item>
                    </template>
                  </el-table-column>
                  <el-table-column label="摆放" prop="name" align="center" width="150">
                    <template  #default="{row,$index}">
                      <el-form-item :prop="'expectContents.' + '[' + $index + ']' + 'name'" :rules="state.rules.name">
                        <el-input style="margin-top: 10px" :disabled="title === '查看'" type="textarea" :rows="2" v-model="row.name" placeholder="请输入"></el-input>
                      </el-form-item>
                    </template>
                  </el-table-column>
                  <el-table-column label="清洁" prop="name" align="center" width="150">
                    <template  #default="{row,$index}">
                      <el-form-item :prop="'expectContents.' + '[' + $index + ']' + 'name'" :rules="state.rules.name">
                        <el-input style="margin-top: 10px" :disabled="title === '查看'" type="textarea" :rows="2" v-model="row.name" placeholder="请输入"></el-input>
                      </el-form-item>
                    </template>
                  </el-table-column>
                  <el-table-column label="安全" prop="name" align="center" width="150">
                    <template  #default="{row,$index}">
                      <el-form-item :prop="'expectContents.' + '[' + $index + ']' + 'name'" :rules="state.rules.name">
                        <el-input style="margin-top: 10px" :disabled="title === '查看'" type="textarea" :rows="2" v-model="row.name" placeholder="请输入"></el-input>
                      </el-form-item>
                    </template>
                  </el-table-column>
                  <el-table-column label="环境" prop="name" align="center" width="150">
                    <template  #default="{row,$index}">
                      <el-form-item :prop="'expectContents.' + '[' + $index + ']' + 'name'" :rules="state.rules.name">
                        <el-input style="margin-top: 10px" :disabled="title === '查看'" type="textarea" :rows="2" v-model="row.name" placeholder="请输入"></el-input>
                      </el-form-item>
                    </template>
                  </el-table-column>
                  <el-table-column label="帐务卡一致性" prop="name" align="center" width="150">
                    <template  #default="{row,$index}">
                      <el-form-item :prop="'expectContents.' + '[' + $index + ']' + 'name'" :rules="state.rules.name">
                        <el-input style="margin-top: 10px" :disabled="title === '查看'" type="textarea" :rows="2" v-model="row.name" placeholder="请输入"></el-input>
                      </el-form-item>
                    </template>
                  </el-table-column>
                  <el-table-column label="操作" align="center"  v-if="title !== '查看'" >
                    <template #default="scope">
                      <el-button link type="danger"  @click="delObject(scope.row,scope.$index)" >删除</el-button>
                    </template>
                  </el-table-column>
                </el-table>

              </div>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <template #footer v-if="title !== '查看'">
        <span class="dialog-footer">
            <el-button @click="handleClose" size="default">取 消</el-button>
            <el-button type="primary"  @click="onSubmit" size="default" v-preReClick>确认</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>
<script setup>
import {onMounted, reactive, ref, toRefs} from 'vue'
import Cookies from "js-cookie";
import {getCompany} from "@/api/onlineEducation/company";
import {ElMessage} from "element-plus";
import {getUser} from "@/api/onlineEducation/user";
import {getDept, getObject, getObjectPage} from "@/api/qualityObjectives/object";
import {addTable, editTable, getTargetById} from "@/api/qualityObjectives/table";
import {addNeedDiscren, editNeedDiscren} from "@/api/need/need";

const dialogVisible = ref(false);
const title = ref("");
const busRef = ref();
const length = ref()
const selectPopperClass = "max-width-select";
const emit = defineEmits(["getList"]);
const dataRef = ref();
const state = reactive({
  form: {
    id: '',
    companyId: null,
    deptId: null,
    year: '',
    fictionId: null,
    checkId: null,
    ratifyId: null,
    fictionTime: null,
    frequency: '',
    expectContents:[],
  },
  rules: {
    companyId: [{ required: true, message: '请选择企业', trigger: 'blur' }],
    deptId: [{ required: true, message: '请选择部门', trigger: 'blur' }],
    year: [{ required: true, message: '请选择年份', trigger: 'blur' }],
    fictionId: [{ required: true, message: '请选择编制人', trigger: 'blur' }],
    ratifyId: [{ required: true, message: '请选择批准人', trigger: 'blur' }],
    checkId: [{ required: true, message: '请选择审核人', trigger: 'blur' }],
    fictionTime: [{ required: true, message: '请选择日期', trigger: 'blur' }],
    frequency: [{ required: true, message: '请输入监测频率', trigger: 'blur' }],
    stakeholder: [{required: true, message: "", trigger: "blur"}],
    expectation: [{required: true, message: "", trigger: "blur"}],
    solutions: [{required: true, message: "", trigger: "blur"}],
    expectContents:[{ required: true, message: '请填写相关方期望或要求识别表', trigger: 'blur' }],
  },
  peopleList: [],
  isAdmin: false,
  companyList: [],
  deptList: [],
})

onMounted(() => {


});
const openDialog = async (type, value,companyList) => {
  const userInfo = JSON.parse(Cookies.get('userInfo'))
  state.isAdmin = userInfo.userType === 0;
  state.form.companyName = userInfo.companyName
  state.form.companyId = userInfo.companyId
  if(state.isAdmin){
    state.form.companyId = value.companyId
    state.form.companyName = value.companyName
    state.companyList = companyList
  }
  title.value = type === 'add' ? '新增' : type ==='edit' ? '编辑' : '查看' ;
  if(type === 'edit' || type === 'review') {
    state.form = JSON.parse(JSON.stringify(value));
    if(state.isAdmin){
      state.form.companyId = value.companyId
      state.form.companyName = value.companyName
    }
  }
  await getDeptList()
  await getPeopleList()
  dialogVisible.value = true;
}
const onSubmit = async () => {
  console.log('state.form',state.form)
  const valid = await busRef.value.validate();
  if(valid){
    if(title.value === '新增'){
      // console.log('sta',state.form)
      // const {id, ...data} = JSON.parse(JSON.stringify(state.form))
      // const res = await addNeedDiscren(data)
      // if(res.code === 200){
      //   ElMessage({
      //     type: 'success',
      //     message: '新增成功'
      //   });
      // }else{
      //   ElMessage.warning(res.message)
      // }
      // emit("getList")
      // busRef.value.clearValidate();
      // reset();
      // dialogVisible.value = false;
    }else if(title.value === '编辑'){
      const {...data} = JSON.parse(JSON.stringify(state.form))
      const res = await editNeedDiscren(data)
      if(res.code === 200){
        ElMessage({
          type: 'success',
          message: '编辑成功'
        });
      }else{
        ElMessage.warning(res.message)
      }
      emit("getList")
      busRef.value.clearValidate();
      reset();
      dialogVisible.value = false;
    }
  }
}
const getDeptList = async () => {
  if(state.isAdmin && (state.form.companyId == 0 || state.form.companyId == null)){
    return
  }
  const param = {
    pageNum: 1,
    pageSize: 999,
    companyId: state.form.companyId
  }
  const res = await getDept(param)
  if(res.code === 200){
    state.deptList = res.data
  }
}
const getPeopleList = async ()=> {
  if(state.isAdmin && (state.form.companyId == 0 || state.form.companyId == null)){
    return
  }
  const queryParams = {
    pageNum: 1,
    pageSize: 9999,
    companyId: state.form.companyId
  }
  const res = await getUser(queryParams)
  if(res.code == 200){
    state.peopleList = res.data.list?res.data.list:[]
  }else{
    ElMessage.warning(res.message)
  }
};
const handleClose = () => {
  busRef.value.clearValidate();
  reset();
  dialogVisible.value = false;
  emit("getList")

}
const reset = () => {
  state.form = {
    id: '',
    companyId: null,
    deptId: null,
    year: '',
    fictionId: null,
    checkId: null,
    ratifyId: null,
    fictionTime: null,
    frequency: '',
    expectContents:[],
  }
  state.companyList = []
}





const selectValueCom = (val) => {
  state.form.fictionId = null
  state.form.checkId = null
  state.form.ratifyId = null
  state.form.deptId = null
  state.companyList.forEach(item => {
    if(item.name === val){
      state.form.companyId = item.id
    }
  })
  getDeptList()
  getPeopleList()
}


const addTableData = () => {
  state.form.expectContents.push({expectContentMesses: [{}]})
}
const addObject = (val,itemIndex) => {
  state.form.expectContents.forEach((item,index) => {
    if(index == itemIndex){
      item.expectContentMesses.push({})
    }
  })
}
const delObject = (val,itemIndex) => {
  state.form.expectContents.forEach((item,index) => {
    if(index == itemIndex){
      if(item.expectContentMesses.length == 1){
        state.form.expectContents.splice(index,1)
      }else {
        item.expectContentMesses.pop()
      }
    }
  })
}

defineExpose({
  openDialog
});

</script>

<style scoped lang="scss">
.notice{
  :deep(.el-form .el-form-item__label) {
    font-size: 15px;
  }
  .file {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
}
</style>

 src/views/work/procurementPlatform/warehouseManagement/monthlyInspectionRecord/index.vue

New file
@@ -0,0 +1,271 @@
<template>
  <div class="app-container">
    <div style="margin-bottom: 10px">
      <el-form style="display: flex;flex-wrap: wrap;">
        <el-form-item>
          <el-button
              type="primary"
              plain
              icon="Plus"
              @click="openDialog('add',{})"
          >新增</el-button>
        </el-form-item>
        <el-form-item label="企业名称:" v-if="data.isAdmin" style="margin-left: 20px">
          <el-select v-model="data.queryParams.companyId" placeholder="请选择" filterable clearable>
            <el-option
                v-for="item in data.companyList"
                :key="item.id"
                :label="item.name"
                :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" style="margin-left: 30px" @click="searchClick">查询</el-button>
          <el-button plain @click="reset">重置</el-button>
        </el-form-item>
        <el-form-item style="margin-left: 15px">
          <el-button
              type="primary"
              @click="exportData"
          >导出</el-button>
        </el-form-item>
      </el-form>
    </div>
    <!-- 表格数据 -->
    <el-table v-loading="loading" :data="dataList" :border="true"  @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" />
      <el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
      <el-table-column label="名称"  align="center">
        <template #default="scope">
          <span>{{scope.row.deptName}}登记</span>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="160">
        <template #default="scope">
          <el-button link type="primary"  @click="openDialog('review',scope.row)" >查看</el-button>
          <el-button link type="primary"  @click="openDialog('edit',scope.row)" >编辑</el-button>
          <el-button link type="danger"  @click="handleDelete(scope.row)" >删除</el-button>
        </template>
      </el-table-column>
    </el-table>

    <div class="pag-container">
      <el-pagination
          v-model:current-page="data.queryParams.pageNum"
          v-model:page-size="data.queryParams.pageSize"
          :page-sizes="[10,15,20,25]"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
      />
    </div>
    <editDialog ref="noticeRef" @getList = "getList"></editDialog>
  </div>
</template>

<script setup>
import {getCurrentInstance, onMounted, reactive, ref, toRefs} from "vue";
import editDialog from "./components/editDialog.vue"
import {ElMessage, ElMessageBox} from "element-plus";
import {getCompany} from "@/api/onlineEducation/company";
import Cookies from "js-cookie";
import {generateWordDocument} from "@/utils/exportWord";
import {delTable, getTable} from "@/api/qualityObjectives/table";
import {delNeedDiscren, getNeedDiscren} from "@/api/need/need";
const { proxy } = getCurrentInstance();
const loading = ref(false);
const noticeRef = ref();
const deptRef = ref()
const loadingCompany = ref(false)
const choosedData = ref([])
const data = reactive({
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    companyId: null,
    year: '',
    type: ''
  },
  companyList: [],
  isAdmin: false,
  dialogVisible: false,
});
const dataList = ref([]);
const total = ref(0);

const { queryParams } = toRefs(data);

onMounted(() => {
  const userInfo = JSON.parse(Cookies.get('userInfo'))
  console.log("userInfo",userInfo)
  data.isAdmin = userInfo.userType === 0;
  if(data.isAdmin){
    data.queryParams.companyId = null
  }else {
    data.queryParams.companyId = userInfo.companyId
  }
  getList();
  if(data.isAdmin){
    getCompanyList()
  }
});
const getList = async () => {
  // loading.value = true;
  // const res = await getNeedDiscren(data.queryParams);
  // if(res.code === 200){
  //   dataList.value = res.data.list
  //   total.value = res.data.total
  // }else{
  //   ElMessage.warning(res.message)
  // }
  // loading.value = false;
  dataList.value = [{}]
}

const searchClick = () => {
  getList();
}

const openDialog = (type, value) => {
  noticeRef.value.openDialog(type, value,data.companyList);
}

const getCompanyList = async ()=>{
  const queryParams = {
    pageNum: 1,
    pageSize: 999
  }
  const res = await getCompany(queryParams)
  if (res.code == 200) {
    data.companyList = res.data.list?res.data.list:[]
  } else {
    ElMessage.warning(res.message)
  }
}

const handleSizeChange = (val) => {
  data.queryParams.pageSize = val
  getList()
}
const handleCurrentChange = (val) => {
  data.queryParams.pageNum = val
  getList()
}
const handleClose = () => {
  data.dialogVisible = false
}

/** 重置新增的表单以及其他数据  */
function reset() {
  if(data.isAdmin){
    data.queryParams = {
      companyId: '',
      pageNum: 1,
      pageSize: 10,
    }
    choosedData.value = []
    data.companyList = [];
    getCompanyList()
  }else {
    data.queryParams = {
      companyId: data.queryParams.companyId,
      pageNum: 1,
      pageSize: 10,
    }
  }
  getList();

}
const exportData = () => {
  if(choosedData.value && choosedData.value.length === 0){
    ElMessage.warning('请选择需要导出的数据')
  }else {
    startGeneration()
  }
}
const templatePath = ref('/monthRecordExample.docx')
const startGeneration = async () => {
  const data = JSON.parse(JSON.stringify(choosedData.value))
  data.forEach(item => {
    item.expectContents = [
      {
        name: '张三',
        expectContentMesses: [
          {
            need: 'xxx',
            personName: 'x',
            visit:true,
            network: true,
            other: false

          },
          {
            need: '22',
            personName: '2',
            visit:false,
            network: false,
            other: true

          },
        ]
      }
    ]
    item.tableData = item.expectContents.map((i,index) => {
      return{
        ...i,
        expectContentMesses: i.expectContentMesses.map((q,qindex) => {
          return{
            ...q,
            first: qindex == 0,
            num: index+1,
          }
        })
      }
    })
    console.log('xxx',item.tableData)
    try {
      generateWordDocument(templatePath.value, item, item.companyName + `_月度检查记录表.docx`);
    } catch (error){
      ElMessage({
        type: 'warning',
        message: '导出失败'
      });
    }
  })
}
const handleSelectionChange = (val) => {
  choosedData.value = val
}
const handleDelete = (val) => {
  ElMessageBox.confirm(
      '确定删除此条数据？',
      '提示',
      {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
      .then( async() => {
        const res = await delNeedDiscren(val.id);
        if(res.code === 200){
          ElMessage({
            type: 'success',
            message: '删除成功'
          });
          getList();
        }else{
          ElMessage.warning(res.message)
        }
      })
}


</script>
<style lang="scss">
.pag-container{
  float: right;
  margin-top: 10px;
}
</style>