| | |
| | | :visible.sync="editConfig.visible" |
| | | :width="dialogWidth" |
| | | :before-close="handleClose" |
| | | append-to-body |
| | | custom-class="iframe-dialog" |
| | | > |
| | | <el-form |
| | | ref="form" |
| | |
| | | <div class="basic-info-view"> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="客户名称" prop="client_id"> |
| | | <el-form-item label="客户名称" prop="client_name"> |
| | | <div class="custom-name"> |
| | | <el-input v-model="editConfig.infomation.client_id"></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.client_name" |
| | | :fetch-suggestions=" |
| | | (queryString, callback) => { |
| | | querySearchAsync(queryString, callback, 'client') |
| | | } |
| | | " |
| | | value-key="name" |
| | | @select="handleSelectClient('client', $event)" |
| | | ></el-autocomplete> |
| | | <div class="common-select-btn" @click="selClientClick('client')"> |
| | | <i class="el-icon-circle-plus-outline" title="选择"></i> |
| | | </div> |
| | | <div class="common-select-btn" @click="clearupClient('client')"> |
| | | <i class="el-icon-edit-outline" title="清除"></i> |
| | | </div> |
| | | </div> |
| | | </el-form-item> |
| | | </el-col> |
| | |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="联系人姓名" prop="contact_id"> |
| | | <el-input v-model="editConfig.infomation.contact_id"></el-input> |
| | | <el-form-item label="联系人姓名" prop="contact_name"> |
| | | <div class="custom-name"> |
| | | <el-autocomplete |
| | | v-model="editConfig.infomation.contact_name" |
| | | :fetch-suggestions=" |
| | | (queryString, callback) => { |
| | | querySearchAsync(queryString, callback, 'contact') |
| | | } |
| | | " |
| | | value-key="name" |
| | | @select="handleSelectClient('contact', $event)" |
| | | ></el-autocomplete> |
| | | <div class="common-select-btn" @click="selClientClick('contact')"> |
| | | <i class="el-icon-circle-plus-outline" title="选择"></i> |
| | | </div> |
| | | <div class="common-select-btn" @click="clearupClient('contact')"> |
| | | <i class="el-icon-edit-outline" title="清除"></i> |
| | | </div> |
| | | </div> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | |
| | | size="mini" |
| | | style="width: 63%" |
| | | > |
| | | <el-option v-for="item in memberOptions" :key="item.id" :label="item.name" :value="item.id"> |
| | | <el-option v-for="item in memberOptions" :key="item.id" :label="item.username" :value="item.id"> |
| | | </el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | |
| | | |
| | | <div slot="footer" class="dialog-footer"> |
| | | <el-button type="primary" size="small" @click="saveClick('form')">保存</el-button> |
| | | <el-button size="small" @click="editConfig.visible = false">取消</el-button> |
| | | <el-button size="small" @click="handleClose">取消</el-button> |
| | | </div> |
| | | <!-- 选择客户 --> |
| | | <SelectClientDialog |
| | | v-if="editSelectClientConfig.editVisible" |
| | | :edit-common-config="editSelectClientConfig" |
| | | @selClient="selClient" |
| | | /> |
| | | <!-- 选择联系人 --> |
| | | <SelectContactDialog |
| | | v-if="editSelectContactConfig.editVisible" |
| | | :edit-common-config="editSelectContactConfig" |
| | | @selClient="selClient" |
| | | /> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | |
| | | <script> |
| | | import { getAllData } from "@/api/client/client" |
| | | import { getAddSaleChance, getUpdateSaleChance } from "@/api/sales/salesOpportunity" |
| | | import SelectClientDialog from "@/views/other/commonDialog/SelectClientDialog" |
| | | import SelectContactDialog from "@/views/other/commonDialog/SelectContactDialog" |
| | | export default { |
| | | name: "AddSalesOpportunityDialog", |
| | | props: { |
| | |
| | | } |
| | | } |
| | | }, |
| | | components: {}, |
| | | components: { SelectClientDialog, SelectContactDialog }, |
| | | computed: { |
| | | searchCommonHeight() { |
| | | return this.$refs.searchCommonView.offsetHeight |
| | | }, |
| | | clientList() { |
| | | return this.$store.state.getClientName.clientList |
| | | }, |
| | | contactNamelist() { |
| | | return this.$store.state.getClientName.contactNamelist |
| | | } |
| | | }, |
| | | data() { |
| | |
| | | saleStageOptions: [], // 销售阶段 |
| | | oldCustomerMarketOptions: [], // 老客户营销 |
| | | possibleOptions: [], // 可能性 |
| | | currencyOptions: [ |
| | | { |
| | | id: 1, |
| | | name: "人民币" |
| | | } |
| | | ], // 币种 |
| | | currencyOptions: [], // 币种 |
| | | currentStateOptions: [], // 当前状态 |
| | | countryOptions: [], // 国家 |
| | | provinceOptions: [], // 省份 |
| | | cityOptions: [], // 城市 |
| | | regionOptions: [] // 区域 |
| | | regionOptions: [], // 区域 |
| | | editSelectClientConfig: { |
| | | editVisible: false, |
| | | title: "", |
| | | infomation: {} |
| | | }, |
| | | editSelectContactConfig: { |
| | | editVisible: false, |
| | | title: "", |
| | | infomation: {} |
| | | }, |
| | | restaurants: [], |
| | | clientId: this.editCommonConfig.infomation.client_id, |
| | | contactId: this.editCommonConfig.infomation.contact_id |
| | | } |
| | | }, |
| | | created() { |
| | | this.$store.dispatch("geClient") |
| | | this.$store.dispatch("geContact") |
| | | this.getCommonData() |
| | | }, |
| | | methods: { |
| | |
| | | this.provinceOptions = res.data.province |
| | | this.cityOptions = res.data.city |
| | | this.regionOptions = res.data.region |
| | | this.possibleOptions = res.data.possibility |
| | | this.currencyOptions = res.data.currency |
| | | this.currentStateOptions = res.data.status |
| | | }) |
| | | .catch((err) => { |
| | | console.log(err) |
| | |
| | | }, |
| | | handleClose() { |
| | | this.editConfig.visible = false |
| | | console.log(this.editConfig.infomation.client_name) |
| | | if (this.editConfig.title === "新建" && this.editConfig.infomation.client_name) { |
| | | this.$parent.handleClose() |
| | | } |
| | | }, |
| | | // 保存 |
| | | saveClick(formName) { |
| | |
| | | message: "添加成功", |
| | | type: "success" |
| | | }) |
| | | this.$parent.getData() |
| | | if (this.editConfig.title === "新建" && this.editConfig.infomation.client_name) { |
| | | this.$parent.handleClose() |
| | | } else { |
| | | this.$parent.getData() |
| | | } |
| | | } |
| | | }) |
| | | .catch((err) => { |
| | |
| | | budget: data.budget || 0, |
| | | capital_budget: data.capital_budget || "", |
| | | city_id: data.city_id || 0, |
| | | client_id: data.client_id || 0, |
| | | client_id: parseInt(this.clientId), |
| | | competitors: data.competitors || "", |
| | | contact_id: data.contact_id || 0, |
| | | contact_id: parseInt(this.contactId), |
| | | country_id: data.country_id || 0, |
| | | currency: data.currency || 0, |
| | | disadvantages: data.disadvantages || "", |
| | |
| | | } |
| | | return params |
| | | }, |
| | | // 选择用户相关方法 |
| | | querySearchAsync(queryString, cb, value) { |
| | | var restaurants = [] |
| | | if (value === "client") { |
| | | restaurants = this.clientList |
| | | } else if (value === "contact") { |
| | | restaurants = this.contactNamelist |
| | | } |
| | | var results = queryString ? restaurants.filter(this.createStateFilter(queryString)) : restaurants |
| | | cb(results) |
| | | }, |
| | | createStateFilter(queryString) { |
| | | return (state) => { |
| | | return state.name.toLowerCase().indexOf(queryString.toLowerCase()) === 0 |
| | | } |
| | | }, |
| | | handleSelectClient(value, item) { |
| | | if (value === "client") { |
| | | this.clientId = item.id |
| | | } else if (value === "contact") { |
| | | this.contactId = item.id |
| | | } |
| | | }, |
| | | selClientClick(value) { |
| | | if (value === "client") { |
| | | this.editSelectClientConfig.editVisible = true |
| | | } else if (value === "contact") { |
| | | this.editSelectContactConfig.editVisible = true |
| | | } |
| | | }, |
| | | selClient(row, value) { |
| | | if (value === "contact") { |
| | | this.editConfig.infomation.contact_name = row.name |
| | | this.contactId = row.id |
| | | } else if (value === "client") { |
| | | this.editConfig.infomation.client_name = row.name |
| | | this.clientId = row.id |
| | | } |
| | | }, |
| | | // 清除已选择用户 |
| | | clearupClient(value) { |
| | | if (value === "client") { |
| | | this.editConfig.infomation.client_name = "" |
| | | this.clientId = 0 |
| | | } else if (value === "contact") { |
| | | this.editConfig.infomation.contact_name = "" |
| | | this.contactId = 0 |
| | | } |
| | | }, |
| | | // 添加附件 |
| | | addAnnexClick() {}, |
| | | // 设置允许上传文件格式 |
| | |
| | | |
| | | <!-- Add "scoped" attribute to limit CSS to this component only --> |
| | | <style lang="scss" scoped> |
| | | .add-sales-opportunity { |
| | | .basic-info { |
| | | .basic-info-title { |
| | | background-color: #f4f8fe; |
| | | padding-left: 10px; |
| | | font-size: 15px; |
| | | font-weight: bold; |
| | | color: #666; |
| | | height: 42px; |
| | | line-height: 42px; |
| | | } |
| | | .basic-info-view { |
| | | margin-top: 10px; |
| | | padding-right: 40px; |
| | | .custom-name { |
| | | display: flex; |
| | | .common-select-btn { |
| | | margin-left: 5px; |
| | | font-size: 18px; |
| | | ::v-deep { |
| | | .iframe-dialog .el-dialog__body { |
| | | .basic-info { |
| | | .basic-info-title { |
| | | background-color: #f4f8fe; |
| | | padding-left: 10px; |
| | | font-size: 15px; |
| | | font-weight: bold; |
| | | color: #666; |
| | | height: 42px; |
| | | line-height: 42px; |
| | | } |
| | | .basic-info-view { |
| | | margin-top: 10px; |
| | | padding-right: 40px; |
| | | .custom-name, |
| | | .common-select { |
| | | display: flex; |
| | | .common-select-btn { |
| | | margin-left: 5px; |
| | | font-size: 18px; |
| | | cursor: pointer; |
| | | } |
| | | } |
| | | .common-select { |
| | | .common-select-sel { |
| | | width: 270px; |
| | | } |
| | | } |
| | | } |
| | | .common-select { |
| | | .annex-view { |
| | | display: flex; |
| | | .common-select-sel { |
| | | width: 270px; |
| | | } |
| | | .common-select-btn { |
| | | margin-left: 5px; |
| | | font-size: 16px; |
| | | cursor: pointer; |
| | | color: #6166d3; |
| | | .setFormat { |
| | | margin-left: 10px; |
| | | } |
| | | } |
| | | } |
| | | .annex-view { |
| | | .unflod-collapse { |
| | | display: flex; |
| | | height: 30px; |
| | | justify-content: center; |
| | | align-items: center; |
| | | color: #6166d3; |
| | | .setFormat { |
| | | margin-left: 10px; |
| | | } |
| | | } |
| | | } |
| | | .unflod-collapse { |
| | | display: flex; |
| | | height: 30px; |
| | | justify-content: center; |
| | | align-items: center; |
| | | color: #6166d3; |
| | | } |
| | | .dialog-footer { |
| | | background-color: #f5f5f5; |
| | | height: 55px; |
| | | line-height: 55px; |
| | | .dialog-footer { |
| | | background-color: #f5f5f5; |
| | | height: 55px; |
| | | line-height: 55px; |
| | | } |
| | | } |
| | | } |
| | | </style> |