|
@@ -17,51 +17,83 @@
|
|
|
action: () => openModal('add'),
|
|
|
},
|
|
|
]"
|
|
|
- @get-list="getList">
|
|
|
+ @get-list="getList"
|
|
|
+ >
|
|
|
<template #address="{ item }">
|
|
|
- <div>{{ item.countryName }}, {{ item.provinceName }} , {{ item.cityName }}, {{ item.areaDetail }}</div>
|
|
|
+ <div>
|
|
|
+ {{ item.countryName }}, {{ item.provinceName }} ,
|
|
|
+ {{ item.cityName }}, {{ item.areaDetail }}
|
|
|
+ </div>
|
|
|
</template>
|
|
|
</byTable>
|
|
|
</div>
|
|
|
- <el-dialog :title="modalType == 'add' ? '添加供应商' : '编辑供应商'" v-model="dialogVisible" width="600" v-loading="loading" destroy-on-close>
|
|
|
- <byForm :formConfig="formConfig" :formOption="formOption" v-model="formData.data" :rules="rules" ref="byform">
|
|
|
- <template #address>
|
|
|
- <el-row :gutter="10" style="width: 100%">
|
|
|
- <el-col :span="8">
|
|
|
- <el-form-item prop="countryId">
|
|
|
- <el-select v-model="formData.data.countryId" placeholder="国家" @change="(val) => getCityData(val, '20', true)">
|
|
|
- <el-option v-for="item in countryData" :label="item.chineseName" :value="item.id"> </el-option>
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :span="8">
|
|
|
- <el-form-item prop="provinceId">
|
|
|
- <el-select v-model="formData.data.provinceId" filterable allow-create placeholder="省/洲" @change="(val) => getCityData(val, '30', true)">
|
|
|
- <el-option v-for="item in provinceData" :label="item.name" :value="item.id"> </el-option>
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :span="8">
|
|
|
- <el-form-item prop="cityId">
|
|
|
- <el-select v-model="formData.data.cityId" filterable allow-create placeholder="城市">
|
|
|
- <el-option v-for="item in cityData" :label="item.name" :value="item.id"> </el-option>
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- <el-row style="margin-top: 20px; width: 100%">
|
|
|
- <el-col :span="24">
|
|
|
- <el-form-item prop="areaDetail">
|
|
|
- <el-input v-model="formData.data.areaDetail" type="textarea"> </el-input>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
+ <el-dialog
|
|
|
+ :title="modalType == 'add' ? '添加供应商' : '编辑供应商'"
|
|
|
+ v-model="dialogVisible"
|
|
|
+ width="600"
|
|
|
+ v-loading="loading"
|
|
|
+ destroy-on-close
|
|
|
+ >
|
|
|
+ <byForm
|
|
|
+ :formConfig="formConfig"
|
|
|
+ :formOption="formOption"
|
|
|
+ v-model="formData.data"
|
|
|
+ :rules="rules"
|
|
|
+ ref="byform"
|
|
|
+ >
|
|
|
+ <template #countryId>
|
|
|
+ <div>
|
|
|
+ <el-select
|
|
|
+ v-model="formData.data.countryId"
|
|
|
+ placeholder="国家"
|
|
|
+ @change="(val) => getCityData(val, '20', true)"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in countryData"
|
|
|
+ :label="item.chineseName"
|
|
|
+ :value="item.id"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template #provinceId>
|
|
|
+ <div>
|
|
|
+ <selectCity
|
|
|
+ placeholder="省/洲"
|
|
|
+ @change="(val) => getCityData(val, '30', true)"
|
|
|
+ addressId="provinceId"
|
|
|
+ addressName="provinceName"
|
|
|
+ v-model="formData.data"
|
|
|
+ :data="provinceData"
|
|
|
+ >
|
|
|
+ </selectCity>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template #cityId>
|
|
|
+ <div>
|
|
|
+ <selectCity
|
|
|
+ placeholder="城市"
|
|
|
+ addressId="cityId"
|
|
|
+ addressName="cityName"
|
|
|
+ v-model="formData.data"
|
|
|
+ :data="cityData"
|
|
|
+ >
|
|
|
+ </selectCity>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
+
|
|
|
<template #contact>
|
|
|
<el-row :gutter="10" style="width: 100%">
|
|
|
<el-col :span="8">
|
|
|
<el-form-item prop="contactPerson">
|
|
|
- <el-input v-model="formData.data.contactPerson" placeholder="联系人"> </el-input>
|
|
|
+ <el-input
|
|
|
+ v-model="formData.data.contactPerson"
|
|
|
+ placeholder="联系人"
|
|
|
+ >
|
|
|
+ </el-input>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :span="16">
|
|
@@ -70,7 +102,8 @@
|
|
|
v-model="formData.data.contactNumber"
|
|
|
placeholder="联系电话"
|
|
|
:formatter="(val) => val.replace(/[^\d\-]/g, '')"
|
|
|
- :parser="(val) => val.replace(/[^\d\-]/g, '')">
|
|
|
+ :parser="(val) => val.replace(/[^\d\-]/g, '')"
|
|
|
+ >
|
|
|
</el-input>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
@@ -80,12 +113,22 @@
|
|
|
<el-row :gutter="10" style="width: 100%">
|
|
|
<el-col :span="8">
|
|
|
<el-form-item prop="accountPeriod">
|
|
|
- <el-input-number v-model="formData.data.accountPeriod" placeholder="请输入账期 (天)" style="width: 100%" :precision="0" :controls="false" :min="0" />
|
|
|
+ <el-input-number
|
|
|
+ v-model="formData.data.accountPeriod"
|
|
|
+ placeholder="请输入账期 (天)"
|
|
|
+ style="width: 100%"
|
|
|
+ :precision="0"
|
|
|
+ :controls="false"
|
|
|
+ :min="0"
|
|
|
+ />
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :span="16">
|
|
|
<el-form-item prop="accountPeriodRemark">
|
|
|
- <el-input v-model="formData.data.accountPeriodRemark" placeholder="请输入账期说明" />
|
|
|
+ <el-input
|
|
|
+ v-model="formData.data.accountPeriodRemark"
|
|
|
+ placeholder="请输入账期说明"
|
|
|
+ />
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
@@ -98,7 +141,8 @@
|
|
|
:data="uploadData"
|
|
|
multiple
|
|
|
:before-upload="uploadFile"
|
|
|
- :on-preview="onPreviewFile">
|
|
|
+ :on-preview="onPreviewFile"
|
|
|
+ >
|
|
|
<el-button>选择</el-button>
|
|
|
</el-upload>
|
|
|
</div>
|
|
@@ -106,7 +150,14 @@
|
|
|
</byForm>
|
|
|
<template #footer>
|
|
|
<el-button @click="dialogVisible = false" size="large">取 消</el-button>
|
|
|
- <el-button type="primary" @click="submitForm()" size="large" :loading="submitLoading"> 确 定 </el-button>
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ @click="submitForm()"
|
|
|
+ size="large"
|
|
|
+ :loading="submitLoading"
|
|
|
+ >
|
|
|
+ 确 定
|
|
|
+ </el-button>
|
|
|
</template>
|
|
|
</el-dialog>
|
|
|
</div>
|
|
@@ -139,11 +190,13 @@ let rules = ref({
|
|
|
name: [{ required: true, message: "请输入供应商名称", trigger: "blur" }],
|
|
|
type: [{ required: true, message: "请选择供应商类型", trigger: "change" }],
|
|
|
countryId: [{ required: true, message: "请选择国家", trigger: "change" }],
|
|
|
- provinceId: [{ required: true, message: "请选择省/洲", trigger: "change" }],
|
|
|
- cityId: [{ required: true, message: "请选择城市", trigger: "change" }],
|
|
|
+ // provinceId: [{ required: true, message: "请选择省/洲", trigger: "change" }],
|
|
|
+ // cityId: [{ required: true, message: "请选择城市", trigger: "change" }],
|
|
|
areaDetail: [{ required: true, message: "请输入详细地址", trigger: "blur" }],
|
|
|
contactPerson: [{ required: true, message: "请输入联系人", trigger: "blur" }],
|
|
|
- contactNumber: [{ required: true, message: "请输入联系电话", trigger: "blur" }],
|
|
|
+ contactNumber: [
|
|
|
+ { required: true, message: "请输入联系电话", trigger: "blur" },
|
|
|
+ ],
|
|
|
});
|
|
|
const { proxy } = getCurrentInstance();
|
|
|
const selectConfig = reactive([
|
|
@@ -228,11 +281,15 @@ const config = computed(() => {
|
|
|
},
|
|
|
el: "button",
|
|
|
click() {
|
|
|
- ElMessageBox.confirm("此操作将永久删除该数据, 是否继续?", "提示", {
|
|
|
- confirmButtonText: "确定",
|
|
|
- cancelButtonText: "取消",
|
|
|
- type: "warning",
|
|
|
- }).then(() => {
|
|
|
+ ElMessageBox.confirm(
|
|
|
+ "此操作将永久删除该数据, 是否继续?",
|
|
|
+ "提示",
|
|
|
+ {
|
|
|
+ confirmButtonText: "确定",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning",
|
|
|
+ }
|
|
|
+ ).then(() => {
|
|
|
proxy
|
|
|
.post("/supplierInfo/delete", {
|
|
|
id: row.id,
|
|
@@ -285,10 +342,28 @@ const formConfig = computed(() => {
|
|
|
},
|
|
|
{
|
|
|
type: "slot",
|
|
|
- slotName: "address",
|
|
|
+ slotName: "countryId",
|
|
|
prop: "countryId",
|
|
|
- label: "地址",
|
|
|
- required: true,
|
|
|
+ label: "详细地址",
|
|
|
+ itemWidth: 33.33,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "slot",
|
|
|
+ slotName: "provinceId",
|
|
|
+ label: " ",
|
|
|
+ itemWidth: 33.33,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "slot",
|
|
|
+ slotName: "cityId",
|
|
|
+ prop: "cityId",
|
|
|
+ label: " ",
|
|
|
+ itemWidth: 33.33,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: "input",
|
|
|
+ itemType: "textarea",
|
|
|
+ prop: "areaDetail",
|
|
|
},
|
|
|
{
|
|
|
type: "slot",
|
|
@@ -345,14 +420,16 @@ const formConfig = computed(() => {
|
|
|
const getList = async (req) => {
|
|
|
sourceList.value.pagination = { ...sourceList.value.pagination, ...req };
|
|
|
loading.value = true;
|
|
|
- proxy.post("/supplierInfo/page", sourceList.value.pagination).then((message) => {
|
|
|
- console.log(message);
|
|
|
- sourceList.value.data = message.rows;
|
|
|
- sourceList.value.pagination.total = message.total;
|
|
|
- setTimeout(() => {
|
|
|
- loading.value = false;
|
|
|
- }, 200);
|
|
|
- });
|
|
|
+ proxy
|
|
|
+ .post("/supplierInfo/page", sourceList.value.pagination)
|
|
|
+ .then((message) => {
|
|
|
+ console.log(message);
|
|
|
+ sourceList.value.data = message.rows;
|
|
|
+ sourceList.value.pagination.total = message.total;
|
|
|
+ setTimeout(() => {
|
|
|
+ loading.value = false;
|
|
|
+ }, 200);
|
|
|
+ });
|
|
|
};
|
|
|
const openModal = () => {
|
|
|
dialogVisible.value = true;
|
|
@@ -360,7 +437,7 @@ const openModal = () => {
|
|
|
fileList.value = [];
|
|
|
formData.data = {
|
|
|
type: "sales",
|
|
|
- countryId: "China",
|
|
|
+ countryId: "44",
|
|
|
};
|
|
|
getCityData(formData.data.countryId, "20");
|
|
|
};
|
|
@@ -408,39 +485,44 @@ const getDtl = (row) => {
|
|
|
fileList.value = [];
|
|
|
modalType.value = "edit";
|
|
|
proxy.post("/supplierInfo/detail", { id: row.id }).then((res) => {
|
|
|
- proxy.post("/fileInfo/getList", { businessIdList: [row.id] }).then((fileObj) => {
|
|
|
- if (fileObj[row.id] && fileObj[row.id].length > 0) {
|
|
|
- fileList.value = fileObj[row.id].map((item) => {
|
|
|
- return {
|
|
|
- raw: item,
|
|
|
- name: item.fileName,
|
|
|
- url: item.fileUrl,
|
|
|
- };
|
|
|
- });
|
|
|
- }
|
|
|
- getCityData(res.countryId, "20");
|
|
|
- getCityData(res.provinceId, "30");
|
|
|
- res.type = res.type + "";
|
|
|
- formData.data = res;
|
|
|
- dialogVisible.value = true;
|
|
|
- });
|
|
|
+ proxy
|
|
|
+ .post("/fileInfo/getList", { businessIdList: [row.id] })
|
|
|
+ .then((fileObj) => {
|
|
|
+ if (fileObj[row.id] && fileObj[row.id].length > 0) {
|
|
|
+ fileList.value = fileObj[row.id].map((item) => {
|
|
|
+ return {
|
|
|
+ raw: item,
|
|
|
+ name: item.fileName,
|
|
|
+ url: item.fileUrl,
|
|
|
+ };
|
|
|
+ });
|
|
|
+ }
|
|
|
+ getCityData(res.countryId, "20");
|
|
|
+ getCityData(res.provinceId, "30");
|
|
|
+ res.type = res.type + "";
|
|
|
+ formData.data = res;
|
|
|
+ dialogVisible.value = true;
|
|
|
+ });
|
|
|
});
|
|
|
};
|
|
|
const countryData = ref([]);
|
|
|
const provinceData = ref([]);
|
|
|
const cityData = ref([]);
|
|
|
-const getCityData = (id, type, isChange) => {
|
|
|
- proxy.post("/areaInfo/list", { parentId: id }).then((res) => {
|
|
|
+const getCityData = (id, type, flag) => {
|
|
|
+ proxy.post("/customizeArea/list", { parentId: id }).then((res) => {
|
|
|
if (type === "20") {
|
|
|
provinceData.value = res;
|
|
|
- if (isChange) {
|
|
|
+ if (flag) {
|
|
|
formData.data.provinceId = "";
|
|
|
+ formData.data.provinceName = "";
|
|
|
formData.data.cityId = "";
|
|
|
+ formData.data.cityName = "";
|
|
|
}
|
|
|
} else if (type === "30") {
|
|
|
cityData.value = res;
|
|
|
- if (isChange) {
|
|
|
+ if (flag) {
|
|
|
formData.data.cityId = "";
|
|
|
+ formData.data.cityName = "";
|
|
|
}
|
|
|
} else {
|
|
|
countryData.value = res;
|