diff --git a/farmdata2_modules/fd2_tabs/fd2_field_kit/fd2_field_kit.module b/farmdata2_modules/fd2_tabs/fd2_field_kit/fd2_field_kit.module
index 9f43691511..500ec67c44 100644
--- a/farmdata2_modules/fd2_tabs/fd2_field_kit/fd2_field_kit.module
+++ b/farmdata2_modules/fd2_tabs/fd2_field_kit/fd2_field_kit.module
@@ -65,6 +65,15 @@ function fd2_field_kit_menu() {
     'weight' => 100,
   );
 
+    $items['farm/fd2-field-kit/transplantingInput'] = array(
+    'title' => 'Transplanting Input',
+    'type' => MENU_LOCAL_TASK,
+    'page callback' => 'fd2_field_kit_view',
+    'page arguments' => array('transplantingInput.html'),
+    'access arguments' => array('view fd2 field kit'),
+    'weight' => 101,
+  );
+
   return $items;
 };
 
diff --git a/farmdata2_modules/fd2_tabs/fd2_field_kit/transplantingInput.html b/farmdata2_modules/fd2_tabs/fd2_field_kit/transplantingInput.html
new file mode 100644
index 0000000000..f6b8ec708c
--- /dev/null
+++ b/farmdata2_modules/fd2_tabs/fd2_field_kit/transplantingInput.html
@@ -0,0 +1,614 @@
+<body>
+    <div id='transplantingInput'>
+        <div v-show="selectionInProgress == true">
+            <h1 style='text-align: center;'>Transplanting Input Log</h1> 
+            <p style='text-align: center; margin-bottom: 15px;'>Please select a plant to transplant</p>
+            <div v-if="assetList.length != 0">
+                <fieldset data-cy="filters-panel" class="center-block panel panel-default" style="width: 50%;">
+                    <legend class="panel-heading" style="background-color: #d62a17; color: white;">Filters</legend>
+                        <div style="display: flex; width: 100%;">                    
+                            <dropdown-with-all data-cy="crop-dropdown" class="center-block" :dropdown-list='cropArray' includes-all selected-val='All'>Crop:</dropdown-with-all>
+                            <dropdown-with-all data-cy="area-dropdown" class="center-block" :dropdown-list='areaFilter' includes-all selected-val='All'>Area:</dropdown-with-all> 
+                        </div>
+                    </fieldset>
+                <custom-table data-cy="report-table" :rows='tableRows' :headers='headers' style="width: 10%;"></custom-table>
+            </div>
+        </div>
+        <div v-show="selectionInProgress == false">
+            <h1 style='text-align:center;'>Transplanting Input Log</h1> 
+            <div class="alert-boxs" style='max-width: 500px; text-align: center; margin:auto; font-size: large'>
+                <div data-cy='alert-success' class="alert alert-success" role="alert" v-show="isConfirmed == true">
+                    Log created and saved successfully.
+                </div>
+                <div data-cy='alert-cancel'class="alert alert-danger" style="display: none;" role="alert" v-show="isConfirmed == false">
+                    Log submission canceled by user. The log is <strong>NOT</strong> saved.  
+                </div>
+            </div>
+            <fieldset class="panel panel-default center-block" style='max-width: 500px; margin-top: 25px;'>
+                <legend class="panel-heading" style='background-color: #da4f3f; color: white;font-size: x-large;'>Data</legend>
+                    <div class="center-block" style='padding: 12px;text-align:center;font-size: medium; margin-top: 50px;'>
+                        <date-selection data-cy="date-selection" :set-date='selectedDate' @date-changed='setNewDate' v-model='selectedDate' :min="getMinDate" :max="getMaxDate" :disabled='submitInProgress'>Date:<label style='color: #da4f3f'>*</label></date-selection> 
+                        <br>
+                        <dropdown-with-all data-cy="crop-selection" :dropdown-list='cropArray' @selection-changed='setNewCrop' :disabled='submitInProgress'>Crop:<label style='color: #da4f3f; margin-top: 15px'>*</label></dropdown-with-all>
+                        <br>
+                        <dropdown-with-all data-cy="seed-date-selection" :dropdown-list='seedingDateFilter' @selection-changed='setNewSeedDate' :disabled='submitInProgress' v-show="cropNotNull == true">Date of seeding:<label style='color: #da4f3f; margin-top: 15px'>*</label></dropdown-with-all>
+                        <br>
+                    </div>
+            </fieldset>
+
+            <fieldset class="panel panel-default center-block" style="max-width: 500px;">
+                <legend class="panel-heading" style='background-color: #da4f3f; color: white;font-size: x-large;'>Transplanted</legend>
+                <div class="center-block" style='padding: 12px;text-align:center;font-size: medium; margin-top: 45px;'>
+                    <dropdown-with-all data-cy="area-selection" :dropdown-list='areaFilter' @selection-changed='setNewArea' :disabled='submitInProgress'>Area:<label style='color: #da4f3f; margin-top: 15px'>*</label></dropdown-with-all>
+                    <br>
+                    <label><dropdown-with-all data-cy='unit-feet' :selected-val='selectedFeetUnit' :dropdown-list='feetUnits' @selection-changed='setNewFeetUnit' style='padding-left:20px;' :disabled='submitInProgress'></dropdown-with-all>
+                    <label style='color: #da4f3f; margin-top: 15px'>*</label>
+                    <regex-input data-cy='num-feet-input':reg-exp="regPosInt" set-type="number" :default-val="numFeet" set-min="0" :disabled="submitInProgress" @input-changed="setNewNumFeet" @match-changed="(newBool) => updateValidMap('validNumFeet', newBool)"></regex-input> 
+                    <label for='BedRows'>Rows/Bed: <label style='color: #da4f3f; margin-top: 15px'>*</label>
+                    <regex-input data-cy='num-rowbed-input' :reg-exp="regPosInt" set-type="number" :default-val="numRowBed" set-min="0" :disabled="submitInProgress" @input-changed="setNewNumRowBed" @match-changed="(newBool) => updateValidMap('validNumRowBed', newBool)"></regex-input>
+                    <label>Trays:<label style='color: #da4f3f'>*</label> 
+                    <regex-input data-cy='num-tray-input' :reg-exp="regPosInt" :default-val="numOfTrays" set-type="number" set-min="0" :disabled="submitInProgress" @input-changed="setNewNumOfTrays" @match-changed="(newBool) => updateValidMap('validNumOfTrays', newBool)"></regex-input> 
+                </div>
+            </fieldset>
+
+            <fieldset class="panel panel-default center-block" style="max-width: 500px;">
+                <legend class="panel-heading" style='background-color: #da4f3f; color: white;font-size: x-large;'>Labor</legend>
+                <div class="center-block" style='padding: 12px;text-align:center;font-size: medium; margin-top: 45px;'>
+                    <label style='color: #da4f3f'>*&nbsp;</label>
+                    <regex-input data-cy='num-worker-input' :reg-exp="regPosInt" :default-val="numWorkers" set-type="number" set-min="0" :disabled="submitInProgress" @input-changed="setNewNumWorkers" @match-changed="(newBool) => updateValidMap('validNumWorkers', newBool)"></regex-input>                                                
+                    <label>&nbsp; Worker(s) for </label> 
+                    <label><label style='color: #da4f3f'>*</label> 
+                    <regex-input data-cy='minute-input' v-show='selectedTimeUnit == "minutes"' :reg-exp='regPosInt' :default-val="minute" set-type="number" set-min="0" :disabled="submitInProgress" @input-changed="setMinute" @match-changed="(newBool) => updateValidMap('validMinute', newBool)"></regex-input>                                                
+                    <regex-input data-cy='hour-input' v-show='selectedTimeUnit == "hours"' :reg-exp='regHour' :default-val="hour" set-type="number" set-min="0" :disabled="submitInProgress" @input-changed="setHour" @match-changed="(newBool) => updateValidMap('validHour', newBool)"></regex-input>                                                
+                    <dropdown-with-all data-cy='time-unit' style='text-align:center;' :selected-val='selectedTimeUnit' :dropdown-list='timeUnits' @selection-changed='setNewTimeUnit' :disabled='submitInProgress'></dropdown-with-all></label>
+                </div>
+            </fieldset>
+            <fieldset class="panel panel-default center-block" style='max-width: 500px; '>
+                <legend class="panel-heading" style='background-color: #da4f3f; color: white;font-size: x-large;'>Comments</legend>
+                <div class="center-block" style='padding: 12px; text-align: center; font-size: medium; margin-top: 45px;'>
+                    <textarea data-cy="comments" v-model='comments' style='height: 25px; width: 400px;' :disabled='submitInProgress'></textarea>
+                </div>
+                </fieldset>
+            <div style='text-align:center;'>
+                <label style='color: #da4f3f'>* required field.</label>
+            </div>
+            <div class="confirm-cancel-button" style='display: flex; justify-content: center;' v-show="submitInProgress==true">
+                <button data-cy="confirm-button" class="btn center-block" style='background-color: #da4f3f; color: white; margin: 15px; width: 100px; font-size: large;' @click='saveLog'>Confirm</button>
+                <button data-cy="cancel-button" class="btn center-block" style='background-color: gray; color: white; margin: 15px; width: 100px; font-size: large;' @click='cancelLog'>Cancel</button>
+            </div>
+            <button data-cy="submit-button" class="btn center-block" style='background-color: #da4f3f; color: white; font-size: large;' :disabled='formNotCompleted' @click='submitLog'>Submit</button>
+        </div>
+
+    <script>
+        new Vue({
+            el: '#transplantingInput',
+            components:{
+                'custom-table': CustomTableComponent,
+                'date-selection': DateSelectionComponent,
+                'dropdown-with-all': DropdownWithAllComponent,
+                'regex-input': RegexInputComponent,
+            },
+            data:{
+                sessionToken: null,
+                selectedDate: dayjs().format('YYYY-MM-DD').toString(),
+                selectedCrop: null,
+                selectedArea: null,
+                savedArea: null,
+                selectedSeedDate: null, //some crops don't have tray seeding dates (N/A ->0000-00-00) as they arrived in trays
+                selectedTimeUnit: 'minutes',
+                comments: '',
+                numWorkers: null,
+                minute: null,
+                hour: null, 
+                numRowBed: null,
+                numFeet: null,
+                numOfTrays: null,
+                selectedFeetUnit: 'Bed Feet',	
+                cropArray: [],
+                areaResponse: [],
+                assetResponse: [],
+                timeUnits: ['minutes', 'hours'],
+                feetUnits: ['Bed Feet', 'Row Feet'],
+
+                headers: ['Date', 'Crop', 'Area'],
+                assetList: [],
+
+                idToCropMap: new Map(),
+                cropToSeedDate: new Object(),
+                traySeedingLogs: new Array(),
+                cropToIDMap: new Map(),
+                userToIDMap: new Map(),
+                areaToIDMap: new Map(),
+                logTypeToIDMap: new Map(),
+                plantingId: 0,
+                isConfirmed: null,
+                submitInProgress: false, 
+                selectionInProgress: true,
+                cropNotNull: false,
+                validMap: {
+                    "validNumWorkers": false,
+                    "validMinute": false,
+                    "validHour": false,
+                    "validNumRowBed": false,
+                    "validNumFeet": false,
+                },
+                
+                regPosInt: "^[1-9]+[0-9]*$",
+                regHour:"^[1-9]+[0-9]*([.][0-9]{1,2}){0,1}$|^[0]{0,1}[.][1-9][0-9]{0,1}$|^[0]{0,1}[1-9]$|^[1-9]+[0-9]*\.$"
+            },
+            methods:{
+                setNewDate(newDate){
+                    this.selectedDate = newDate
+                },
+                setNewCrop(newCrop){
+                    if(newCrop == null){
+                        this.cropNotNull = false
+                    }
+                    else{
+                        this.cropNotNull = true
+                        this.selectedCrop = newCrop
+                    }
+                },
+                setNewArea(newArea){
+                    this.selectedArea = newArea
+                    this.savedArea = newArea
+                },
+                setNewSeedDate(newSeedDate){
+                    this.selectedSeedDate = newSeedDate
+                    // Reset currently selected transplanting date
+                    this.selectedDate = dayjs().format('YYYY-MM-DD').toString()
+                },
+                setNewTimeUnit(newTimeUnit){
+                    this.selectedTimeUnit = newTimeUnit
+                },
+                setNewBedRows(newBedRows){
+                    this.rowsPerBed = newBedRows
+                },
+                setNewBedFeet(newBedFeet){
+                    this.bedFeet = newBedFeet
+                },
+                updateValidMap(key, bool) {    
+                    this.validMap[key] = bool;
+                },
+                setNewFeetUnit(newFeetUnit){
+                    this.selectedFeetUnit = newFeetUnit
+                },
+                setNewNumOfTrays(newNumOfTrays){
+                    this.numOfTrays = newNumOfTrays
+                },
+                setNewNumSeedsPlanted(newNumSeedsPlanted) {
+                    this.numSeedsPlanted = newNumSeedsPlanted
+                },
+                setNewNumRowBed(newNumRowBed) {
+                    this.numRowBed = newNumRowBed
+                },
+                setNewNumFeet(newNumFeet) {
+                    this.numFeet = newNumFeet
+                },
+                setNewNumWorkers(newNumWorkers) {
+                    this.numWorkers = newNumWorkers
+                },
+                setMinute(newMinute) {
+                    this.minute = newMinute
+                },
+                setHour(newHour) {
+                    this.hour = newHour
+                },
+                submitLog() {
+                    this.submitInProgress = true
+                },
+                saveLog() {
+                    createRecord('/farm_asset', this.plantingLogData, this.sessionToken).then((response) => {
+                        this.plantingId = response.data.id
+                    }).then(() => {
+                        createRecord('/log', this.logData, this.sessionToken).then((response) => {
+                        })
+                    })
+                    this.isConfirmed = true
+                    this.submitInProgress = false
+                    setTimeout(() => {
+                        this.isConfirmed = null 
+                    }, 3000)    
+                },
+                cancelLog() {
+                    this.submitInProgress = false
+                    this.isConfirmed = false
+                    setTimeout(() => { 
+                        this.isConfirmed = null
+                    }, 3000)
+                },
+                // saveLog(){
+                //     createRecord('/farm_asset', this.plantingLogData, this.sessionToken).then((response) => {
+                //         this.plantingId = response.data.id
+                //     }).then(() => {
+                //         createRecord('/log', this.logData, this.sessionToken).then((response) => {
+                //         })
+                //     })
+                //     if(confirm("You have saved a log! Would you like to go the transplanting report page?")){
+                //         //Modify later after checking the endpoint
+                //         console.log("log created successfully")
+                //         window.location.replace('/farm/fd2-barn-kit/transplantingReport')
+                //     }
+                // },
+                sixMonthsFilter(pastTime) {
+                    const now = new Date();
+
+                    // 6 months = 182 days in average
+                    const sixMonthsInMs = 182 * 24 * 60 * 60 * 1000; 
+
+                    const timeDiffInMs = now.getTime() - pastTime.getTime();
+
+                    // Only crops that have been seeded within 6 months from now are eligible for transplanting
+                    if(timeDiffInMs <= sixMonthsInMs) {
+                        return true;
+                    } else{
+                        return false;
+                    }
+                }
+            },
+            computed: {
+                tableRows() {
+                    let filterRows = this.assetResponse.filter((x) => x)
+                    
+                    if(this.selectedArea != 'All'){
+                        filterRows = filterRows.filter((x) => x.location[0].name === this.selectedArea)
+                    }
+                    if(this.selectedCrop != 'All'){
+                        filterRows = filterRows.filter((x) => x.crop[0].name === this.selectedCrop)
+                    }
+                    let $vm = this
+                    let rows = filterRows.map(function(h) {
+                        return{
+                            id: h.id,
+                            data: [
+                                dayjs.unix(h.created).format('YYYY-MM-DD'),
+                                h.crop[0].name,
+                                h.location[0].name, 
+
+                            ]
+                        }
+                    })
+
+                    console.log("Total length of rows: " + rows.length)
+                    for(let i = 0; i < rows.length - 1; i++ ){
+                        if(!(this.areaFilter.includes(rows[i].data[2]))){
+                            console.log(i + ": The location that should be removed: " + rows[i].data[2] )
+                            rows.splice(i, 1)
+                        }
+                    }
+                    rows.sort(function compareNumbers(a, b) {
+                        return new Date(a.data[0]).getTime() - new Date(b.data[0]).getTime();
+                    })   
+                    return rows
+                },
+                // cropList(){
+                //     let cropArray = []
+                //     if(this.selectedArea != 'All'){
+                //         let areaFilter = this.assetList.filter((x) => x.data[2] === this.selectedArea)
+                //         cropArray = areaFilter.map(h => 
+                //             this.idToCropMap.get(h.data.crop_tid)
+                //         )
+                //     }
+                //     else{
+                //         cropArray = this.assetList.map(h=> 
+                //             this.idToCropMap.get(h.data[1])
+                //         )
+                //     }
+
+                //     let crops = new Set(cropArray)
+                //     let newCropArray = Array.from(crops)
+                //     return newCropArray.sort()
+                // },
+                // areaList(){
+                //     let areaArray = []
+                //     if(this.selectedCrop != 'All'){
+                //         let cropFilter = this.assetList.filter((x) => this.idToCropMap.get(x.data[1]) === this.selectedCrop)
+                //         areaArray = cropFilter.map(h =>
+                //             h.movement.data[2]
+                //         )
+                //     }
+                //     else{
+                //         areaArray = this.assetList.map(h =>
+                //             h.movement.data[2]
+                //         )
+                //     }
+                //     let areas = new Set(areaArray)
+                //     let newAreaArray = Array.from(areas)
+                //     return newAreaArray.sort()
+                // },
+                getMinDate() {
+                    if (this.selectedSeedDate != "N/A" && this.selectedSeedDate != null) {
+                        // Convert date string MM/DD/YYYY to Date
+                        const month = +this.selectedSeedDate.substring(0, 2);
+                        const day = +this.selectedSeedDate.substring(3, 5);
+                        const year = +this.selectedSeedDate.substring(6, 10);
+
+                        const date = new Date(year, month - 1, day);
+                        return date.toISOString().slice(0,10);
+                    }
+                },
+                getMaxDate() {
+                    if (this.selectedSeedDate != "N/A" && this.selectedSeedDate != null) {
+                        // Convert date string MM/DD/YYYY to Date
+                        const month = +this.selectedSeedDate.substring(0, 2);
+                        const day = +this.selectedSeedDate.substring(3, 5);
+                        const year = +this.selectedSeedDate.substring(6, 10);
+
+                        // Get the date 6 months from the selected seeding date
+                        const date = new Date(year, month - 1 + 6, day);
+
+                        return date.toISOString().slice(0,10);
+                    }
+                },
+                seedingDateFilter() {
+                    let seedingDateArray = []
+
+                    if (this.selectedCrop !== null && this.cropToSeedDate[this.selectedCrop] !== undefined) {
+                        // Reverse the array so that most recent days appear on top of the list
+                        this.cropToSeedDate[this.selectedCrop].reverse()
+                        seedingDateArray = this.cropToSeedDate[this.selectedCrop]
+                    }
+                    return seedingDateArray
+                },
+                cropToSeedingDateFilter() {
+                    let march2022TestDate = 1647489600;
+                    const options = { year: 'numeric', month: '2-digit', day: '2-digit' };
+
+                    for (let i = 0; i < this.cropArray.length; i++){
+                            this.cropToSeedDate[this.cropArray[i]] = new Array()
+                    }  
+                    for (let log of this.traySeedingLogs) {
+                        let cropName = this.idToCropMap.get(log.data.crop_tid)
+                        let seedingDate = new Date(log.timestamp*1000)
+                        if (this.sixMonthsFilter(seedingDate)) {
+                            this.cropToSeedDate[cropName].push(seedingDate.toLocaleDateString("en-US", options))
+                        }
+                    }
+                    for (let i = 0; i < this.cropArray.length; i++){
+                        this.cropToSeedDate[this.cropArray[i]].push(new Date(march2022TestDate*1000).toLocaleDateString("en-US", options))
+                        this.cropToSeedDate[this.cropArray[i]].push("N/A")
+                    }
+                },
+                areaFilter(){
+                    let areaArray = []
+                    let trayAreaOnly = this.areaResponse.filter((x) => x.area_type === 'greenhouse')
+                    areaArray = trayAreaOnly.map((h) => h.name)
+                    if(!areaArray.includes(this.selectedArea)){
+                        this.selectedArea = null
+                    }
+                    if(areaArray.includes(this.savedArea)){
+                        this.selectedArea = this.savedArea
+                    }
+                    return areaArray
+                },
+                formNotCompleted(){
+                    if (this.submitInProgress == true){
+                        return true
+                    }
+                    if(this.selectedCrop == null){
+                        return true
+                    }
+                    if(this.selectedArea == null){
+                        return true
+                    }
+                    if(this.selectedSeedDate == null){
+                        return true
+                    }
+                    if(this.selectedTimeUnit == 'minutes'){
+                        if(!this.validMap["validMinute"]){
+                            return true
+                        }
+                    }
+                    if(this.selectedTimeUnit == 'hours'){
+                        if(!this.validMap["validHour"]){
+                            return true
+                        }
+                    }
+                    if(!this.validMap["validNumFeet"]){
+                        return true
+                    }
+                    if(!this.validMap["validNumRowBed"]){
+                        return true
+                    }
+                    if(!this.validMap["validNumOfTrays"]){
+                        return true
+                    }
+                    if(!this.validMap["validNumWorkers"]){
+                        return true
+                    }
+                    return false
+                },
+                plantingLogData(){
+                    planting = {
+                        "name": this.selectedDate + " " + this.selectedCrop + " " + this.selectedArea,
+                        "type": "planting",
+                        "crop": [{
+                            "id": this.cropToIDMap.get(this.selectedCrop),
+                            "resource": "taxonomy_term"
+                        }],
+                    }
+                    return planting
+                },
+                logData(){
+                    let transplantingID = this.logTypeToIDMap.get('Transplantings')
+                    let quantityUnits = this.quantityTransplanting
+                    
+                    transplanting = {
+                        "name": this.selectedDate + " " + this.selectedCrop + " " + this.selectedArea,
+                        "type": "farm_transplanting",
+                        "timestamp": dayjs(this.selectedDate).unix(),
+                        "done": "1",  //any transplanting recorded is done.
+                        "notes": {
+                            "value": this.comments,
+                            "format": "farm_format"
+                        },
+                        "asset": [{ 
+                            "id": this.plantingId,   //Associated planting
+                            "resource": "farm_asset"
+                        }],
+                        "log_category": [{
+                            "id": transplantingID,
+                            "resource": "taxonomy_term"
+                        }],
+                        "movement": {
+                            "area": [{
+                                "id": this.areaToIDMap.get(this.selectedArea),
+                                "resource": "taxonomy_term"
+                            }]
+                        },
+                        "quantity": quantityUnits,
+                        "created": dayjs().unix(),
+                        "data": { 
+                            "crop_tid": this.cropToIDMap.get(this.selectedCrop)
+                        }
+                    }
+                    return transplanting
+                },
+                quantityTransplanting() {
+                    let time = this.time
+                    let feet = this.bedFeet * this.rowsPerBed //bedFeet needs changing to "numFeet"
+                    if(this.selectedTimeUnit == 'minutes'){
+                        time = (Math.round((time / 60)*100))/100
+                    }
+                    quantity = [
+                        {
+                            "measure": "length", 
+                            "value": feet,  //number of row feet 
+                            "unit": {
+                                "id": this.unitToIDMap.get('ROW FEET'), 
+                                "resource": "taxonomy_term"
+                            },
+                            "label": "Amount planted"
+                        },
+                        {
+                            "measure": "ratio", 
+                            "value": this.rowsPerBed,  
+                            "unit": {
+                                "id": this.unitToIDMap.get('ROWS/BED'), 
+                                "resource": "taxonomy_term"
+                            },
+                            "label": "Rows/Bed"
+                        },
+                        {
+                            "measure": "time", 
+                            "value": time,  //hours worked
+                            "unit": {
+                                "id": this.unitToIDMap.get('HOURS'),
+                                "resource": "taxonomy_term"
+                            },
+                            "label": "Labor"
+                        },
+                        {
+                            "measure": "count", 
+                            "value": this.numWorkers,
+                            "unit": {
+                                "id": this.unitToIDMap.get('PEOPLE'),
+                                "resource": "taxonomy_term"
+                            },
+                            "label": "Workers"
+                        },
+                    ]
+                    return quantity
+                },
+            },
+            created() {
+                // Store crop names in local cache
+                let fullResponse = []
+                if(localStorage.getItem('crops') == null){
+                    getAllPages('/taxonomy_term.json?bundle=farm_crops',fullResponse).then(() => {
+                        this.cropArray = fullResponse.map((h) => h.name)
+                        localStorage.setItem('crops', JSON.stringify(this.cropArray))
+                    })
+                }else{
+                    this.cropArray = JSON.parse(localStorage.getItem('crops'))
+                    getAllPages('/taxonomy_term.json?bundle=farm_crops',fullResponse).then(() => {
+                        this.cropArray = fullResponse.map((h) => h.name)
+                        localStorage.setItem('crops', JSON.stringify(this.cropArray))
+                    })
+                }
+
+                // Store all tray seeding logs in local cache
+                if(localStorage.getItem('crop_to_seed_date') == null) {
+                    getAllPages('http://localhost/log.json?type=farm_seeding&log_category=Tray Seedings', this.traySeedingLogs).then(() => {
+                        this.cropToSeedingDateFilter
+                        localStorage.setItem('crop_to_seed_date', JSON.stringify(this.cropToSeedDate))
+                    })
+                } else {
+                    this.cropToSeedDate = JSON.parse(localStorage.getItem('crop_to_seed_date'))
+                    getAllPages('http://localhost/log.json?type=farm_seeding&log_category=Tray Seedings', this.traySeedingLogs).then(() => {
+                        this.cropToSeedingDateFilter
+                        localStorage.setItem('crop_to_seed_date', JSON.stringify(this.cropToSeedDate))
+                    })
+                }
+
+                // Store assets in local  cache
+                if(localStorage.getItem('areas') == null){
+                    getAllPages('/taxonomy_term.json?bundle=farm_areas', this.areaResponse).then(() => {
+                        localStorage.setItem('areas', JSON.stringify(this.areaResponse))
+                    })
+                }else{
+                    this.areaResponse = JSON.parse(localStorage.getItem('areas'))
+                    getAllPages('/taxonomy_term.json?bundle=farm_areas').then((resp) => {
+                        this.areaResponse = resp
+                        localStorage.setItem('areas', JSON.stringify(resp))
+                    })
+                }
+
+                // Store all area names in local cache
+                if(localStorage.getItem('active_plantings') == null){
+                    getAllPages('/farm_asset.json?type=planting', this.assetResponse).then(() => {
+                        localStorage.setItem('areas', JSON.stringify(this.assetResponse))
+                    })
+                }else{
+                    this.assetResponse = JSON.parse(localStorage.getItem('areas'))
+                    getAllPages('/farm_asset.json?type=planting').then((resp) => {
+                        this.assetResponse = resp
+                        localStorage.setItem('active_plantings', JSON.stringify(resp))
+                    })
+                }
+
+                getAllPages('/farm_asset.json?type=planting', this.assetList)
+                    .then(() => {
+                        //this.stillLoading = false
+                    })
+                    .catch((err) => { 
+                        // this.errBanner = true
+                        // var errorBanner = document.getElementById('scrollBanners')
+                        // var pageHeader = document.getElementById('navbar')
+                        // var headerBounds = pageHeader.getBoundingClientRect()
+                        // var alertBounds = errorBanner.getBoundingClientRect()
+                        // scrollBy({
+                        //     top: alertBounds.top - headerBounds.bottom,
+                        //     behavior: 'smooth'
+                        // })
+                    })
+                this.stillLoading = true
+
+                getSessionToken().then((response) => {
+                    this.sessionToken = response
+                })
+                getCropToIDMap().then((response) => {
+                    this.cropToIDMap = response
+                })
+                //#4 get ID to crop for Date of Tray Seeding matching
+                getIDToCropMap().then((response) => {
+                    this.idToCropMap = response
+                })
+
+                getUserToIDMap().then((response) => {
+                    this.userToIDMap = response
+                })
+                getAreaToIDMap().then((response) => {
+                    this.areaToIDMap = response
+                })
+                getUnitToIDMap().then((response) => {
+                    this.unitToIDMap = response
+                })
+                getLogTypeToIDMap().then((response) => {
+                    this.logTypeToIDMap = response
+                })
+            }
+        })
+    Vue.config.devtools = true;
+    </script>
+</body>
\ No newline at end of file
diff --git a/farmdata2_modules/fd2_tabs/fd2_field_kit/transplantingInput.spec.js b/farmdata2_modules/fd2_tabs/fd2_field_kit/transplantingInput.spec.js
new file mode 100644
index 0000000000..e69de29bb2
