123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153 |
- <template>
- <div class="data-search">
- <el-form :inline="true" :model="queryForm" class="demo-form-inline">
- <el-form-item label="客户名称:">
- <el-input
- v-model="queryForm.name"
- placeholder="请选择客户名称"
- ></el-input>
- </el-form-item>
- <el-form-item label="状态:">
- <el-select
- v-model="queryForm.status"
- class="m-2"
- placeholder="请选择状态"
- size="large"
- >
- <el-option
- v-for="item in statusOptions"
- :key="item.value"
- :label="item.label"
- :value="item.value"
- />
- </el-select>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" @click="onSubmit">
- <svg-icon icon-class="search" /> 搜索</el-button
- >
- <el-button type="primary" @click="onAdd">
- <svg-icon icon-class="add" />新增客户</el-button
- >
- </el-form-item>
- </el-form>
- <el-dialog title="新增客户" v-model="dialogVisible" width="50%">
- <el-form :model="customerForm" label-width="120px">
- <el-form-item label="客户编码" required>
- <el-input v-model="customerForm.code" placeholder="请输入客户编码" />
- </el-form-item>
- <el-form-item label="客户名称" required>
- <el-input v-model="customerForm.name" placeholder="请输入客户名称" />
- </el-form-item>
- <el-form-item label="英文名称" required>
- <el-input
- v-model="customerForm.en_name"
- placeholder="请输入英文名称"
- />
- </el-form-item>
- <el-form-item label="手机号码" required>
- <el-input
- v-model="customerForm.mobile"
- placeholder="请输入手机号码"
- />
- </el-form-item>
- <el-form-item label="联系人" required>
- <el-input v-model="customerForm.contact" placeholder="请输入联系人" />
- </el-form-item>
- <el-form-item label="地址" required>
- <el-input v-model="customerForm.address" placeholder="请输入地址" />
- </el-form-item>
- <el-form-item label="其他信息">
- <el-input v-model="customerForm.other" placeholder="请输入其他信息" />
- </el-form-item>
- </el-form>
- <template #footer>
- <span class="dialog-footer">
- <el-button @click="dialogVisible = false">取消</el-button>
- <el-button type="primary" @click="handleCreate">确定</el-button>
- </span>
- </template>
- </el-dialog>
- </div>
- </template>
- <script>
- import { syncCustomer, create,update } from "@/api/customer";
- export default {
- props: {
- queryForm: {
- type: Object,
- default: () => {
- return {
- page: 1,
- pageSize: 10,
- name: "",
- status: "",
- };
- },
- },
- },
- data() {
- return {
- statusOptions: [
- {
- value: "",
- label: "请选择状态",
- },
- {
- value: 5,
- label: "启用",
- },
- {
- value: 6,
- label: "停用",
- },
- ],
- dialogVisible: false,
- customerForm: {
- code: "",
- name: "",
- en_name: "",
- mobile: "",
- contact: "",
- address: "",
- other: "",
- },
- };
- },
- created() {},
- methods: {
- handleCreate() {
- createCustomer(this.customerForm)
- .then((res) => {
- this.$message.success("创建成功");
- this.dialogVisible = false;
- this.$emit("bindSetQuery", this.$props.queryForm); // 刷新列表
- })
- .catch((err) => {
- this.$message.error("创建失败");
- });
- },
- onAdd() {},
- onSync(e) {
- let _this = this;
- syncCustomer().then((res) => {
- console.log("res", res);
- });
- },
- onCreate(e) {
- this.dialogVisible = true;
- },
- //搜索
- onSubmit() {
- this.$emit("bindSetQuery", this.$props.queryForm);
- },
- },
- };
- </script>
- <style lang="scss">
- @import "./dataSearch.scss";
- </style>
|