| | |
| | | :model="editConfig.infomation" |
| | | :rules="rules" |
| | | label-position="right" |
| | | label-width="308px" |
| | | label-width="168px" |
| | | size="mini" |
| | | > |
| | | <!-- 信息 --> |
| | |
| | | <div class="basic-info-view"> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="客户名称" prop="customName"> |
| | | <el-form-item label="单据编号" prop="number"> |
| | | <el-input |
| | | v-if=" |
| | | editConfig.title == '编辑' || |
| | | (editConfig.title == '新建' && codenumer && (explain != '' || isIdDisabled)) |
| | | " |
| | | :disabled="editConfig.title == '编辑'" |
| | | v-model="editConfig.infomation.number" |
| | | placeholder="请输入编码" |
| | | > |
| | | </el-input> |
| | | <span v-else-if="editConfig.title == '新建'" style="color: #f56c6c" |
| | | >请优先配置编码规范 <el-button type="text" @click="numberClick"> 配置规范 </el-button></span |
| | | > |
| | | <!-- <WordInput |
| | | v-if="codenumer && (explain != '' || isIdDisabled) && method == 0" |
| | | :codenumer="codenumer" |
| | | :sum="sum" |
| | | :disabled="editConfig.title !== '新建' || isIdDisabled" |
| | | :inputValue="inputValue" |
| | | @codeList="codeList" |
| | | /> |
| | | <span v-else-if="method == 0" style="color: #f56c6c" |
| | | >请优先配置编码规范 <el-button type="text" @click="numberClick"> 配置规范 </el-button></span |
| | | > |
| | | <span v-else>{{ editConfig.title === "新建" ? "自动生成" : editConfig.infomation.number }}</span> --> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="合同名称" prop="contractName"> |
| | | <div class="custom-name"> |
| | | <el-input v-model="editConfig.infomation.customName"></el-input> |
| | | <div class="common-select-btn"><i class="el-icon-circle-plus-outline" title="选择"></i></div> |
| | | <div class="common-select-btn"><i class="el-icon-edit" title="编辑"></i></div> |
| | | <el-input v-model="editConfig.infomation.contractName"></el-input> |
| | | </div> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="单据编号" prop="documentNumber"> |
| | | <el-input v-model="editConfig.infomation.documentNumber"></el-input> |
| | | <el-form-item label="客户名称" prop="client_name"> |
| | | <div class="custom-name"> |
| | | <el-autocomplete |
| | | v-model="editConfig.infomation.client_name" |
| | | :fetch-suggestions=" |
| | | (queryString, callback) => { |
| | | querySearchAsync(queryString, callback, 'client') |
| | | } |
| | | " |
| | | value-key="name" |
| | | @select="handleSelectClient('client', $event)" |
| | | style="width: 100%" |
| | | ></el-autocomplete> |
| | | <div class="common-select-btn" @click="selClientClick('client')"> |
| | | <i class="el-icon-circle-plus-outline" title="选择"></i> |
| | | </div> |
| | | <div |
| | | v-if="editConfig.infomation.client_name && editConfig.infomation.client_name.length > 0" |
| | | class="common-select-btn" |
| | | @click="clearupClient('client')" |
| | | > |
| | | <i class="el-icon-remove-outline" title="清除"></i> |
| | | </div> |
| | | </div> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="负责人" prop="owner"> |
| | | <el-select v-model="editConfig.infomation.owner" placeholder="请选择" size="mini" style="width: 63%"> |
| | | <el-option v-for="item in ownerOptions" :key="item.value" :label="item.label" :value="item.value"> |
| | | <el-form-item label="负责人" prop="memberId"> |
| | | <el-select |
| | | v-model="editConfig.infomation.memberId" |
| | | placeholder="请选择" |
| | | size="mini" |
| | | style="width: 100%" |
| | | > |
| | | <el-option v-for="item in memberOptions" :key="item.id" :label="item.username" :value="item.id"> |
| | | </el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="合同状态" prop="contractStatus"> |
| | | <CommonSelectView |
| | | :common-value="editConfig.infomation.contractStatus" |
| | | :common-options="contractStatusOptions" |
| | | /> |
| | | <el-form-item label="合同状态" prop="statusId"> |
| | | <div class="common-select"> |
| | | <el-select |
| | | v-model="editConfig.infomation.statusId" |
| | | placeholder="请选择" |
| | | class="common-select-sel" |
| | | size="mini" |
| | | style="width: 100%" |
| | | > |
| | | <el-option v-for="item in statusOptions" :key="item.id" :label="item.name" :value="item.id"> |
| | | </el-option> |
| | | </el-select> |
| | | <!-- <div class="common-select-btn"><i class="el-icon-setting"></i></div> --> |
| | | </div> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="销售报价单" prop="salesQuotation"> |
| | | <el-form-item label="销售报价单" prop="quotation_number"> |
| | | <div class="custom-name"> |
| | | <el-input v-model="editConfig.infomation.salesQuotation"></el-input> |
| | | <div class="common-select-btn"><i class="el-icon-circle-plus-outline" title="选择"></i></div> |
| | | <div class="common-select-btn"><i class="el-icon-edit" title="编辑"></i></div> |
| | | <el-autocomplete |
| | | v-model="editConfig.infomation.quotation_number" |
| | | :fetch-suggestions=" |
| | | (queryString, callback) => { |
| | | querySearchAsync(queryString, callback, 'quotation') |
| | | } |
| | | " |
| | | value-key="number" |
| | | @select="handleSelectClient('quotation', $event)" |
| | | style="width: 100%" |
| | | placeholder="请先选择客户名称" |
| | | :disabled="isAddQuatation" |
| | | ></el-autocomplete> |
| | | <div v-if="!isAddQuatation" class="common-select-btn" @click="selClientClick('quotation')"> |
| | | <i class="el-icon-circle-plus-outline" title="选择"></i> |
| | | </div> |
| | | <div |
| | | v-if=" |
| | | editConfig.infomation.quotation_number && |
| | | editConfig.infomation.quotation_number.length > 0 && |
| | | !isAddQuatation |
| | | " |
| | | class="common-select-btn" |
| | | @click="clearupClient('quotation')" |
| | | > |
| | | <i class="el-icon-remove-outline" title="清除"></i> |
| | | </div> |
| | | </div> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="发货日期" prop="sendTime"> |
| | | <el-date-picker |
| | | v-model="editConfig.infomation.sendTime" |
| | | value-format="yyyy-MM-dd" |
| | | type="date" |
| | | placeholder="选择日期" |
| | | style="width: 100%" |
| | | > |
| | | </el-date-picker> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | |
| | | </el-row> |
| | | </div> |
| | | <!-- 展开收起 --> |
| | | <div v-if="editConfig.title === '新建'" class="unflod-collapse" @click="unflodCollapseClick"> |
| | | <!-- <div v-if="editConfig.title === '新建'" class="unflod-collapse" @click="unflodCollapseClick"> |
| | | <div>{{ unflodCollapseStr }}</div> |
| | | <div v-if="isUnflod"><i class="el-icon-arrow-up"></i></div> |
| | | <div v-else><i class="el-icon-arrow-down"></i></div> |
| | | </div> |
| | | </div> --> |
| | | <!-- 选择审批流程 --> |
| | | <div class="basic-info-title">选择审批流程</div> |
| | | <!-- <div class="basic-info-title">选择审批流程</div> |
| | | <div class="basic-info-view"> |
| | | <el-row> |
| | | <el-col :span="20"> |
| | |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </div> |
| | | </div> --> |
| | | </div> |
| | | </el-form> |
| | | <div slot="footer" class="dialog-footer"> |
| | | <el-button type="primary" size="small" @click="editConfig.visible = false">保并提交审批</el-button> |
| | | <el-button type="primary" size="small" @click="editConfig.visible = false">保存</el-button> |
| | | <!-- <el-button type="primary" size="small" @click="editConfig.visible = false">保并提交审批</el-button> --> |
| | | <el-button type="primary" size="small" @click="saveClick('form')">保存</el-button> |
| | | <el-button size="small" @click="editConfig.visible = false">取消</el-button> |
| | | </div> |
| | | <!-- 选择客户 --> |
| | | <SelectClientDialog |
| | | v-if="editSelectClientConfig.editVisible" |
| | | :edit-common-config="editSelectClientConfig" |
| | | @selClient="selClient" |
| | | /> |
| | | <!-- 报价单 --> |
| | | <SelectCommonDialog |
| | | v-if="editSelCommonConfig.editVisible" |
| | | :edit-common-config="editSelCommonConfig" |
| | | @selClient="selClient" |
| | | /> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import CommonSelectView from "@/components/makepager/CommonSelectView" |
| | | import { getAllData } from "@/api/client/client" |
| | | import { getAddContract, getUpdateContract } from "@/api/sales/contractManage" |
| | | import SelectClientDialog from "@/views/other/commonDialog/SelectClientDialog" |
| | | import SelectCommonDialog from "@/views/other/commonDialog/SelectCommonDialog" |
| | | import codeMixin from "@/components/makepager/mixin/codeMixin" |
| | | import { getQuotationList } from "@/api/sales/quotation" |
| | | export default { |
| | | name: "AddContractManageDialog", |
| | | mixins: [codeMixin], |
| | | props: { |
| | | editCommonConfig: { |
| | | type: Object, |
| | |
| | | return { |
| | | visible: false, |
| | | title: "新建", |
| | | infomation: { |
| | | customName: "", |
| | | documentNumber: "TKD20230521-12", |
| | | owner: "", |
| | | contractStatus: "", |
| | | salesQuotation: "", |
| | | approvalWorkflow: "", |
| | | approvalSteps: "", |
| | | approvalPerson: "", |
| | | approvalOpinion: "" |
| | | } |
| | | infomation: {} |
| | | } |
| | | } |
| | | } |
| | | }, |
| | | components: { CommonSelectView }, |
| | | computed: {}, |
| | | components: { SelectClientDialog, SelectCommonDialog }, |
| | | computed: { |
| | | clientList() { |
| | | return this.$store.state.getClientName.clientList |
| | | } |
| | | // quotationList() { |
| | | // return this.$store.state.getClientName.quotationList |
| | | // } |
| | | }, |
| | | data() { |
| | | return { |
| | | dialogWidth: "80%", |
| | | dialogWidth: "50%", |
| | | editConfig: this.editCommonConfig, |
| | | rules: { |
| | | documentNumber: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | owner: [{ required: true, message: "请选择", trigger: "change" }] |
| | | number: [{ required: true, validator: this.validateCheckCode, trigger: ["blur", "change"] }], |
| | | client_name: [{ required: true, message: "请选择客户名称", trigger: "change" }], |
| | | member_id: [{ required: true, message: "请选择", trigger: "change" }], |
| | | contractName: [{ required: true, message: "请输入合同名称", trigger: "blur" }], |
| | | quotation_number: [{ required: true, message: "请选择销售报价单", trigger: "change" }] |
| | | }, |
| | | ownerOptions: [ |
| | | // 负责人 |
| | | { value: "1", label: "BOSS" }, |
| | | { value: "2", label: "Mia" }, |
| | | { value: "3", label: "财务" }, |
| | | { value: "4", label: "市场" }, |
| | | { value: "5", label: "系统管理员" }, |
| | | { value: "6", label: "销售" }, |
| | | { value: "7", label: "销售总监" } |
| | | ], |
| | | contractStatusOptions: [ |
| | | { value: "1", label: "待审批" }, |
| | | { value: "2", label: "审批中" }, |
| | | { value: "3", label: "已审批" }, |
| | | { value: "4", label: "已归档" } |
| | | ], // 合同状态 |
| | | memberOptions: [], |
| | | statusOptions: [], // 合同状态 |
| | | approvalWorkflowOptions: [], // 审批流程 |
| | | unflodCollapseStr: "收起", |
| | | isUnflod: true |
| | | isUnflod: true, |
| | | editSelectClientConfig: { |
| | | editVisible: false, |
| | | title: "", |
| | | infomation: {} |
| | | }, |
| | | editSelCommonConfig: { |
| | | editVisible: false, |
| | | title: "", |
| | | infomation: {} |
| | | }, |
| | | clientId: this.editCommonConfig.infomation.clientId, |
| | | quotationId: this.editCommonConfig.infomation.quotationId, |
| | | isAddQuatation: true, |
| | | quotationList: [] |
| | | } |
| | | }, |
| | | created() {}, |
| | | created() { |
| | | this.$store.dispatch("geClient") |
| | | // this.$store.dispatch("geQuotation") |
| | | if (this.editConfig.title !== "新建") { |
| | | this.isAddQuatation = false |
| | | } |
| | | this.getCommonData() |
| | | this.formInfo() |
| | | }, |
| | | watch: { |
| | | "editCommonConfig.visible"(val) { |
| | | if (val) { |
| | | this.formInfo() |
| | | } |
| | | }, |
| | | "editCommonConfig.infomation.codeStandID"() { |
| | | this.formInfo() |
| | | } |
| | | }, |
| | | methods: { |
| | | formInfo() { |
| | | this.objCode.type = "合同编码" |
| | | this.objCode.codeStandID = "" |
| | | if (this.editConfig.infomation.codeStandID) { |
| | | this.objCode.codeStandID = this.editConfig.infomation.codeStandID |
| | | } |
| | | this.getRCodeStandardList() |
| | | }, |
| | | getCommonData() { |
| | | getAllData() |
| | | .then((res) => { |
| | | this.memberOptions = res.data.member |
| | | this.statusOptions = res.data.serviceContractStatus |
| | | }) |
| | | .catch((err) => { |
| | | console.log(err) |
| | | }) |
| | | }, |
| | | // 保存 |
| | | saveClick(formName) { |
| | | this.$refs[formName].validate((valid) => { |
| | | if (valid) { |
| | | const params = this.saveParams() |
| | | if (this.editConfig.title === "新建") { |
| | | getAddContract(params).then((res) => { |
| | | console.log(res) |
| | | this.editConfig.visible = false |
| | | if (res.code === 200) { |
| | | this.$message.success("添加成功") |
| | | this.$parent.getData() |
| | | } |
| | | }) |
| | | } else { |
| | | getUpdateContract(params).then((res) => { |
| | | console.log(res) |
| | | this.editConfig.visible = false |
| | | if (res.code === 200) { |
| | | this.$message.success("编辑成功") |
| | | this.$parent.getData() |
| | | } |
| | | }) |
| | | } |
| | | } else { |
| | | console.log("error submit") |
| | | return false |
| | | } |
| | | }) |
| | | }, |
| | | saveParams() { |
| | | let data = this.editConfig.infomation |
| | | console.log(data) |
| | | let params = { |
| | | id: this.editConfig.title === "新建" ? 0 : data.id, |
| | | contractName: data.contractName || "", |
| | | client_id: this.clientId || 0, |
| | | file: "", |
| | | member_id: data.memberId || 0, |
| | | number: data.number || "", |
| | | quotation_id: this.quotationId || 0, |
| | | status_id: data.statusId || 0, |
| | | codeStandID: data.ID, |
| | | sendTime: data.sendTime || "" |
| | | } |
| | | return params |
| | | }, |
| | | handleClose() { |
| | | this.editConfig.visible = false |
| | | }, |
| | | // 获取报价单 |
| | | getQuotation(id) { |
| | | getQuotationList({ |
| | | page: 0, |
| | | pageSize: 0, |
| | | search_map: { |
| | | client_id: id |
| | | } |
| | | }).then((res) => { |
| | | if (res.code == 200) { |
| | | console.log(res) |
| | | this.quotationList = res.data.list |
| | | } |
| | | }) |
| | | }, |
| | | // 选择客户相关方法 |
| | | querySearchAsync(queryString, cb, value) { |
| | | var restaurants = [] |
| | | if (value === "client") { |
| | | restaurants = this.clientList |
| | | } else if (value === "quotation") { |
| | | restaurants = this.quotationList |
| | | } |
| | | var results = queryString ? restaurants.filter(this.createStateFilter(queryString, value)) : restaurants |
| | | cb(results) |
| | | }, |
| | | createStateFilter(queryString, value) { |
| | | return (state) => { |
| | | if (value === "contract" || value === "quotation") { |
| | | return state.number.toLowerCase().indexOf(queryString.toLowerCase()) === 0 |
| | | } else { |
| | | return state.name.toLowerCase().indexOf(queryString.toLowerCase()) === 0 |
| | | } |
| | | } |
| | | }, |
| | | handleSelectClient(value, item) { |
| | | console.log(item) |
| | | if (value === "client") { |
| | | this.editConfig.infomation.client_name = item.name |
| | | this.clientId = item.id |
| | | this.isAddQuatation = false |
| | | this.getQuotation(item.id) |
| | | } else if (value === "quotation") { |
| | | this.editConfig.infomation.quotation_number = item.number |
| | | this.quotationId = item.id |
| | | } |
| | | }, |
| | | selClientClick(value) { |
| | | console.log("aaaa") |
| | | if (value === "client") { |
| | | this.editSelectClientConfig.editVisible = true |
| | | } else if (value === "quotation") { |
| | | this.editSelCommonConfig.title = "报价单" |
| | | this.editSelCommonConfig.editVisible = true |
| | | this.editSelCommonConfig.clientId = this.clientId |
| | | this.editSelCommonConfig.tableInfomation = [...this.quotationList] |
| | | } |
| | | }, |
| | | selClient(row, value) { |
| | | console.log("bbbb") |
| | | console.log(value) |
| | | if (value === "client") { |
| | | this.editConfig.infomation.client_name = row.name |
| | | this.clientId = row.id |
| | | this.isAddQuatation = false |
| | | this.getQuotation(row.id) |
| | | } else if (value === "quotation") { |
| | | this.editConfig.infomation.quotation_number = row.number |
| | | this.quotationId = row.id |
| | | } |
| | | }, |
| | | // 清除已选择用户 |
| | | clearupClient(value) { |
| | | console.log(value) |
| | | if (value === "client") { |
| | | this.editConfig.infomation.client_name = "" |
| | | this.clientId = 0 |
| | | this.isAddQuatation = true |
| | | this.editConfig.infomation.quotation_number = "" |
| | | this.quotationId = 0 |
| | | } else if (value === "quotation") { |
| | | this.editConfig.infomation.quotation_number = "" |
| | | this.quotationId = 0 |
| | | } |
| | | }, |
| | | // 添加附件 |
| | | addAnnexClick() {}, |
| | |
| | | .basic-info-view { |
| | | margin-top: 10px; |
| | | padding-right: 40px; |
| | | .custom-name { |
| | | .custom-name, |
| | | .common-select { |
| | | display: flex; |
| | | .common-select-btn { |
| | | margin-left: 5px; |
| | | font-size: 18px; |
| | | } |
| | | } |
| | | } |
| | | .address-view { |
| | | margin-top: 10px; |
| | | padding-right: 40px; |
| | | .common-select { |
| | | .common-select-sel { |
| | | width: 270px; |
| | | } |
| | | } |
| | | } |
| | | .annex-view { |
| | | display: flex; |
| | |
| | | background-color: #f5f5f5; |
| | | height: 55px; |
| | | line-height: 55px; |
| | | } |
| | | } |
| | | ::v-deep { |
| | | .el-dialog__header { |
| | | padding: 12.5px 10px; |
| | | border-bottom: 1px solid #e5e5e5; |
| | | .el-dialog__title { |
| | | font-size: 15px; |
| | | color: #323232; |
| | | font-weight: bold; |
| | | } |
| | | } |
| | | .el-dialog__body { |
| | | padding: 0px; |
| | | } |
| | | .el-dialog__footer { |
| | | padding: 0px; |
| | | text-align: center; |
| | | box-sizing: border-box; |
| | | border-top: 1px solid #dadee5; |
| | | } |
| | | .product-view { |
| | | .el-form-item__label { |
| | | padding: 0; |
| | | } |
| | | } |
| | | } |
| | | </style> |