|
|
@@ -240,10 +240,20 @@
|
|
|
></el-date-picker>
|
|
|
</el-form-item>
|
|
|
<el-form-item prop="loadPort" label="装货港">
|
|
|
- <el-input v-model="voyageForm.loadPort"></el-input>
|
|
|
+ <el-autocomplete
|
|
|
+ v-model="voyageForm.loadPort"
|
|
|
+ :fetch-suggestions="getCol"
|
|
|
+ placeholder="选择装货港"
|
|
|
+ @select="selectLoadPort"
|
|
|
+ />
|
|
|
</el-form-item>
|
|
|
<el-form-item prop="dischargeProt" label="卸货港">
|
|
|
- <el-input v-model="voyageForm.dischargeProt"></el-input>
|
|
|
+ <el-autocomplete
|
|
|
+ v-model="voyageForm.dischargeProt"
|
|
|
+ :fetch-suggestions="getCol"
|
|
|
+ placeholder="选择卸货港"
|
|
|
+ @select="selectDischargeProt"
|
|
|
+ />
|
|
|
</el-form-item>
|
|
|
<el-form-item prop="cargo" label="货种">
|
|
|
<el-input v-model="voyageForm.cargo"></el-input>
|
|
|
@@ -636,6 +646,28 @@ export default {
|
|
|
getShipOwnerListByShipId();
|
|
|
}
|
|
|
|
|
|
+ const getCol = _.debounce(
|
|
|
+ async (queryString, cb) => {
|
|
|
+ if (!queryString) return;
|
|
|
+ let res = await api.getCol({
|
|
|
+ term: queryString,
|
|
|
+ });
|
|
|
+ if (res.data.status == 0) {
|
|
|
+ cb(res.data.result);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ 1500,
|
|
|
+ { leading: true }
|
|
|
+ );
|
|
|
+
|
|
|
+ const selectLoadPort = (item) => {
|
|
|
+ voyageForm.voyageForm.loadPort = item.value;
|
|
|
+ };
|
|
|
+
|
|
|
+ const selectDischargeProt = (item) => {
|
|
|
+ voyageForm.voyageForm.dischargeProt = item.value;
|
|
|
+ };
|
|
|
+
|
|
|
onMounted(() => {
|
|
|
getShipDetail();
|
|
|
getVoyageList();
|
|
|
@@ -682,6 +714,9 @@ export default {
|
|
|
shipOwnerDetail,
|
|
|
shipOwnerPageChange,
|
|
|
shipOwnerTotal,
|
|
|
+ getCol,
|
|
|
+ selectLoadPort,
|
|
|
+ selectDischargeProt,
|
|
|
// uploadUrl,
|
|
|
};
|
|
|
},
|
