| | |
| | | custom-class="iframe-dialog" |
| | | > |
| | | <el-form |
| | | v-if="refreshFlag" |
| | | ref="form" |
| | | :model="editConfig.infomation" |
| | | :rules="rules" |
| | | label-position="right" |
| | | label-width="308px" |
| | | label-width="208px" |
| | | size="mini" |
| | | style="height: 60vh; overflow-x: hidden" |
| | | > |
| | |
| | | <div class="basic-info-title">机会基本信息</div> |
| | | <div class="basic-info-view"> |
| | | <el-row> |
| | | <!-- <el-col :span="12">--> |
| | | <!-- <el-form-item label="销售机会编号" prop="number">--> |
| | | <!-- <el-input v-model="editConfig.infomation.number"></el-input>--> |
| | | <!-- </el-form-item>--> |
| | | <!-- </el-col>--> |
| | | <el-col :span="12"> |
| | | <el-form-item label="客户名称" prop="client_name"> |
| | | <el-form-item label="销售机会编号" prop="number"> |
| | | <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="name"> |
| | | <div class="custom-name"> |
| | | <el-input v-model="editConfig.infomation.name"></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> --> |
| | | </div> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="客户名称" prop="client_name" ref="clientName"> |
| | | <div class="custom-name"> |
| | | <el-autocomplete |
| | | v-model="editConfig.infomation.client_name" |
| | |
| | | class="common-select-btn" |
| | | @click="clearupClient('client')" |
| | | > |
| | | <i class="el-icon-edit-outline" title="清除"></i> |
| | | <i class="el-icon-remove-outline" title="清除"></i> |
| | | </div> |
| | | </div> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="销售机会编号" prop="number"> |
| | | <el-input v-model="editConfig.infomation.number"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="机会名称" prop="name"> |
| | | <div class="custom-name"> |
| | | <el-input v-model="editConfig.infomation.name"></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> --> |
| | | </div> |
| | | </el-form-item> |
| | | </el-col> |
| | | |
| | | <el-col :span="12"> |
| | | <el-form-item label="联系人姓名" prop="contact_name"> |
| | | <div class="custom-name"> |
| | |
| | | " |
| | | value-key="name" |
| | | @select="handleSelectClient('contact', $event)" |
| | | placeholder="请先选择客户名称" |
| | | :disabled="isContact" |
| | | ></el-autocomplete> |
| | | <div class="common-select-btn" @click="selClientClick('contact')"> |
| | | <div v-if="!isContact" class="common-select-btn" @click="selClientClick('contact')"> |
| | | <i class="el-icon-circle-plus-outline" title="选择"></i> |
| | | </div> |
| | | <div |
| | | v-if="editConfig.infomation.contact_name && editConfig.infomation.contact_name.length > 0" |
| | | v-if=" |
| | | editConfig.infomation.contact_name && |
| | | editConfig.infomation.contact_name.length > 0 && |
| | | !isContact |
| | | " |
| | | class="common-select-btn" |
| | | @click="clearupClient('contact')" |
| | | > |
| | | <i class="el-icon-edit-outline" title="清除"></i> |
| | | <i class="el-icon-remove-outline" title="清除"></i> |
| | | </div> |
| | | </div> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="商机来源" prop="sales_sources_id"> |
| | | <el-form-item label="机会来源" prop="sales_sources_id"> |
| | | <div class="common-select"> |
| | | <el-select |
| | | v-model="editConfig.infomation.sales_sources_id" |
| | |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="商机类型" prop="sale_type_id"> |
| | | <el-form-item label="机会类型" prop="sale_type_id"> |
| | | <div class="common-select"> |
| | | <el-select |
| | | v-model="editConfig.infomation.sale_type_id" |
| | |
| | | v-model="editConfig.infomation.member_id" |
| | | placeholder="请选择" |
| | | size="mini" |
| | | style="width: 63%" |
| | | style="width: 100%" |
| | | > |
| | | <el-option v-for="item in memberOptions" :key="item.id" :label="item.username" :value="item.id"> |
| | | </el-option> |
| | |
| | | v-model="editConfig.infomation.currency" |
| | | placeholder="请选择" |
| | | size="mini" |
| | | style="width: 63%" |
| | | style="width: 100%" |
| | | > |
| | | <el-option v-for="item in currencyOptions" :key="item.id" :label="item.name" :value="item.id"> |
| | | </el-option> |
| | |
| | | :min="0" |
| | | :precision="2" |
| | | :controls="false" |
| | | style="width: 25%; margin-right: 5px" |
| | | style="width: 100%" |
| | | ></el-input-number> |
| | | </el-form-item> |
| | | </el-col> |
| | |
| | | v-model="editConfig.infomation.expected_time" |
| | | value-format="yyyy-MM-dd" |
| | | type="date" |
| | | style="width: 100%" |
| | | placeholder="选择日期" |
| | | > |
| | | </el-date-picker> |
| | |
| | | <div class="basic-info-title">商机七要素(5W2P)</div> |
| | | <div class="basic-info-view"> |
| | | <el-row> |
| | | <el-col :span="20"> |
| | | <el-col> |
| | | <el-form-item label="客户需求或痛点(why)" prop="pain_points"> |
| | | <el-input |
| | | type="textarea" |
| | | style="width: 100%" |
| | | :autosize="{ minRows: 2 }" |
| | | v-model="editConfig.infomation.pain_points" |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="20"> |
| | | <el-col> |
| | | <el-form-item label="是否已经立项(plan)" prop="whether_established"> |
| | | <el-input |
| | | type="textarea" |
| | |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="20"> |
| | | <el-col> |
| | | <el-form-item label="资金预算是多少(plan)" prop="capital_budget"> |
| | | <el-input |
| | | type="textarea" |
| | |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="20"> |
| | | <el-col> |
| | | <el-form-item label="关键决策人是谁(who)" prop="key_maker"> |
| | | <el-input |
| | | type="textarea" |
| | |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="20"> |
| | | <el-col> |
| | | <el-form-item label="关键决策因素有哪些(what)" prop="key_factors"> |
| | | <el-input |
| | | type="textarea" |
| | |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="20"> |
| | | <el-col> |
| | | <el-form-item label="决策流程是怎样的(what)" prop="process"> |
| | | <el-input |
| | | type="textarea" |
| | |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="20"> |
| | | <el-col> |
| | | <el-form-item label="竞争对手提供的方案(what)" prop="solutions"> |
| | | <el-input |
| | | type="textarea" |
| | |
| | | </div> |
| | | </el-form-item> |
| | | </el-col> --> |
| | | <el-col :span="20"> |
| | | <el-col> |
| | | <el-form-item label="详细地址" prop="detail_address"> |
| | | <el-input |
| | | type="textarea" |
| | |
| | | <div class="basic-info-title">备注信息</div> |
| | | <div class="basic-info-view"> |
| | | <el-row> |
| | | <el-col :span="20"> |
| | | <el-col> |
| | | <el-form-item label="备注" prop="remark"> |
| | | <el-input |
| | | type="textarea" |
| | |
| | | import SelectClientDialog from "@/views/other/commonDialog/SelectClientDialog" |
| | | import SelectContactDialog from "@/views/other/commonDialog/SelectContactDialog" |
| | | import { getCityList } from "@/api/common/address" |
| | | import WordInput from "@/components/wordInput.vue" |
| | | import codeMixin from "@/views/client/followupRecords/mixin/codeMixin" |
| | | import { getContactList } from "@/api/client/contacts" |
| | | export default { |
| | | name: "AddSalesOpportunityDialog", |
| | | mixins: [codeMixin], |
| | | props: { |
| | | editCommonConfig: { |
| | | type: Object, |
| | |
| | | } |
| | | } |
| | | }, |
| | | components: { SelectClientDialog, SelectContactDialog }, |
| | | components: { WordInput, SelectClientDialog, SelectContactDialog }, |
| | | computed: { |
| | | searchCommonHeight() { |
| | | return this.$refs.searchCommonView.offsetHeight |
| | | }, |
| | | clientList() { |
| | | return this.$store.state.getClientName.clientList |
| | | }, |
| | | contactNamelist() { |
| | | return this.$store.state.getClientName.contactNamelist |
| | | } |
| | | }, |
| | | data() { |
| | | return { |
| | | dialogWidth: "80%", |
| | | refreshFlag: true, |
| | | dialogWidth: "50%", |
| | | editConfig: this.editCommonConfig, |
| | | rules: { |
| | | number: [{ required: true, message: "请输入销售机会编号", trigger: "blur" }], |
| | | name: [{ required: true, message: "请输入机会名称", trigger: "blur" }], |
| | | |
| | | member_id: [{ required: true, message: "请选择销售负责人", trigger: "change" }], |
| | | sale_stage_id: [{ required: true, message: "请选择销售阶段", trigger: "change" }], |
| | | currency: [{ required: true, message: "请选择币种", trigger: "change" }], |
| | | expected_time: [{ required: true, message: "请选择预计成交日期", trigger: "change" }], |
| | | projected_amount: [{ required: true, message: "请输入预计合同金额", trigger: "blur" }] |
| | | projected_amount: [{ required: true, message: "请输入预计合同金额", trigger: "blur" }], |
| | | client_name: [{ required: true, message: "请选择客户", trigger: "change" }] |
| | | }, |
| | | businessSourceOptions: [], |
| | | memberOptions: [], |
| | |
| | | }, |
| | | restaurants: [], |
| | | clientId: this.editCommonConfig.infomation.client_id, |
| | | contactId: this.editCommonConfig.infomation.contact_id |
| | | contactId: this.editCommonConfig.infomation.contact_id, |
| | | objCode: { name: "", page: 0, pageSize: 0, type: "销售机会编码", codeStandID: "" }, |
| | | isContact: true, |
| | | contactNamelist: [] |
| | | } |
| | | }, |
| | | created() { |
| | | this.$store.dispatch("geClient") |
| | | this.$store.dispatch("geContact") |
| | | if (this.editConfig.title !== "新建" && this.editConfig.infomation.province_id !== 0) { |
| | | this.getCityList(this.editConfig.infomation.province_id, "edit") |
| | | } |
| | | this.getCommonData() |
| | | this.formInfo() |
| | | if (this.editConfig.title === "编辑") { |
| | | this.isContact = false |
| | | this.getContactList(this.editConfig.infomation.contact_id) |
| | | } |
| | | }, |
| | | watch: { |
| | | "editConfig.visible"(val) { |
| | | if (val) { |
| | | this.formInfo() |
| | | } |
| | | }, |
| | | "editConfig.infomation.codeStandID"() { |
| | | this.formInfo() |
| | | } |
| | | }, |
| | | methods: { |
| | | formInfo() { |
| | | this.objCode.codeStandID = "" |
| | | if (this.editConfig.infomation.codeStandID) { |
| | | this.objCode.codeStandID = this.editConfig.infomation.codeStandID |
| | | } |
| | | this.getRCodeStandardList() |
| | | }, |
| | | getCommonData() { |
| | | this.editConfig.infomation.country_id = 1 |
| | | this.editConfig.infomation.province_id = |
| | |
| | | // 保存 |
| | | saveClick(formName) { |
| | | this.$refs[formName].validate((valid) => { |
| | | this.validateFormNumber() |
| | | if (valid) { |
| | | console.log(this.editConfig.infomation) |
| | | const params = this.saveParams() |
| | |
| | | status_id: data.status_id || 0, |
| | | threats: data.threats || "", |
| | | whether_established: data.whether_established || "", |
| | | |
| | | remark: data.remark || "", |
| | | detail_address: data.detail_address || "" |
| | | detail_address: data.detail_address || "", |
| | | |
| | | codeStandID: data.ID, |
| | | codeRule: this.codeRule |
| | | } |
| | | return params |
| | | }, |
| | | // 获取联系人列表 |
| | | getContactList(id) { |
| | | getContactList({ |
| | | page: 0, |
| | | pageSize: 0, |
| | | search_map: { |
| | | client_id: id |
| | | } |
| | | }).then((res) => { |
| | | if (res.code == 200) { |
| | | this.contactNamelist = res.data.list |
| | | } |
| | | }) |
| | | }, |
| | | // 选择用户相关方法 |
| | | querySearchAsync(queryString, cb, value) { |
| | |
| | | handleSelectClient(value, item) { |
| | | if (value === "client") { |
| | | this.clientId = item.id |
| | | this.editConfig.infomation.client_name = item.name |
| | | this.editConfig.infomation.contact_name = "" |
| | | this.contactId = 0 |
| | | this.isContact = false |
| | | this.getContactList(item.id) |
| | | } else if (value === "contact") { |
| | | this.editConfig.infomation.contact_name = item.name |
| | | this.contactId = item.id |
| | | } |
| | | this.refresh() |
| | | }, |
| | | selClientClick(value) { |
| | | if (value === "client") { |
| | | this.editSelectClientConfig.editVisible = true |
| | | } else if (value === "contact") { |
| | | this.editSelectContactConfig.editVisible = true |
| | | this.editSelectContactConfig.clientId = this.clientId |
| | | } |
| | | }, |
| | | selClient(row, value) { |
| | |
| | | } else if (value === "client") { |
| | | this.editConfig.infomation.client_name = row.name |
| | | this.clientId = row.id |
| | | this.editConfig.infomation.contact_name = "" |
| | | this.contactId = 0 |
| | | this.isContact = false |
| | | this.getContactList(row.id) |
| | | } |
| | | this.refresh() |
| | | }, |
| | | /** |
| | | * 强制刷新form组件 |
| | | * 外部更改表单值不会触发表单校验,导致即使有值夜被表单校验阻塞住 |
| | | */ |
| | | refresh() { |
| | | this.refreshFlag = false |
| | | requestAnimationFrame(() => { |
| | | this.refreshFlag = true |
| | | }) |
| | | }, |
| | | // 清除已选择用户 |
| | | clearupClient(value) { |
| | | if (value === "client") { |
| | | this.editConfig.infomation.client_name = "" |
| | | this.clientId = 0 |
| | | this.isContact = true |
| | | this.editConfig.infomation.contact_name = "" |
| | | this.contactId = 0 |
| | | } else if (value === "contact") { |
| | | this.editConfig.infomation.contact_name = "" |
| | | this.contactId = 0 |
| | | } |
| | | this.refresh() |
| | | }, |
| | | // 添加附件 |
| | | addAnnexClick() {}, |
| | |
| | | }, |
| | | async getCityList(val, value) { |
| | | await getCityList({ province_id: val }).then((res) => { |
| | | console.log(res) |
| | | if (res.data.code === 200) { |
| | | this.cityOptions = res.data.data.list |
| | | if (res.code === 200) { |
| | | this.cityOptions = res.data.list |
| | | if (value === "sel") { |
| | | this.editConfig.infomation.city_id = "" |
| | | } |
| | |
| | | } |
| | | .common-select { |
| | | .common-select-sel { |
| | | width: 270px; |
| | | flex: 1; |
| | | } |
| | | } |
| | | .custom-name { |
| | | .el-autocomplete { |
| | | flex: 1; |
| | | } |
| | | } |
| | | } |